feat: add better provider support, icons, regen, and a lot more

This commit is contained in:
Zoe
2026-02-12 14:56:13 +00:00
parent d5a5945c03
commit d29f95bacf
124 changed files with 6374 additions and 1861 deletions
+19 -22
View File
@@ -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
View File
@@ -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>