fixed dialogs behaviour

management-ui/src/customcompometns/AdminDeviceDropdown.vue

@@ -1,40 +1,42 @@
 <script setup lang="ts">
-import { DropdownMenu, DropdownMenuItem, 
-DropdownMenuTrigger, DropdownMenuContent } from '@/components/ui/dropdown-menu';
-import { Ellipsis } from 'lucide-vue-next';
-import EditDeviceDialog from './EditDeviceDialog.vue';
-import DeleteDeviceDialog from './DeleteDeviceDialog.vue';
-import { ref } from 'vue';
+import { ref } from 'vue'
+import {
+  DropdownMenu, DropdownMenuItem,
+  DropdownMenuTrigger, DropdownMenuContent
+} from '@/components/ui/dropdown-menu'
+import EditDeviceDialog from './EditDeviceDialog.vue'
+import DeleteDeviceDialog from './DeleteDeviceDialog.vue'
+import { Ellipsis } from 'lucide-vue-next'
+import type { Device } from '@/lib/interfaces'
+// import { api } from '@/lib/api'
+
+const props = defineProps<{ row: Device }>()  // ← accept full row
 
 const isEditOpen = ref(false)
 const isDeleteOpen = ref(false)
 
-// your actual delete logic
 function onDeleteConfirmed() {
-  // e.g. await api.deleteUser(props.userId)
+  // await api.delete(`/devices/${encodeURIComponent(props.row.guid)}`)
   isDeleteOpen.value = false
 }
 function onEditConfirm() {
-    isEditOpen.value = false
+  isEditOpen.value = false
 }
-
 </script>
+
 <template>
-<DropdownMenu>
+  <DropdownMenu>
     <DropdownMenuTrigger asChild>
-        <button class="p-2 rounded hover:bg-muted">
-            <Ellipsis/>
-        </button>
+      <button class="p-2 rounded hover:bg-muted">
+        <Ellipsis />
+      </button>
     </DropdownMenuTrigger>
     <DropdownMenuContent align="end" class="w-[160px]">
-        <DropdownMenuItem @click.prevent="isEditOpen = true">
-            Rename
-        </DropdownMenuItem>
-        <DropdownMenuItem @click.prevent="isDeleteOpen = true">
-            Delete
-        </DropdownMenuItem>
+      <DropdownMenuItem @click.prevent="isEditOpen = true">Rename</DropdownMenuItem>
+      <DropdownMenuItem @click.prevent="isDeleteOpen = true">Delete</DropdownMenuItem>
     </DropdownMenuContent>
-</DropdownMenu>
-<EditDeviceDialog v-model:modelValue="isEditOpen"@confirm="onEditConfirm()" />
-<DeleteDeviceDialog v-model:modelValue="isDeleteOpen" @confirm="onDeleteConfirmed" />
-</template>
+  </DropdownMenu>
+
+  <EditDeviceDialog v-model:modelValue="isEditOpen" :device="props.row" @confirm="onEditConfirm" />
+  <DeleteDeviceDialog v-model:modelValue="isDeleteOpen" :device="props.row" @confirm="onDeleteConfirmed" />
+</template>