diff --git a/components/modals/UserModal.vue b/components/modals/UserModal.vue
index 5e138c3..228d5a3 100644
--- a/components/modals/UserModal.vue
+++ b/components/modals/UserModal.vue
@@ -31,6 +31,6 @@
 </template>
 
 <script setup lang="ts">
-defineProps<{ selectedUser: User | null }>()
-const open = defineModel('modelValue', { type: Boolean, default: false })
+defineProps<{ selectedUser: User }>()
+const open = defineModel<boolean>('modelValue')
 </script>
diff --git a/pages/index.vue b/pages/index.vue
index cede35d..1cbade8 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -13,7 +13,7 @@
 
     <UiTable :table-data="tableData" :columns="columns" height="600px" width="600px" />
 
-    <UserModal v-model:model-value="open" :selected-user="selectedUser" />
+    <UserModal v-if="selectedUser" v-model:model-value="open" :selected-user="selectedUser" />
   </div>
 </template>