When viewing a task in modal mode on mobile, both a back button and a close button were displayed, causing confusion. The back button condition `!isModal || isMobile` meant it would show on mobile even in modal mode.
This fix changes the back button to only display when not in modal mode (`!isModal`), ensuring only the close button appears when viewing tasks in a modal on mobile devices.
Also removed the now-unused `isMobile` variable and its import.
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>
Replace the global sequenceBuffer (which only tracked key count) with
per-candidate ActiveSequence tracking. This fixes two bugs:
- Sequences with different prefixes could misfire once any sequence
started, since only buffer length was checked, not which sequence
was being matched.
- Single-key shortcuts could fire during an in-progress sequence,
preempting sequence completion depending on binding iteration order.
Replace `any` type assertions with proper types:
- Use WeakMap for element-to-binding mapping instead of expando properties
- Use typed intersection for Firefox's explicitOriginalTarget property
Change e.key to e.code in global keyboard shortcut handlers for
consistency with the new event.code-based shortcut system:
- ProjectList.vue: 'j'/'k'/'Enter' -> 'KeyJ'/'KeyK'/'Enter'
- useGanttBar.ts: 'ArrowLeft'/'ArrowRight' (identical values, for consistency)
- Modal.vue: 'Escape' (identical value, for consistency)
Change all shortcut strings from character-based format to event.code
format:
- Single letters: 't' -> 'KeyT', 's' -> 'KeyS', etc.
- Sequences: 'g o' -> 'KeyG KeyO', etc.
- Modifiers: 'Mod+e' -> 'Mod+KeyE', 'Shift+?' -> 'Shift+Slash'
- edit-shortcut prop: 'e' -> 'KeyE'
Shortcuts like 'Escape' and 'Shift+Delete' remain unchanged as their
event.code values are identical.
Replace the character-based @github/hotkey matching with a custom module
that matches against event.code (physical key position). This makes
shortcuts layout-independent so they work on non-Latin keyboard layouts
(Russian, Greek, Arabic, etc.).
The module provides:
- install/uninstall for declarative element shortcuts (v-shortcut)
- eventToShortcutString for imperative event matching
- Sequence support with 1500ms timeout
- Form field, IME, shadow DOM, and event.repeat guards
- Make parent task bars full height (32px) matching regular bars,
instead of the thin 8px summary bar
- Move collapse/expand chevron to sit right before the bar start
position so it moves with the task during drag/resize
- Remove fixed-position indent indicator lines
- Add light background band with rounded border to visually group
parent tasks with their children, sized to fit the bars
Remove the toggle checkbox and always render relation arrows.
Wrap rows and arrow overlay in a position:relative container so
arrows anchor to the row area instead of the chart wrapper which
includes the timeline header.
The TipTap editor now uses Vue’s defineModel for its reactive value, simplifies editability control with watchEffect, and correctly types DOM image elements.
Summary
Imported watchEffect and switched to defineModel for the editor’s v-model, removing the old update:modelValue emit
Typed the retrieved image element as HTMLImageElement and removed debugging output from the paste handler
Replaced the watcher controlling editability with a simpler watchEffect and updated model handling to use the new model ref
- Replace tailwindcss v3 with tailwindcss v4 + @tailwindcss/vite plugin
- Create dedicated tailwind.css entry with granular imports (skip preflight)
- Use CSS-first config with prefix(tw) instead of JS config
- Switch from PostCSS plugin to Vite plugin for better performance
- Update class prefix from tw- (dash) to tw: (colon) in all Vue files
- Remove @tailwind directives from global.scss
- Delete tailwind.config.js (replaced by CSS directives)
- Update stylelint at-rules for v4 directives
When multiple avatar components mount with alternating sizes (e.g. 48
and 20), invalidateAvatarCache clears pending requests for ALL sizes of
the same user, causing each call to create a new HTTP request instead of
reusing the pending one.
I noticed this issue when I open a task with 20 comments, the avatar
requests make the service OOM.
<img width="733" height="551" alt="image"
src="https://github.com/user-attachments/assets/db45db31-294c-4363-ad27-38d454b5a6a2"
/>
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Wraps all tables that were missing overflow handling in a
`has-horizontal-overflow` div to prevent horizontal overflow on mobile
viewports.
Affected components:
- Sessions.vue
- ApiTokens.vue
- ProjectSettingsWebhooks.vue
- LinkSharing.vue
- UserTeam.vue
- EditTeam.vue
- ProjectSettingsViews.vue
Fixes https://github.com/go-vikunja/vikunja/issues/2331
Make the "create new" option in multiselect dropdowns visually distinct
from regular search results by adding a green plus icon and making the
hint text always visible instead of only on hover.
word-break: break-all breaks text at any character, causing mid-word
breaks even when the word could fit on the next line. overflow-wrap:
break-word wraps at word boundaries first and only breaks mid-word
when a single word exceeds the container width.
Replace FormField with Password component for new password input:
- Provides real-time validation feedback (8-72 char requirement)
- Remove redundant password confirmation field
- Disable save button when form is invalid (validation errors or empty fields)
Replace innerHTML with DOM API calls in inputPrompt.ts. The oldValue
parameter (sourced from a link's href attribute in the TipTap editor)
was interpolated directly into an HTML string, allowing stored XSS if
an attacker crafted a malicious href. Using document.createElement and
setting .value as a property ensures the value is never parsed as HTML.
TipTap's setContent() parses strings as HTML via DOMParser, allowing
crafted ?filter= URL parameters to inject SVG phishing buttons, anchor
tags, and formatted content into the trusted UI.
Use ProseMirror JSON document format instead of raw strings so the
filter value is always set as a text node, bypassing HTML parsing
entirely.
- Session model, type interface, and API service
- Sessions settings page showing active sessions with device info,
IP address, last active time, and current session indicator
- Auth store updated to use cookie-based refresh tokens for user
sessions and JWT-based renewal for link shares
- refreshToken() uses Web Locks API to coordinate across browser
tabs — only one tab performs the refresh, others adopt the result
- 401 response interceptor with automatic retry: detects expired JWT
(error code 11), refreshes the token, and replays the request
- Interceptor gated to user JWTs only (link shares skip refresh)
- checkAuth() attempts cookie refresh when JWT is expired, allowing
seamless session resumption after short TTL expiry
- Proactive token refresh on page focus/visibility via composable
- renewToken() tolerates refresh failures when JWT is still valid
The loading screen was dismissed as soon as auth check completed, but
before Vue Router's initial navigation finished. This caused route.name
to be undefined momentarily, making showAuthLayout evaluate to false
and briefly flashing the NoAuthWrapper (login shell) before the
authenticated layout appeared.
Wait for router.isReady() before setting ready = true so the loading
screen stays visible until the route is fully resolved.