feat: add better provider support, icons, regen, and a lot more
This commit is contained in:
+19
-22
@@ -1,6 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import { authClient } from '~~/lib/auth-client';
|
||||
import { deriveKey } from '~/utils/crypto';
|
||||
import { initSettings } from '~/utils/settings';
|
||||
|
||||
const { client: authClient, signIn } = useAuth();
|
||||
|
||||
definePageMeta({
|
||||
layout: 'auth',
|
||||
@@ -56,49 +58,44 @@ const submit = async () => {
|
||||
|
||||
loading.value = true;
|
||||
|
||||
const { data, error } = await authClient.signIn.email({
|
||||
email: form.email,
|
||||
password: form.password,
|
||||
});
|
||||
|
||||
const res = await signIn(form.email, form.password);
|
||||
loading.value = false;
|
||||
|
||||
if (error) {
|
||||
const errorCode = error.code! as keyof typeof authClient.$ERROR_CODES;
|
||||
if (!res.ok) {
|
||||
if (!res.error.data) {
|
||||
console.error('Failed to sign in:', res.error);
|
||||
alert('Something went wrong');
|
||||
return;
|
||||
}
|
||||
|
||||
const errorCode = res.error.data.code as keyof typeof authClient.$ERROR_CODES;
|
||||
|
||||
// TODO: i18n
|
||||
// ref https://www.better-auth.com/docs/concepts/client#error-codes
|
||||
switch (errorCode) {
|
||||
case 'INVALID_PASSWORD':
|
||||
passwordInputEl.value!.setCustomValidity(error.message!);
|
||||
passwordInputEl.value!.setCustomValidity(res.error.data.message!);
|
||||
passwordInputEl.value!.reportValidity();
|
||||
break;
|
||||
case 'ACCOUNT_NOT_FOUND':
|
||||
case 'USER_NOT_FOUND':
|
||||
case 'USER_EMAIL_NOT_FOUND':
|
||||
emailInputEl.value!.setCustomValidity(error.message!);
|
||||
emailInputEl.value!.setCustomValidity(res.error.data.message!);
|
||||
emailInputEl.value!.reportValidity();
|
||||
break;
|
||||
default:
|
||||
console.log(error);
|
||||
alert(`Something went wrong. ${error.message}`);
|
||||
console.log(res.error);
|
||||
alert(`Something went wrong. ${res.error.data.message}`);
|
||||
break;
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
const key = await deriveKey(form.password, data.user.id);
|
||||
const key = await deriveKey(form.password, res.data.user.id);
|
||||
localStorage.setItem('encryptionKey', JSON.stringify(key));
|
||||
|
||||
// force a session refetch
|
||||
clearNuxtData();
|
||||
|
||||
// success
|
||||
const triplit = useTriplitClient();
|
||||
if ('startSession' in triplit) {
|
||||
await triplit.startSession(data.token);
|
||||
}
|
||||
initSettings(res.data.user.id);
|
||||
|
||||
return navigateTo(to ?? '/');
|
||||
};
|
||||
@@ -114,7 +111,7 @@ const submit = async () => {
|
||||
<input required minlength="8" maxlength="128" ref="passwordInputEl" type="password"
|
||||
autocomplete="current-password" id="password" v-model="form.password" />
|
||||
<button :disabled="!hydrated" class="accent" type="submit">
|
||||
<Icon v-if="loading" class="text-6" name="svg-spinners:90-ring-with-bg" />
|
||||
<Icon v-if="loading" class="text-6 h-6" name="svg-spinners:90-ring-with-bg" />
|
||||
<span v-else>Login</span>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
+16
-26
@@ -1,12 +1,9 @@
|
||||
<script setup lang="ts">
|
||||
import { authClient } from '~~/lib/auth-client';
|
||||
import { deriveKey } from '~/utils/crypto';
|
||||
const { client: authClient, signUp, session } = useAuth();
|
||||
|
||||
definePageMeta({
|
||||
layout: 'auth',
|
||||
});
|
||||
|
||||
const { session } = await useAuth();
|
||||
const to = useRoute().query.to as string | undefined;
|
||||
|
||||
if (session.value !== null) {
|
||||
@@ -95,16 +92,16 @@ const submit = async () => {
|
||||
|
||||
loading.value = true;
|
||||
|
||||
const { data, error } = await authClient.signUp.email({
|
||||
name: form.name,
|
||||
email: form.email,
|
||||
password: form.password,
|
||||
});
|
||||
|
||||
const res = await signUp(form.email, form.password, form.name);
|
||||
loading.value = false;
|
||||
if (!res.ok) {
|
||||
if (!res.error.data) {
|
||||
console.error('Failed to sign up:', res.error);
|
||||
alert('Something went wrong');
|
||||
return;
|
||||
}
|
||||
|
||||
if (error) {
|
||||
const errorCode = error.code! as keyof typeof authClient.$ERROR_CODES;
|
||||
const errorCode = res.error.data.code as keyof typeof authClient.$ERROR_CODES;
|
||||
|
||||
// TODO: i18n
|
||||
// ref https://www.better-auth.com/docs/concepts/client#error-codes
|
||||
@@ -115,33 +112,26 @@ const submit = async () => {
|
||||
emailInputEl.value!.reportValidity();
|
||||
break;
|
||||
case 'INVALID_EMAIL':
|
||||
emailInputEl.value!.setCustomValidity(error.message!);
|
||||
emailInputEl.value!.setCustomValidity(res.error.data.message!);
|
||||
emailInputEl.value!.reportValidity();
|
||||
break;
|
||||
case 'INVALID_PASSWORD':
|
||||
passwordInputEl.value!.setCustomValidity(error.message!);
|
||||
passwordInputEl.value!.setCustomValidity(res.error.data.message!);
|
||||
passwordInputEl.value!.reportValidity();
|
||||
break;
|
||||
default:
|
||||
console.log(error);
|
||||
alert('Something went wrong: ' + error.message);
|
||||
console.log(res.error);
|
||||
alert('Something went wrong: ' + res.error.data.message);
|
||||
break;
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
const key = await deriveKey(form.password, data.user.id);
|
||||
const key = await deriveKey(form.password, res.data.user.id);
|
||||
localStorage.setItem('encryptionKey', JSON.stringify(key));
|
||||
|
||||
// force a session refetch
|
||||
clearNuxtData();
|
||||
|
||||
// success
|
||||
const triplit = useTriplitClient();
|
||||
if ('startSession' in triplit) {
|
||||
await triplit.startSession(data.token!);
|
||||
}
|
||||
initSettings(res.data.user.id);
|
||||
|
||||
return navigateTo(to ?? '/');
|
||||
};
|
||||
@@ -162,7 +152,7 @@ const submit = async () => {
|
||||
<input required minlength="8" maxlength="128" ref="confirmPasswordInputEl" type="password"
|
||||
autocomplete="new-password" id="confirmPassword" v-model="form.confirmPassword" />
|
||||
<button :disabled="!hydrated" class="accent" type="submit">
|
||||
<Icon v-if="loading" class="text-6" name="svg-spinners:90-ring-with-bg" />
|
||||
<Icon v-if="loading" class="text-6 h-6" name="svg-spinners:90-ring-with-bg" />
|
||||
<span v-else>Register</span>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
Reference in New Issue
Block a user