♻️ [ecw/ai] migrate alarmIcons preview to composition API

src/modules/extendedCallWindow/components/alarmIcons/aiPreview.vue

@@ -0,0 +1,38 @@
+<template>
+    <a href="#" class="btn btn-success navbar-btn btn-sm">
+        <font-awesome-icon
+            v-if="isValidIcon"
+            :icon="[setting.type, setting.icon]"
+            class="type-icon"
+        ></font-awesome-icon>
+        Alarm
+        <span id="vehicle_amount" class="badge vehicle_amount_selected">
+            0
+        </span>
+    </a>
+</template>
+
+<script setup lang="ts">
+import { computed, toRefs } from 'vue';
+
+import iconNames from '../../../../generated/faIcons.json';
+
+const props = defineProps<{
+    setting: {
+        type: 'fab' | 'far' | 'fas';
+        icon: string;
+    };
+}>();
+
+const { setting } = toRefs(props);
+
+const styleMap = {
+    fab: 'brands',
+    far: 'regular',
+    fas: 'solid',
+} as const;
+
+const isValidIcon = computed(() => {
+    return iconNames[styleMap[setting.value.type]].includes(setting.value.icon);
+});
+</script>

src/modules/extendedCallWindow/settings.ts

@@ -1,4 +1,4 @@
-import aipreview from './components/alarmIcons/preview.vue';
+import aiPreview from './components/alarmIcons/aiPreview.vue';
 import mkPreview from './components/missionKeywords/mkPreview.vue';
 
 import type { $m, ModuleSettingFunction } from 'typings/Module';
@@ -431,9 +431,9 @@ export default (async (MODULE_ID: string, LSSM: Vue, $m: $m) => {
                         labels: ['solid', 'regular', 'brand'],
                     },
                 },
-                <PreviewElement>{
+                <PreviewElement<typeof aiPreview>>{
                     type: 'preview',
-                    component: aipreview,
+                    component: aiPreview,
                     title: $m('settings.alarmIcons.preview'),
                     size: 1,
                 },