[PR #1965] [MERGED] feat: make sidebar resizable #9669

Closed
opened 2026-04-23 09:08:28 -05:00 by GiteaMirror · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/go-vikunja/vikunja/pull/1965
Author: @kolaente
Created: 12/11/2025
Status: Merged
Merged: 12/12/2025
Merged by: @kolaente

Base: mainHead: claude/resizable-sidebar-011unLwNoNtK88TLH9hL74hX


📝 Commits (10+)

  • 27ab343 feat(frontend): add resizable sidebar on desktop
  • 5ca89af refactor(frontend): extract clampWidth helper in sidebar resize composable
  • 2372c03 fix(frontend): reset sidebar width to default on user switch
  • 83b3824 fix: touch action non
  • 6501006 fix(frontend): preserve existing body styles during sidebar resize
  • bba6b02 fix(frontend): call stopResize on unmount for full cleanup
  • 1726369 refactor(frontend): register sidebar width watcher only once
  • 640d096 fix(frontend): only save sidebar width when it actually changed
  • 53fe404 fix(frontend): prevent task reload when unrelated settings change
  • e8d71fd playwright base

📊 Changes

11 files changed (+357 additions, -17 deletions)

View changed files

📝 frontend/playwright.config.ts (+1 -1)
📝 frontend/src/components/home/ContentAuth.vue (+9 -3)
📝 frontend/src/components/home/Navigation.vue (+36 -2)
frontend/src/composables/useSidebarResize.ts (+156 -0)
📝 frontend/src/directives/cypress.ts (+3 -1)
📝 frontend/src/modelTypes/IUserSettings.ts (+1 -0)
📝 frontend/src/models/userSettings.ts (+1 -0)
📝 frontend/src/stores/auth.ts (+1 -0)
📝 frontend/src/views/tasks/ShowTasks.vue (+17 -7)
frontend/tests/e2e/misc/sidebar-resize.spec.ts (+123 -0)
📝 frontend/tests/support/authenticateUser.ts (+9 -3)

📄 Description

  • Add draggable resize handle to sidebar on desktop screens
  • Show visual indicator (primary color bar) on hover
  • Use ew-resize cursor to indicate draggability
  • Store sidebar width in user frontend settings
  • Sync width to main content area margin

Closes: #525

Summary by CodeRabbit

  • New Features
    • Sidebar width is now adjustable—drag the resize handle to customize the sidebar to your preferred width.
    • Your sidebar width preference is automatically saved and restored across sessions.
    • Resizable sidebar works seamlessly on desktop and mobile devices with full right-to-left layout support.

✏️ Tip: You can customize this high-level summary in your review settings.


🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/go-vikunja/vikunja/pull/1965 **Author:** [@kolaente](https://github.com/kolaente) **Created:** 12/11/2025 **Status:** ✅ Merged **Merged:** 12/12/2025 **Merged by:** [@kolaente](https://github.com/kolaente) **Base:** `main` ← **Head:** `claude/resizable-sidebar-011unLwNoNtK88TLH9hL74hX` --- ### 📝 Commits (10+) - [`27ab343`](https://github.com/go-vikunja/vikunja/commit/27ab343d402aef7ff917b41c0cfa02b10f1bd53d) feat(frontend): add resizable sidebar on desktop - [`5ca89af`](https://github.com/go-vikunja/vikunja/commit/5ca89afb2eade439fd714881d8cdd9872883dd47) refactor(frontend): extract clampWidth helper in sidebar resize composable - [`2372c03`](https://github.com/go-vikunja/vikunja/commit/2372c032adae93afb0f1171fe299e4546b320789) fix(frontend): reset sidebar width to default on user switch - [`83b3824`](https://github.com/go-vikunja/vikunja/commit/83b38248c4ee50e345e83c7771df759a3edd8eec) fix: touch action non - [`6501006`](https://github.com/go-vikunja/vikunja/commit/6501006a3105cc993b97d826a6cc306b4e82f1fa) fix(frontend): preserve existing body styles during sidebar resize - [`bba6b02`](https://github.com/go-vikunja/vikunja/commit/bba6b02c187615e2551730ac6eeecd83e01e6816) fix(frontend): call stopResize on unmount for full cleanup - [`1726369`](https://github.com/go-vikunja/vikunja/commit/17263691f26cb2fcef96fb192df36587be22be75) refactor(frontend): register sidebar width watcher only once - [`640d096`](https://github.com/go-vikunja/vikunja/commit/640d096d223fac46cd612556b4fa311153188464) fix(frontend): only save sidebar width when it actually changed - [`53fe404`](https://github.com/go-vikunja/vikunja/commit/53fe40481610eb6c4372eeaa08ba4cf59fa60326) fix(frontend): prevent task reload when unrelated settings change - [`e8d71fd`](https://github.com/go-vikunja/vikunja/commit/e8d71fdd43b8603a9aa85146fdb23e02aa95bb9a) playwright base ### 📊 Changes **11 files changed** (+357 additions, -17 deletions) <details> <summary>View changed files</summary> 📝 `frontend/playwright.config.ts` (+1 -1) 📝 `frontend/src/components/home/ContentAuth.vue` (+9 -3) 📝 `frontend/src/components/home/Navigation.vue` (+36 -2) ➕ `frontend/src/composables/useSidebarResize.ts` (+156 -0) 📝 `frontend/src/directives/cypress.ts` (+3 -1) 📝 `frontend/src/modelTypes/IUserSettings.ts` (+1 -0) 📝 `frontend/src/models/userSettings.ts` (+1 -0) 📝 `frontend/src/stores/auth.ts` (+1 -0) 📝 `frontend/src/views/tasks/ShowTasks.vue` (+17 -7) ➕ `frontend/tests/e2e/misc/sidebar-resize.spec.ts` (+123 -0) 📝 `frontend/tests/support/authenticateUser.ts` (+9 -3) </details> ### 📄 Description - Add draggable resize handle to sidebar on desktop screens - Show visual indicator (primary color bar) on hover - Use ew-resize cursor to indicate draggability - Store sidebar width in user frontend settings - Sync width to main content area margin Closes: #525 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Sidebar width is now adjustable—drag the resize handle to customize the sidebar to your preferred width. * Your sidebar width preference is automatically saved and restored across sessions. * Resizable sidebar works seamlessly on desktop and mobile devices with full right-to-left layout support. <sub>✏️ Tip: You can customize this high-level summary in your review settings.</sub> <!-- end of auto-generated comment: release notes by coderabbit.ai --> --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-04-23 09:08:28 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/vikunja#9669