Transition to eslint-config-airbnb-with-typescript

- Migrate to newer `eslint-config-airbnb-with-typescript` from
  `eslint-config-airbnb`.
- Add also `rushstack/eslint-patch` as per instructed by
  `eslint-config-airbnb-with-typescript` docs.
- Update codebase to align with new linting standards.
- Add script to configure VS Code for effective linting for project
  developers, move it to `scripts` directory along with clean npm
  install script for better organization.

src/presentation/components/TheFooter/DownloadUrlList.vue

@@ -3,10 +3,10 @@
     class="container"
     v-bind:class="{
       'container-unsupported': !hasCurrentOsDesktopVersion,
-      'container-supported': hasCurrentOsDesktopVersion
+      'container-supported': hasCurrentOsDesktopVersion,
     }">
     <span class="description">
-      <font-awesome-icon class="description__icon" :icon="['fas', 'desktop']"  />
+      <font-awesome-icon class="description__icon" :icon="['fas', 'desktop']" />
       <span class="description__text">For desktop:</span>
     </span>
     <span class="urls">

src/presentation/components/TheFooter/DownloadUrlListItem.vue

@@ -1,9 +1,10 @@
 <template>
   <span class="url">
-    <a :href="downloadUrl"
-        v-bind:class="{
-        'url__active': hasCurrentOsDesktopVersion && isCurrentOs,
-        'url__inactive': hasCurrentOsDesktopVersion && !isCurrentOs,
+    <a
+      :href="downloadUrl"
+      v-bind:class="{
+        url__active: hasCurrentOsDesktopVersion && isCurrentOs,
+        url__inactive: hasCurrentOsDesktopVersion && !isCurrentOs,
       }">{{ operatingSystemName }}</a>
   </span>
 </template>

src/presentation/components/TheFooter/PrivacyPolicy.vue

@@ -17,14 +17,18 @@
     </div>
     <div class="line">
       <div class="line__emoji">🤖</div>
-      <div>All transparent: Deployed automatically from the master branch
-      of the <a :href="repositoryUrl" target="_blank">source code</a> with no changes.</div>
+      <div>
+        All transparent: Deployed automatically from the master branch
+        of the <a :href="repositoryUrl" target="_blank">source code</a> with no changes.
+      </div>
     </div>
     <div v-if="!isDesktop" class="line">
       <div class="line__emoji">📈</div>
-      <div>Basic <a href="https://aws.amazon.com/cloudfront/reporting/" target="_blank">CDN statistics</a>
-      are collected by AWS but they cannot be traced to you or your behavior.
-      You can download the offline version if you don't want any CDN data collection.</div>
+      <div>
+        Basic <a href="https://aws.amazon.com/cloudfront/reporting/" target="_blank">CDN statistics</a>
+        are collected by AWS but they cannot be traced to you or your behavior.
+        You can download the offline version if you don't want any CDN data collection.
+      </div>
     </div>
     <div class="line">
       <div class="line__emoji">🎉</div>

src/presentation/components/TheFooter/TheFooter.vue

@@ -3,7 +3,7 @@
     <div class="footer">
       <div class="footer__section">
         <span v-if="isDesktop" class="footer__section__item">
-          <font-awesome-icon class="icon" :icon="['fas', 'globe']"  />
+          <font-awesome-icon class="icon" :icon="['fas', 'globe']" />
           <span>
             Online version at <a :href="homepageUrl" target="_blank">{{ homepageUrl }}</a>
           </span>
@@ -15,30 +15,30 @@
       <div class="footer__section">
         <div class="footer__section__item">
           <a :href="feedbackUrl" target="_blank">
-            <font-awesome-icon class="icon" :icon="['far', 'smile']"  />
+            <font-awesome-icon class="icon" :icon="['far', 'smile']" />
             <span>Feedback</span>
           </a>
         </div>
         <div class="footer__section__item">
           <a :href="repositoryUrl" target="_blank">
-            <font-awesome-icon class="icon" :icon="['fab', 'github']"  />
+            <font-awesome-icon class="icon" :icon="['fab', 'github']" />
             <span>Source Code</span>
           </a>
         </div>
         <div class="footer__section__item">
           <a :href="releaseUrl" target="_blank">
-            <font-awesome-icon class="icon" :icon="['fas', 'tag']"  />
+            <font-awesome-icon class="icon" :icon="['fas', 'tag']" />
             <span>v{{ version }}</span>
           </a>
         </div>
         <div class="footer__section__item">
-          <font-awesome-icon class="icon" :icon="['fas', 'user-secret']"  />
+          <font-awesome-icon class="icon" :icon="['fas', 'user-secret']" />
           <a @click="$refs.privacyDialog.show()">Privacy</a>
         </div>
       </div>
     </div>
     <Dialog ref="privacyDialog">
-        <PrivacyPolicy />
+      <PrivacyPolicy />
     </Dialog>
   </div>
 </template>