c6f0d8babe
This PR surfaces API validation errors from the registration endpoint directly onto the corresponding form fields, instead of only showing a generic "invalid data" message. A new `parseValidationErrors` helper extracts field names and messages from the API's `invalid_fields` array (e.g. `["email: email is not a valid email address"]`) and maps them to the appropriate form fields. The Register component integrates this parser into its error handling, prioritizing client-side validation but falling back to server-side field errors when present. Errors are cleared as the user types. A follow-up commit addressed PR review feedback: the `ValidationError` interface is now exported from the parser module and reused in `Register.vue` (eliminating a duplicate `ApiValidationError` interface), the type guard was tightened to check specifically for `invalid_fields` rather than broadly matching any object with a `message` property, the fallback error message always uses the localized translation key instead of potentially surfacing raw backend messages, and the `serverValidationErrors` ref uses `Partial<Record>` to accurately reflect that keys are optional. 🐰 A parser hops through error fields, Catching field names as each one yields, Client and server now both agree, Validation flows harmoniously free! Whitespace trimmed, no colon? It hops along, Register form now validated strong! ✨ --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: kolaente <k@knt.li> |
||
|---|---|---|
| .. | ||
| docs | ||
| originalMedia | ||
| public | ||
| scripts | ||
| src | ||
| tests | ||
| .editorconfig | ||
| .env.local.example | ||
| .gitignore | ||
| .npmrc | ||
| .nvmrc | ||
| .stylelintrc.json | ||
| CHANGELOG.md | ||
| LICENSE | ||
| README.md | ||
| cliff.toml | ||
| embed.go | ||
| env.config.d.ts | ||
| env.d.ts | ||
| eslint.config.js | ||
| histoire.config.ts | ||
| index.html | ||
| netlify.toml | ||
| package.json | ||
| playwright.config.ts | ||
| pnpm-lock.yaml | ||
| tsconfig.app.json | ||
| tsconfig.config.json | ||
| tsconfig.json | ||
| tsconfig.vitest.json | ||
| vite.config.ts | ||
README.md
Web frontend for Vikunja
The todo app to organize your life.
This is the web frontend for Vikunja, written in Vue.js.
Take a look at our roadmap (hosted on Vikunja!) for a list of things we're currently working on!
For general information about the project, refer to the top-level readme of this repo.
Project setup
pnpm install
Development
Define backend server
You can develop the web front end against any accessible backend, including the demo at https://try.vikunja.io
In order to do so, you need to set the DEV_PROXY env variable. The recommended way to do so is to:
- Copy
.env.local.exampleas.env.local - Uncomment the
DEV_PROXYline - Set the backend url you want to use
In the end, it should look like DEV_PROXY=https://try.vikunja.io if you work against the online demo backend.
Start dev server (compiles and hot-reloads)
pnpm run dev
Compiles and minifies for production
pnpm run build
Lints and fixes files
pnpm run lint
License
This project is licensed under the AGPL-3.0-or-later license. See the LICENSE file for details.