Refactor Vue components using Composition API #230

- Migrate `StatefulVue`:
  - Introduce `UseCollectionState` that replaces its behavior and acts
    as a shared state store.
  - Add more encapsulated, granular functions based on read or write
    access to state in CollectionState.
- Some linting rules get activates due to new code-base compability to
  modern parses, fix linting errors.
  - Rename Dialog to ModalDialog as after refactoring,
    eslintvue/no-reserved-component-names does not allow name Dialog.
  - To comply with `vue/multi-word-component-names`, rename:
    - `Code`          -> `CodeInstruction`
    - `Handle`        -> `SliderHandle`
    - `Documentable`  -> `DocumentableNode`
    - `Node`          -> `NodeContent`
    - `INode`         -> `INodeContent`
    - `Responsive`    -> `SizeObserver`
- Remove `vue-property-decorator` and `vue-class-component`
  dependencies.
- Refactor `watch` with computed properties when possible for cleaner
  code.
  - Introduce `UseApplication` to reduce repeated code in new components
    that use `computed` more heavily than before.
- Change TypeScript target to `es2017` to allow top level async calls
  for getting application context/state/instance to simplify the code by
  removing async calls. However, mocha (unit and integration) tests do
  not run with top level awaits, so a workaround is used.

src/presentation/components/TheFooter/DownloadUrlList.vue

@@ -18,28 +18,35 @@
 </template>
 
 <script lang="ts">
-import { Component, Vue } from 'vue-property-decorator';
+import { defineComponent } from 'vue';
 import { Environment } from '@/application/Environment/Environment';
 import { OperatingSystem } from '@/domain/OperatingSystem';
 import DownloadUrlListItem from './DownloadUrlListItem.vue';
 
-@Component({
-  components: { DownloadUrlListItem },
-})
-export default class DownloadUrlList extends Vue {
-  public readonly supportedDesktops: ReadonlyArray<OperatingSystem>;
+const supportedOperativeSystems: readonly OperatingSystem[] = [
+  OperatingSystem.Windows,
+  OperatingSystem.Linux,
+  OperatingSystem.macOS,
+];
 
-  public readonly hasCurrentOsDesktopVersion: boolean = false;
-
-  constructor() {
-    super();
-    const supportedOperativeSystems = [
-      OperatingSystem.Windows, OperatingSystem.Linux, OperatingSystem.macOS];
+export default defineComponent({
+  components: {
+    DownloadUrlListItem,
+  },
+  setup() {
     const currentOs = Environment.CurrentEnvironment.os;
-    this.supportedDesktops = supportedOperativeSystems.sort((os) => (os === currentOs ? 0 : 1));
-    this.hasCurrentOsDesktopVersion = supportedOperativeSystems.includes(currentOs);
-  }
-}
+    const supportedDesktops = [
+      ...supportedOperativeSystems,
+    ].sort((os) => (os === currentOs ? 0 : 1));
+
+    const hasCurrentOsDesktopVersion = supportedOperativeSystems.includes(currentOs);
+
+    return {
+      supportedDesktops,
+      hasCurrentOsDesktopVersion,
+    };
+  },
+});
 </script>
 
 <style scoped lang="scss">