Skip to content

feat(sidebar): differentiate sidebar background and add DnD group reordering#659

Merged
Kewton merged 1 commit intodevelopfrom
feature/651-worktree
Apr 14, 2026
Merged

feat(sidebar): differentiate sidebar background and add DnD group reordering#659
Kewton merged 1 commit intodevelopfrom
feature/651-worktree

Conversation

@Kewton
Copy link
Copy Markdown
Owner

@Kewton Kewton commented Apr 14, 2026

Summary

  • サイドバー背景色の変更: bg-gray-900bg-gray-800 に変更し、メイン領域との視覚的コントラストを確保。ホバー/選択状態・検索入力・ソートドロップダウンも一段階暗く調整。
  • グループ表示順のドラッグ&ドロップ: ツリー表示時にリポジトリグループを自由に並べ替え可能。
    • @dnd-kit でアクセシブルなDnD実装(PointerSensor、8px activationConstraint)
    • 各グループヘッダーにグリップハンドルを表示
    • 検索中はDnD無効(フィルタリング中は順序変更不要なため)
  • DB永続化 (migration v27): app_settings テーブル(キー/バリューストア)を新規作成し、グループ順を保存。GET/PUT /api/sidebar/group-order API経由でスマホや他ブラウザからも同じ順序が適用される。
  • 楽観的更新: ドラッグ完了時に即座にUI反映し、API失敗時のみロールバック。

Test plan

  • PC版サイドバーの背景色がメイン領域より暗くなっていることを確認
  • ツリー表示でグループヘッダーにグリップアイコンが表示される
  • グループをドラッグして並べ替えできる
  • リロード後も順序が保持される
  • 別ブラウザ/デバイスでも同じ順序が適用される
  • 検索中はドラッグが無効(グリップアイコン非表示)
  • フラット表示ではDnD非表示
  • 全ユニットテストがパス (npm run test:unit)

🤖 Generated with Claude Code

…rdering

- Change sidebar nav bg from gray-900 to gray-800 for contrast vs main content
- Darken branch item hover/selected states (gray-700→600) to match new base
- Darken search input and sort dropdown backgrounds (gray-800→700)
- Add drag-and-drop reordering of repository groups in grouped view
  - @dnd-kit/core + sortable + utilities for accessible DnD
  - PointerSensor with 8px activationConstraint (click vs drag distinction)
  - GripVertical drag handle on each group header
  - Disabled during search (order irrelevant while filtering)
- Persist group order to DB via new app_settings table (migration v27)
  - GET/PUT /api/sidebar/group-order API route
  - Optimistic update with server revert on error
  - Order applies across browsers and devices
- Update unit tests for new color values and schema version 27

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@Kewton Kewton merged commit 7796a90 into develop Apr 14, 2026
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant