Implement new UI component for icons #230

- Introduce `AppIcon.vue`, offering improved performance over the
  previous `fort-awesome` dependency. This implementation reduces bundle
  size by 67.31KB (tested for web using `npm run build -- --mode prod`).
- Migrate Font Awesome 5 icons to Font Awesome 6.

This commit facilitates migration to Vue 3.0 (#230) and ensures no Vue
component remains tightly bound to a specific Vue version, enhancing
code portability.

Font Awesome license is not included because Font Awesome revokes its
right:

> "Attribution is no longer required as of Font Awesome 3.0"
>
> Sources:
>
> - https://fontawesome.com/v4/license/ (archived: https://web.archive.org/web/20231003213441/https://fontawesome.com/v4/license/, https://archive.ph/Yy9j5)
> - https://github.com/FortAwesome/Font-Awesome/wiki (archived: https://web.archive.org/web/20231003214646/https://github.com/FortAwesome/Font-Awesome/wiki, https://archive.ph/C6sXv)

This commit removes following third-party production dependencies:

- `@fortawesome/vue-fontawesome`
- `@fortawesome/free-solid-svg-icons`
- `@fortawesome/free-regular-svg-icons`
- `@fortawesome/free-brands-svg-icons`
- `@fortawesome/fontawesome-svg-core`

src/presentation/components/Scripts/View/Cards/CardListItem.vue

@@ -17,18 +17,18 @@
       </span>
       <span v-else>Oh no 😢</span>
       <!-- Expand icon -->
-      <font-awesome-icon
+      <AppIcon
         class="card__inner__expand-icon"
-        :icon="['far', isExpanded ? 'folder-open' : 'folder']"
+        :icon="isExpanded ? 'folder-open' : 'folder'"
       />
       <!-- Indeterminate and full states -->
       <div class="card__inner__state-icons">
-        <font-awesome-icon
-          :icon="['fa', 'battery-half']"
+        <AppIcon
+          icon="battery-half"
           v-if="isAnyChildSelected && !areAllChildrenSelected"
         />
-        <font-awesome-icon
-          :icon="['fa', 'battery-full']"
+        <AppIcon
+          icon="battery-full"
           v-if="areAllChildrenSelected"
         />
       </div>
@@ -38,8 +38,8 @@
         <ScriptsTree :categoryId="categoryId" />
       </div>
       <div class="card__expander__close-button">
-        <font-awesome-icon
-          :icon="['fas', 'times']"
+        <AppIcon
+          icon="xmark"
           v-on:click="collapse()"
         />
       </div>
@@ -52,6 +52,7 @@ import {
   defineComponent, ref, watch, computed,
   inject,
 } from 'vue';
+import AppIcon from '@/presentation/components/Shared/Icon/AppIcon.vue';
 import { InjectionKeys } from '@/presentation/injectionSymbols';
 import ScriptsTree from '@/presentation/components/Scripts/View/Tree/ScriptsTree.vue';
 import { sleep } from '@/infrastructure/Threading/AsyncSleep';
@@ -59,6 +60,7 @@ import { sleep } from '@/infrastructure/Threading/AsyncSleep';
 export default defineComponent({
   components: {
     ScriptsTree,
+    AppIcon,
   },
   props: {
     categoryId: {