fix: frontend build error

frontend/src/components/common/ConfirmDialog.vue

@@ -47,7 +47,7 @@ interface Emits {
   (e: 'cancel'): void
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   confirmText: 'Confirm',
   cancelText: 'Cancel',
   danger: false

frontend/src/components/common/DataTable.vue

@@ -86,16 +86,10 @@
 <script setup lang="ts">
 import { computed, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
+import type { Column } from './types'
 
 const { t } = useI18n()
 
-export interface Column {
-  key: string
-  label: string
-  sortable?: boolean
-  formatter?: (value: any, row: any) => string
-}
-
 interface Props {
   columns: Column[]
   data: any[]

frontend/src/components/common/EmptyState.vue

@@ -69,7 +69,6 @@
 
 <script setup lang="ts">
 import type { Component } from 'vue'
-import { RouterLink } from 'vue-router'
 
 interface Props {
   icon?: Component | string
@@ -81,7 +80,7 @@ interface Props {
   message?: string
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   title: 'No data found',
   description: '',
   actionIcon: true

frontend/src/components/common/Select.vue

@@ -53,7 +53,7 @@
         <div class="select-options">
           <div
             v-for="option in filteredOptions"
-            :key="getOptionValue(option)"
+            :key="getOptionValue(option) ?? undefined"
             @click="selectOption(option)"
             :class="[
               'select-option',
@@ -136,9 +136,9 @@ const searchQuery = ref('')
 const containerRef = ref<HTMLElement | null>(null)
 const searchInputRef = ref<HTMLInputElement | null>(null)
 
-const getOptionValue = (option: SelectOption | Record<string, unknown>): string | number | null => {
+const getOptionValue = (option: SelectOption | Record<string, unknown>): string | number | null | undefined => {
   if (typeof option === 'object' && option !== null) {
-    return option[props.valueKey] as string | number | null
+    return option[props.valueKey] as string | number | null | undefined
   }
   return option as string | number | null
 }
@@ -187,7 +187,7 @@ const toggle = () => {
 }
 
 const selectOption = (option: SelectOption | Record<string, unknown>) => {
-  const value = getOptionValue(option)
+  const value = getOptionValue(option) ?? null
   emit('update:modelValue', value)
   emit('change', value, option as SelectOption)
   isOpen.value = false

frontend/src/components/common/SubscriptionProgressMini.vue

@@ -121,7 +121,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed, onMounted, onBeforeUnmount, watch } from 'vue';
+import { ref, computed, onMounted, onBeforeUnmount } from 'vue';
 import { useI18n } from 'vue-i18n';
 import subscriptionsAPI from '@/api/subscriptions';
 import type { UserSubscription } from '@/types';

frontend/src/components/common/index.ts

@@ -10,4 +10,4 @@ export { default as EmptyState } from './EmptyState.vue'
 export { default as LocaleSwitcher } from './LocaleSwitcher.vue'
 
 // Export types
-export type { Column } from './DataTable.vue'
+export type { Column } from './types'

frontend/src/components/common/types.ts

@@ -0,0 +1,10 @@
+/**
+ * Common component types
+ */
+
+export interface Column {
+  key: string
+  label: string
+  sortable?: boolean
+  formatter?: (value: any, row: any) => string
+}