feat(layouts): improve work item layout controls

[aditya-vithaldas]

Summary

Adds richer project work-item layout controls so board, spreadsheet, and calendar views use the same display/grouping state as the list view where applicable.

Linked issues

Closes #174
Closes #178
Closes #179

Type of change

• Feature (feat:) — user-visible new capability
• Bug fix (fix:) — corrects broken behavior
• Refactor (refactor:) — no behavior change, internal only
• Performance (perf:) — measurable improvement
• Documentation (docs:) — README / CLAUDE.md / planning docs only
• Tests (test:) — adds or corrects tests
• Chore (chore:) — deps, tooling, CI, formatting
• Style (style:) — visual / theming polish only

Surface

• API (apps/api/)
• UI (apps/web/)
• Database migration (apps/api/migrations/)
• Background jobs (RabbitMQ / queue)
• Instance settings / Admin UI
• Infra / Docker / CI

What changed

• Board columns can now come from the shared project issue grouping result, including priority, assignee, label, cycle, and module groupings, and board cards honor display-property toggles.
• Spreadsheet columns are driven by display properties, render grouped sections, and support local column resize/reorder from the header.
• Calendar now has month/week modes, a weekend visibility toggle, and drag-to-reschedule through the existing inline issue update path.
• Project work-item layouts now receive the same filtered/ordered issue list after the show-sub-work-items display setting is applied.

Why this approach

The existing list page already computes the canonical grouped issue model and inline update handler, so this reuses those instead of adding layout-specific grouping or persistence paths. Drag affordances on the board remain limited to state-based columns, where dropping a card has an unambiguous state update.

Database / migrations

No schema changes.

Breaking changes

• No
• Yes — described below

Test plan

• npm run validate (root) — typecheck + lint + prettier + go vet + go test
• npm --prefix apps/web run build
• Manual smoke test of the affected flow:
  • Not run locally; this branch was verified with static checks and production build, but no seeded browser session was available.

Screenshots / recordings (UI changes)

Not captured; no seeded local browser session was available for the project work-items view.

Rollout notes

None.

AI assistance

• No AI tools were used for this PR
• AI tools were used — tool(s): OpenAI Codex — and AI-assisted commits include a Co-Authored-By: trailer

Checklist

• PR title follows Conventional Commits and is ≤ 100 chars
• Hooks ran cleanly (no --no-verify bypass)
• No new routes or trailing-slash changes
• No new env vars
• No secrets, tokens, or .env values committed

Summary by CodeRabbit

• New Features
  • Added configurable board and spreadsheet views with selectable columns, grouping, empty-group visibility, and additional issue details.
  • Added column resizing and drag-and-drop column reordering to the spreadsheet view.
  • Added calendar month/week views, optional weekend visibility, and drag-and-drop due-date scheduling.
  • Improved issue cards and rows with conditional display of priorities, dates, labels, sub-work, cycles, and modules.

[coderabbitai]

Warning

Review limit reached

@aditya-vithaldas, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 52 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 61644273-3888-44bc-ae1a-30a139833f72

📥 Commits

Reviewing files that changed from the base of the PR and between 1b8495f and f6e3f5a.

📒 Files selected for processing (2)

• apps/web/src/components/work-item/layouts/IssueLayoutBoard.tsx
• apps/web/src/pages/IssueListPage.tsx

📝 Walkthrough

Walkthrough

Issue list layouts now share grouping and display-property settings. Board cards and spreadsheet columns become configurable, while the calendar adds week mode, weekend visibility, and drag-to-reschedule support.

Changes

Work-item layout enhancements

Layer / File(s)	Summary
Shared layout data wiring apps/web/src/pages/IssueListPage.tsx	Visible issues are ordered from grouped data, and shared grouping, display, derived-value, and inline-update props are passed to the layouts.
Grouped board columns and cards apps/web/src/components/work-item/layouts/IssueLayoutBoard.tsx	Board columns can follow grouped issues, drag targets validate state keys, and cards conditionally render configured properties and derived values.
Configurable spreadsheet layout apps/web/src/components/work-item/layouts/IssueLayoutSpreadsheet.tsx	Spreadsheet columns and grouped sections are configurable, with editable cells, column reordering, and pointer-based resizing.
Calendar modes and rescheduling apps/web/src/components/work-item/layouts/IssueLayoutCalendar.tsx	Calendar rendering supports month/week modes, optional weekends, and drag-and-drop updates to issue target dates.

Estimated code review effort: 4 (Complex) | ~60 minutes

Sequence Diagram(s)

sequenceDiagram
  participant IssueListPage
  participant IssueLayoutCalendar
  participant CalendarPill
  participant InlineUpdate
  IssueListPage->>IssueLayoutCalendar: pass onUpdateIssue
  IssueLayoutCalendar->>CalendarPill: enable dragging
  CalendarPill->>IssueLayoutCalendar: drop issue on date
  IssueLayoutCalendar->>InlineUpdate: update target_date

Loading

Possibly related PRs

• Devlaner/devlane#230: Related board drag-and-drop destination handling.
• Devlaner/devlane#231: Related conditional board card property rendering.
• Devlaner/devlane#262: Related calendar date bucketing and key computation.

Suggested labels: enhancement, UI

Suggested reviewers: martian56, nazarli-shabnam

Poem

I’m a rabbit with columns to hop,
Through week-view dates I never stop.
Cards show what settings say,
Spreadsheets resize along the way,
And dropped issues find their day.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title is concise, conventional, and accurately summarizes the main layout-controls change.
Description check	✅ Passed	The description follows the template well and covers summary, linked issues, change list, rationale, testing, and rollout sections.
Linked Issues check	✅ Passed	The changes satisfy the linked work-item layout goals for board grouping/display toggles, spreadsheet configurability, and calendar week/drag behavior.
Out of Scope Changes check	✅ Passed	The diff stays focused on shared work-item layout controls and supporting page wiring, with no clear unrelated code changes.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 1b8495f03f

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[chatgpt-codex-connector]

Preserve state columns for ungrouped boards

When groupedIssues is supplied, this branch also handles the flat groupBy: 'none' case; project issue display defaults to groupBy: 'none' (projectIssuesDisplay.ts), so the default board now renders one __all__/“All work items” column instead of the previous per-state Kanban columns. Because that column key is not a state id, dndEnabled is false as well, so users who simply switch to Board lose drag-to-state behavior until they manually change grouping to States.

Useful? React with 👍 / 👎.