diff --git a/resources/js/Layouts/Auth/AuthCard.vue b/resources/js/Layouts/Auth/AuthCard.vue index 5fb1eff55..6a2aded66 100644 --- a/resources/js/Layouts/Auth/AuthCard.vue +++ b/resources/js/Layouts/Auth/AuthCard.vue @@ -1,6 +1,10 @@ - + diff --git a/resources/js/Pages/Auth/Login.vue b/resources/js/Pages/Auth/Login.vue index 3fa88e9b3..cf36e9494 100644 --- a/resources/js/Pages/Auth/Login.vue +++ b/resources/js/Pages/Auth/Login.vue @@ -15,14 +15,11 @@ import { FormItem } from "@/components/ui/form"; import { Check } from "lucide-vue-next"; import TemplateRenderer from "@/components/TemplateRenderer.vue"; - import { onMounted } from "vue"; import { - startAuthentication, browserSupportsWebAuthn, - browserSupportsWebAuthnAutofill } from "@simplewebauthn/browser"; - import { api } from "@/api/api"; import { Separator } from "@/components/ui/separator"; + import { usePasskeyLogin } from "@/Pages/Auth/usePasskeyLogin"; const props = defineProps<{ loginIsEmail: boolean, @@ -42,38 +39,8 @@ supports_passkeys: browserSupportsWebAuthn(), }); - const passkeyForm = useForm({ - remember: false, - start_authentication_response: '', - }); - - async function loginWithPasskey(autofill = false) { - try { - const response = await api.get(route('passkeys.authentication_options'), { - ignoreContentType: true, - }); - - const authenticationOptions = response.data; - const authenticationResponse = await startAuthentication({ - optionsJSON: authenticationOptions, - useBrowserAutofill: autofill, - }); - - console.log(authenticationResponse); - - passkeyForm.remember = form.remember; - passkeyForm.start_authentication_response = JSON.stringify(authenticationResponse); - - passkeyForm.post(route('passkeys.login')); - } catch (error) { - console.error(error); - } - } - - onMounted(async () => { - if(config('sharp.auth.passkeys.enabled') && await browserSupportsWebAuthnAutofill()) { - await loginWithPasskey(true); - } + const { loginWithPasskey } = usePasskeyLogin({ + autofill: config('sharp.auth.passkeys.enabled'), }); @@ -161,7 +128,7 @@ type="button" variant="outline" class="w-full" - @click="loginWithPasskey()" + @click="loginWithPasskey({ remember: form.remember })" > {{ __('sharp::pages/auth/login.passkey_button') }} diff --git a/resources/js/Pages/Auth/Login2Fa.vue b/resources/js/Pages/Auth/Login2Fa.vue deleted file mode 100644 index 447090b99..000000000 --- a/resources/js/Pages/Auth/Login2Fa.vue +++ /dev/null @@ -1,59 +0,0 @@ - - - diff --git a/resources/js/Pages/Auth/LoginMultiFactor.vue b/resources/js/Pages/Auth/LoginMultiFactor.vue new file mode 100644 index 000000000..a3a79dffe --- /dev/null +++ b/resources/js/Pages/Auth/LoginMultiFactor.vue @@ -0,0 +1,76 @@ + + + diff --git a/resources/js/Pages/Auth/Passkeys/Create.vue b/resources/js/Pages/Auth/Passkeys/Create.vue index 6526bc83f..6d2540df2 100644 --- a/resources/js/Pages/Auth/Passkeys/Create.vue +++ b/resources/js/Pages/Auth/Passkeys/Create.vue @@ -11,40 +11,15 @@ import { startRegistration } from "@simplewebauthn/browser"; import { api } from "@/api/api"; import { Field, FieldDescription, FieldError, FieldGroup, FieldLabel } from "@/components/ui/field"; + import { usePasskeyRegister } from "@/Pages/Auth/usePasskeyRegister"; - const props = defineProps<{ + defineProps<{ prompt: boolean, + isMultiFactor: boolean, cancelUrl: string, }>(); - const form = useForm({ - name: '', - passkey: '', - }); - - async function submit() { - form.clearErrors(); - - try { - const optionsResponse = await api.post(route('code16.sharp.passkeys.validate'), { - name: form.name, - }); - - const registrationResponse = await startRegistration({ - optionsJSON: optionsResponse.data.passkeyOptions, - }); - - form.passkey = JSON.stringify(registrationResponse); - - form.post(route('code16.sharp.passkeys.store')); - } catch (error) { - if (error.response?.status === 422) { - form.setError({ name: error.response.data.errors?.name?.[0] }); - } else { - console.error(error); - } - } - } + const { form, registerPasskey } = usePasskeyRegister();