bvandeusenandClaude Fable 5
2a6c55dacb
CI & Build / Python lint (push) Successful in 4s
CI & Build / Plugin hooks (push) Successful in 9s
CI & Build / integration (push) Successful in 22s
CI & Build / TypeScript typecheck (push) Successful in 32s
CI & Build / Python tests (push) Successful in 57s
CI & Build / Build & push image (push) Successful in 16s
- assets/auth-shared.css: the five auth views carried byte-identical scoped
copies of the page/card/brand/footer/field/input/error rules (~60 lines
each); they now load one stylesheet the way the editors load
editor-shared.css. .closed-msg/.error-block/.success-msg (identical bodies)
are one .auth-note; the form rules are scoped under .auth-card so nothing
leaks into the rest of the app.
- api/client.apiErrorMessage(e, fallback): the one place the {"error"} envelope
is unpacked; replaces ten six-line `"body" in e` catch blocks.
- utils/dateFormat: fmtDate / fmtStamp / fmtLogStamp replace eight local
formatDate/formatTime copies (three byte-identical pairs); the file’s old
Calendar/Home helpers had no callers and are gone. useRelativeTime gains
relativeTimeOrDate for the two workspace panels’ identical variant.
- components.css now owns the .modal-* shape (overlay/card/title/message/
actions/btn/primary/danger). It was copied into four views and lived in
editor-shared.css, which ConfirmDialog — styleless, teleported to <body> —
silently depended on: opened from SnippetDetailView before any editor view
had loaded, it rendered unstyled. Views keep only their own overrides.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
66 lines
1.9 KiB
Vue
66 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from "vue";
|
|
import { apiPost, apiErrorMessage } from "@/api/client";
|
|
import AppLogo from "@/components/AppLogo.vue";
|
|
|
|
const email = ref("");
|
|
const error = ref("");
|
|
const submitted = ref(false);
|
|
const submitting = ref(false);
|
|
|
|
async function handleSubmit() {
|
|
error.value = "";
|
|
submitting.value = true;
|
|
try {
|
|
await apiPost("/api/auth/forgot-password", { email: email.value });
|
|
submitted.value = true;
|
|
} catch (e: unknown) {
|
|
error.value = apiErrorMessage(e, "Something went wrong");
|
|
} finally {
|
|
submitting.value = false;
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<main class="auth-page">
|
|
<div class="auth-card">
|
|
<div class="auth-brand"><AppLogo :size="32" /><h1>Reset Password</h1></div>
|
|
|
|
<template v-if="!submitted">
|
|
<p class="auth-hint">
|
|
Enter the email address associated with your account and we'll send you a link to reset your password.
|
|
</p>
|
|
<form @submit.prevent="handleSubmit">
|
|
<div class="field">
|
|
<label for="email">Email</label>
|
|
<input
|
|
id="email"
|
|
v-model="email"
|
|
type="email"
|
|
autocomplete="email"
|
|
required
|
|
class="input"
|
|
/>
|
|
</div>
|
|
<p v-if="error" class="error-msg">{{ error }}</p>
|
|
<button type="submit" class="btn-primary btn-block" :disabled="submitting">
|
|
{{ submitting ? "Sending..." : "Send Reset Link" }}
|
|
</button>
|
|
</form>
|
|
</template>
|
|
|
|
<div v-else class="auth-note">
|
|
<p>If an account exists with that email address, you will receive a password reset link shortly.</p>
|
|
<p>Check your email and follow the instructions to reset your password.</p>
|
|
</div>
|
|
|
|
<p class="auth-footer">
|
|
<router-link to="/login">Back to Sign In</router-link>
|
|
</p>
|
|
</div>
|
|
</main>
|
|
</template>
|
|
|
|
<style src="@/assets/auth-shared.css" />
|