Backend - New Mail namespace: a Mailer interface with SMTP (phpmailer), PHP mail() (the default fallback), and log-to-file transports, selected by MAIL_TRANSPORT. EmailVerifier issues a hashed, 15-minute magic-link token and sends the link (APP_URL/verify-email?token=...). - Migration 005: email_verifications table + users.verification_email_sent_at. - Registration now emails a verification link (best effort — a send failure doesn't fail registration). - POST /api/auth/verify-email consumes a token and returns a session, so opening the link verifies the address (or applies a pending email change) and logs the user in. Single-use; distinct 400s for invalid/used/expired. - POST /api/email/verification resends; POST /api/email/change requests a deferred change (current password required; link goes to the new address; users.email only updates when that link is opened). Both throttled to once per 60s, returning 429 + retry_after. - GET /api/me and every session payload now include pending_email. Shared SessionPayload builds the user/session JSON for all entry points. Frontend - /verify-email view: posts the token, adopts the returned session, redirects. - /profile view: shows address + status, a resend button with a live cooldown (driven by retry_after / 429), and a change-email form (new address + current password) that surfaces the pending change. - Header shows a "verify email" badge linking to the profile. Tests: 9 new (EmailVerificationTest) covering the link lifecycle, throttle, and deferred change; AuthTest folded into ApiTestCase, which now routes mail to a per-test log. Suite: 32 passing. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
87 lines
3.4 KiB
Markdown
87 lines
3.4 KiB
Markdown
# Todo List — web
|
|
|
|
Vue 3 + TypeScript + Vite PWA. Talks to the REST API in the parent directory.
|
|
|
|
## Develop on the host
|
|
|
|
```bash
|
|
npm install
|
|
npm run dev # http://localhost:5173
|
|
```
|
|
|
|
The dev server proxies `/api` to `http://localhost:8080` (the Dockerised API —
|
|
run `docker compose up -d` in the parent directory first). Override the target
|
|
with `VITE_PROXY_TARGET`, or point the app at a different API entirely with
|
|
`VITE_API_BASE_URL` (see [.env.example](.env.example)).
|
|
|
|
## Develop in Docker
|
|
|
|
From the parent directory:
|
|
|
|
```bash
|
|
docker compose --profile frontend up -d
|
|
```
|
|
|
|
Runs this dev server alongside the API. `/api` is proxied to the `app` container.
|
|
After changing `package.json`, rebuild: `docker compose build web`.
|
|
|
|
## Build
|
|
|
|
```bash
|
|
npm run build # type-checks, then emits dist/
|
|
npm run preview
|
|
```
|
|
|
|
## Layout
|
|
|
|
```
|
|
src/main.ts App bootstrap; resolves the stored session before mount
|
|
src/router/index.ts Routes + guard (redirects to /login when unauthenticated)
|
|
src/stores/auth.ts Pinia store: token in localStorage, register/login/fetchMe
|
|
src/stores/lists.ts Pinia store: the user's lists (fetch + create)
|
|
src/stores/items.ts Pinia store: one list's items (CRUD + drag reorder)
|
|
src/lib/api.ts fetch wrapper, bearer token, typed ApiError
|
|
src/components/TodoItemRow.vue checkbox + editable text + delete, one item
|
|
src/views/ HomeView, ListView, LoginView, RegisterView,
|
|
ProfileView, VerifyEmailView
|
|
```
|
|
|
|
## List detail
|
|
|
|
`/lists/:id` shows one list. The title and description are inline-editable
|
|
(saved on blur via `PATCH /api/lists/:id`; the description shows an "Add a
|
|
description" placeholder when empty). A **Manage** menu (top right) has a
|
|
**Delete list** action that opens a confirmation modal; confirming calls
|
|
`DELETE /api/lists/:id` and returns to the all-lists view.
|
|
|
|
Each item row is a checkbox, an inline-editable text field (saved on blur), a
|
|
delete button, and a drag handle. Reordering uses `vuedraggable`; on drop the
|
|
whole new order is persisted via `PUT /api/lists/:id/items/order`, and the
|
|
server response replaces local state.
|
|
|
|
## Auth flow
|
|
|
|
- The token from `POST /api/auth/register` or `/login` is kept in `localStorage`
|
|
and sent as `Authorization: Bearer …`.
|
|
- On load, `fetchMe()` validates the stored token via `GET /api/me`; a failure
|
|
clears it.
|
|
- Routes with `meta.requiresAuth` redirect to `/login` (preserving the intended
|
|
path) when there is no authenticated user.
|
|
- Registration signs the user in immediately; the new account's email is
|
|
unverified (`user.email_verified === false`). The header shows a "verify
|
|
email" badge linking to `/profile`.
|
|
|
|
## Email verification & profile
|
|
|
|
- The registration email links to `/verify-email?token=…`. `VerifyEmailView`
|
|
POSTs the token to the API, which returns a session — so opening the link both
|
|
verifies the address and signs the user in — then redirects to the lists.
|
|
- `/profile` (`ProfileView`) shows the address and verification status. When
|
|
unverified it offers a **Resend** button; the API throttles to once a minute,
|
|
and the button shows a live countdown (driven by `retry_after`, and by `429`
|
|
responses).
|
|
- The **Change email** form takes the new address and the current password.
|
|
On success the API has emailed a confirmation link to the *new* address and
|
|
set `user.pending_email`; the change only lands when that link is opened. The
|
|
resend and change actions share the one-minute cooldown.
|