Initial

2026-06-22 23:18:23 +10:00
parent 87ce423a12
commit 3f6d532cf0
297 changed files with 29726 additions and 0 deletions
@@ -0,0 +1,65 @@
+<script setup lang="ts">
+import { router } from '@inertiajs/vue3';
+import { KeyRound } from '@lucide/vue';
+import { destroy } from '@/actions/Laravel/Passkeys/Http/Controllers/PasskeyRegistrationController';
+import Heading from '@/components/Heading.vue';
+import PasskeyItem from '@/components/PasskeyItem.vue';
+import PasskeyRegister from '@/components/PasskeyRegister.vue';
+import type { Passkey } from '@/types/auth';
+
+export type Props = {
+    canManagePasskeys?: boolean;
+    passkeys?: Passkey[];
+};
+
+withDefaults(defineProps<Props>(), {
+    canManagePasskeys: false,
+    passkeys: () => [],
+});
+
+const handleDelete = (id: number, onError: () => void) => {
+    router.delete(destroy.url(id), {
+        preserveScroll: true,
+        onError,
+    });
+};
+
+const handleRegisterSuccess = () => {
+    router.reload();
+};
+</script>
+
+<template>
+    <div v-if="canManagePasskeys" class="space-y-6">
+        <Heading
+            variant="small"
+            title="Passkeys"
+            description="Manage your passkeys for passwordless sign-in"
+        />
+
+        <div class="overflow-hidden rounded-lg border border-border">
+            <template v-if="passkeys.length">
+                <PasskeyItem
+                    v-for="passkey in passkeys"
+                    :key="passkey.id"
+                    :passkey="passkey"
+                    @remove="handleDelete"
+                />
+            </template>
+
+            <div v-else class="p-8 text-center">
+                <div
+                    class="mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-2xl bg-muted"
+                >
+                    <KeyRound class="h-7 w-7 text-muted-foreground" />
+                </div>
+                <p class="font-medium">No passkeys yet</p>
+                <p class="mt-1 text-sm text-muted-foreground">
+                    Add a passkey to sign in without a password
+                </p>
+            </div>
+        </div>
+
+        <PasskeyRegister @success="handleRegisterSuccess" />
+    </div>
+</template>