Skip to content

feat(web): add v2 shell and domain components (2/3) - #407

Closed
YSamed wants to merge 10 commits into
Devlaner:mainfrom
YSamed:feat/v2-components
Closed

YSamed wants to merge 10 commits into
Devlaner:mainfrom
YSamed:feat/v2-components

Conversation

@YSamed

@YSamed YSamed commented Oct 12, 2026 •

Copy link
Copy Markdown

Problem and resulting behavior

Part 2 of the opt-in v2 interface adds the shell and domain components: navigation, authentication and creation forms, settings panels, work-item tables/layouts, and reusable list controls. It builds on the foundations in #406. Pages and the interface preference are activated in #401.

Merge sequence

  1. feat(web): add v2 foundations and localization support (1/3) #406 — foundations, 94 changed files.
  2. This PR — shell/domain components, 82 additional files.
  3. feat(web): complete opt-in v2 pages and shared-route integration (3/3) #401 — pages and shared-route integration, 40 additional files.

All three upstream PRs are open now, so the author does not need to submit the later stages after an earlier merge. Merge the prerequisites first.

This PR targets main because the author cannot create prerequisite target branches in Devlaner/devlane. Until #406 lands, its GitHub diff includes the foundations (176 files total), and CodeRabbit may skip it. The isolated 82-file review is available at YSamed#2 and YSamed/devlane@feat/v2-foundations...feat/v2-components.

Preserve prerequisite commit ancestry when merging #406 and this PR (use merge commits, if repository settings allow them); GitHub can then reduce subsequent diffs automatically. Squash/rebase merges require updating the downstream heads from main before their diffs and CodeRabbit reviews can shrink. Maintainers can update those heads via GitHub where available. Please leave the prerequisite fork branches intact until the sequence is merged.

Validation

  • This isolated components stage passed web typecheck, ESLint, Prettier and production build.
  • Foundations and the complete integration passed upstream API CI with Docker and go test -v -race -count=1 ./..., plus UI CI.
  • The API contents in this components stage are identical to those verified in foundations and full integration.
  • This upstream PR runs its own CI on the existing components commit.

The duplicate upstream migration version was corrected in the foundations: the earlier Slack migration remains 000013, the later cancelled-state correction is 000014, and both SQL bodies are unchanged. A Docker-free migration catalog regression test is included.

AI assistance

  • Claude Code contributed the original implementation; Codex reconciled main, split the changes and verified the stages. AI-assisted commits include co-author trailers.

Review fixes

Verified and fixed all nine CodeRabbit findings from #406:

  • Scope registry CSS updates to the v2 stylesheet.
  • Default native Button actions to type=button while retaining explicit submits and asChild behavior.
  • Refresh dithered-logo colors when data-theme changes.
  • Keep the sidebar shortcut out of editor-owned, editable and repeated key events.
  • Guard both providers against blocked or full localStorage.
  • Distinguish null filter clears from omitted fields.
  • Paginate cycle issue data with valid page sizes, including initial loading and refreshes.
  • Render dates using the selected language and preserve calendar dates for both date-only and API RFC3339 values.
  • Match date presets from local midnight and use inclusive custom bounds.

Local validation: complete web typecheck, ESLint, Prettier and production build passed; both isolated prerequisite stages also passed those checks. 35 targeted regression checks passed under each of America/Los_Angeles and Europe/Istanbul (70 checks total). API sources are unchanged by these review fixes. Previous review-fix head passed API CI and UI CI. All nine original CodeRabbit review threads on #406 are resolved.

Follow-up: failed issue loading and retry

The controller now reports issue-load failures separately from successful empty results, exposes retry progress, preserves the last successful list when a refresh fails, and rejects stale completions or delayed retry callbacks after navigation/unmount. Retrying a metadata failure reloads the missing project/workspace as well.

The shared work-item section used by project and cycle pages renders a translated alert with a Try again button instead of the empty-state copy when issue loading fails. This UI is in the components stage; the controller/error state is in foundations.

13 targeted regression checks passed, covering a later-page failure, rendered error vs empty UI, retry progress and recovery, refresh failure, overlapping requests, navigation/unmount, and metadata recovery. Full web typecheck, ESLint, Prettier and production build passed; both prerequisite stages independently passed the same checks. API sources are unchanged. The updated head passed API CI and UI CI. The follow-up issue-load review thread is resolved.

YSamed and others added 4 commits October 13, 2026 02:20
Co-Authored-By: Codex <noreply@openai.com>
Co-Authored-By: Codex <noreply@openai.com>
Keep the earlier Slack migration at version 13 and move the later cancelled-state correction to version 14 without changing either SQL body. Validate unique catalog versions and paired directions without Docker.

Co-Authored-By: Codex <noreply@openai.com>
Keep the earlier Slack migration at version 13 and move the later cancelled-state correction to version 14 without changing either SQL body. Validate unique catalog versions and paired directions without Docker.

Co-Authored-By: Codex <noreply@openai.com>
@YSamed
YSamed requested a review from a team as a code owner October 12, 2026 23:35
@coderabbitai

coderabbitai Bot commented Oct 12, 2026 •

Copy link
Copy Markdown
Contributor

Important

Review skipped

Too many files!

This PR contains 175 files, which is 75 over the limit of 100.

To get a review, reduce the PR to 100 files or fewer by splitting it into smaller PRs or changing its base branch.

Upgrade to a paid plan to raise the limit.

This review couldn't start because sufficient usage credits or metered capacity aren't available. Add credits or update usage-based reviews in the billing tab, then retry.

Check out review usage here.

⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: af6df62a-703e-497d-874f-652d74ef82d6
📥 Commits

Reviewing files that changed from the base of the PR and between 7265462 and 439c028.

⛔ Files ignored due to path filters (1)
  • apps/web/package-lock.json is excluded by !**/package-lock.json
📒 Files selected for processing (175)
  • .gitignore
  • apps/api/internal/database/migrate_test.go
  • apps/api/internal/handler/user.go
  • apps/api/migrations/000014_fix_cancelled_state_group.down.sql
  • apps/api/migrations/000014_fix_cancelled_state_group.up.sql
  • apps/web/components.json
  • apps/web/eslint.config.js
  • apps/web/i18next-parser.config.cjs
  • apps/web/package.json
  • apps/web/src/api/types.ts
  • apps/web/src/components/CreateWorkItemModal.tsx
  • apps/web/src/i18n/README.md
  • apps/web/src/i18n/dynamicKeys.ts
  • apps/web/src/i18n/index.ts
  • apps/web/src/i18n/locales/az/translation.json
  • apps/web/src/i18n/locales/en/translation.json
  • apps/web/src/i18n/locales/tr/translation.json
  • apps/web/src/lib/activityDescription.ts
  • apps/web/src/v2/components/app-sidebar.tsx
  • apps/web/src/v2/components/archives-toolbar.tsx
  • apps/web/src/v2/components/auth-page-shell.tsx
  • apps/web/src/v2/components/cover-image-dialog.tsx
  • apps/web/src/v2/components/create-cycle-dialog.tsx
  • apps/web/src/v2/components/create-epic-dialog.tsx
  • apps/web/src/v2/components/create-module-dialog.tsx
  • apps/web/src/v2/components/create-page-dialog.tsx
  • apps/web/src/v2/components/create-project-dialog.tsx
  • apps/web/src/v2/components/create-project-view-dialog.tsx
  • apps/web/src/v2/components/create-view-dialog.tsx
  • apps/web/src/v2/components/create-work-item-dialog.tsx
  • apps/web/src/v2/components/create-workspace-form.tsx
  • apps/web/src/v2/components/cycle-stats-sheet.tsx
  • apps/web/src/v2/components/cycles-filters-menu.tsx
  • apps/web/src/v2/components/detail-page-skeleton.tsx
  • apps/web/src/v2/components/drafts-toolbar.tsx
  • apps/web/src/v2/components/forgot-password-form.tsx
  • apps/web/src/v2/components/image-picker.tsx
  • apps/web/src/v2/components/invite-accept-form.tsx
  • apps/web/src/v2/components/invite-signup-form.tsx
  • apps/web/src/v2/components/layout/AppShell.tsx
  • apps/web/src/v2/components/list-filter-chips.tsx
  • apps/web/src/v2/components/list-filters-menu.tsx
  • apps/web/src/v2/components/list-page-skeleton.tsx
  • apps/web/src/v2/components/list-sort-menu.tsx
  • apps/web/src/v2/components/login-form.tsx
  • apps/web/src/v2/components/nav-main.tsx
  • apps/web/src/v2/components/nav-projects.tsx
  • apps/web/src/v2/components/nav-secondary.tsx
  • apps/web/src/v2/components/nav-user.tsx
  • apps/web/src/v2/components/notification-snooze-menu.tsx
  • apps/web/src/v2/components/page-fallback.tsx
  • apps/web/src/v2/components/page-heading.tsx
  • apps/web/src/v2/components/page-transition.tsx
  • apps/web/src/v2/components/password-field.tsx
  • apps/web/src/v2/components/project-list-toolbar.tsx
  • apps/web/src/v2/components/project-work-items-section.tsx
  • apps/web/src/v2/components/projects-toolbar.tsx
  • apps/web/src/v2/components/reset-password-form.tsx
  • apps/web/src/v2/components/set-password-form.tsx
  • apps/web/src/v2/components/settings/account/account-activity-panel.tsx
  • apps/web/src/v2/components/settings/account/account-preferences-panel.tsx
  • apps/web/src/v2/components/settings/account/account-profile-panel.tsx
  • apps/web/src/v2/components/settings/account/account-security-panel.tsx
  • apps/web/src/v2/components/settings/api-tokens-panel.tsx
  • apps/web/src/v2/components/settings/invite-members-dialog.tsx
  • apps/web/src/v2/components/settings/member-role-select.tsx
  • apps/web/src/v2/components/settings/notification-preferences-panel.tsx
  • apps/web/src/v2/components/settings/project/project-automations-panel.tsx
  • apps/web/src/v2/components/settings/project/project-estimates-panel.tsx
  • apps/web/src/v2/components/settings/project/project-features-panel.tsx
  • apps/web/src/v2/components/settings/project/project-general-panel.tsx
  • apps/web/src/v2/components/settings/project/project-item-dialog.tsx
  • apps/web/src/v2/components/settings/project/project-labels-panel.tsx
  • apps/web/src/v2/components/settings/project/project-members-panel.tsx
  • apps/web/src/v2/components/settings/project/project-states-panel.tsx
  • apps/web/src/v2/components/settings/settings-panel.tsx
  • apps/web/src/v2/components/settings/settings-shell.tsx
  • apps/web/src/v2/components/settings/timezone-combobox.tsx
  • apps/web/src/v2/components/settings/workspace/repo-sync-dialog.tsx
  • apps/web/src/v2/components/settings/workspace/slack-channel-dialog.tsx
  • apps/web/src/v2/components/settings/workspace/workspace-exports-panel.tsx
  • apps/web/src/v2/components/settings/workspace/workspace-general-panel.tsx
  • apps/web/src/v2/components/settings/workspace/workspace-integrations-panel.tsx
  • apps/web/src/v2/components/settings/workspace/workspace-members-panel.tsx
  • apps/web/src/v2/components/settings/workspace/workspace-webhooks-panel.tsx
  • apps/web/src/v2/components/signup-form.tsx
  • apps/web/src/v2/components/ui/alert-dialog.tsx
  • apps/web/src/v2/components/ui/alert.tsx
  • apps/web/src/v2/components/ui/avatar.tsx
  • apps/web/src/v2/components/ui/badge.tsx
  • apps/web/src/v2/components/ui/breadcrumb.tsx
  • apps/web/src/v2/components/ui/button.tsx
  • apps/web/src/v2/components/ui/calendar.tsx
  • apps/web/src/v2/components/ui/card.tsx
  • apps/web/src/v2/components/ui/chart.tsx
  • apps/web/src/v2/components/ui/checkbox.tsx
  • apps/web/src/v2/components/ui/circular-progress.tsx
  • apps/web/src/v2/components/ui/collapsible.tsx
  • apps/web/src/v2/components/ui/command.tsx
  • apps/web/src/v2/components/ui/context-menu.tsx
  • apps/web/src/v2/components/ui/dialog.tsx
  • apps/web/src/v2/components/ui/dithered-logo.tsx
  • apps/web/src/v2/components/ui/dropdown-menu.tsx
  • apps/web/src/v2/components/ui/empty.tsx
  • apps/web/src/v2/components/ui/field.tsx
  • apps/web/src/v2/components/ui/hero-geometric.tsx
  • apps/web/src/v2/components/ui/hover-card.tsx
  • apps/web/src/v2/components/ui/input.tsx
  • apps/web/src/v2/components/ui/label.tsx
  • apps/web/src/v2/components/ui/pagination.tsx
  • apps/web/src/v2/components/ui/popover.tsx
  • apps/web/src/v2/components/ui/prism-gradient.tsx
  • apps/web/src/v2/components/ui/progress.tsx
  • apps/web/src/v2/components/ui/scroll-area.tsx
  • apps/web/src/v2/components/ui/select.tsx
  • apps/web/src/v2/components/ui/separator.tsx
  • apps/web/src/v2/components/ui/sheet.tsx
  • apps/web/src/v2/components/ui/sidebar.tsx
  • apps/web/src/v2/components/ui/skeleton.tsx
  • apps/web/src/v2/components/ui/sonner.tsx
  • apps/web/src/v2/components/ui/switch.tsx
  • apps/web/src/v2/components/ui/table.tsx
  • apps/web/src/v2/components/ui/tabs.tsx
  • apps/web/src/v2/components/ui/textarea.tsx
  • apps/web/src/v2/components/ui/toggle-group.tsx
  • apps/web/src/v2/components/ui/toggle.tsx
  • apps/web/src/v2/components/ui/tooltip.tsx
  • apps/web/src/v2/components/upload-image-dialog.tsx
  • apps/web/src/v2/components/views-toolbar.tsx
  • apps/web/src/v2/components/work-item-inline-cells.tsx
  • apps/web/src/v2/components/work-item-layouts/work-items-board-layout.tsx
  • apps/web/src/v2/components/work-item-layouts/work-items-calendar-layout.tsx
  • apps/web/src/v2/components/work-item-layouts/work-items-gantt-layout.tsx
  • apps/web/src/v2/components/work-item-layouts/work-items-spreadsheet-layout.tsx
  • apps/web/src/v2/components/work-item-row-actions.tsx
  • apps/web/src/v2/components/work-item-subscribe-button.tsx
  • apps/web/src/v2/components/work-items-bulk-bar.tsx
  • apps/web/src/v2/components/work-items-display-menu.tsx
  • apps/web/src/v2/components/work-items-filters-menu.tsx
  • apps/web/src/v2/components/work-items-properties-menu.tsx
  • apps/web/src/v2/components/work-items-table.tsx
  • apps/web/src/v2/contexts/AccentColorContext.tsx
  • apps/web/src/v2/contexts/AppShellHeaderContext.tsx
  • apps/web/src/v2/contexts/InterfaceContext.tsx
  • apps/web/src/v2/contexts/ProjectSavedViewDisplayContext.tsx
  • apps/web/src/v2/contexts/WorkspaceViewsStateProvider.tsx
  • apps/web/src/v2/hooks/use-mobile.ts
  • apps/web/src/v2/hooks/useIsDarkTheme.ts
  • apps/web/src/v2/hooks/useListViewPreferences.ts
  • apps/web/src/v2/hooks/usePersistedChoice.ts
  • apps/web/src/v2/hooks/usePersistedSearchParams.ts
  • apps/web/src/v2/hooks/useProjectCyclesController.ts
  • apps/web/src/v2/hooks/useProjectIssuesController.ts
  • apps/web/src/v2/hooks/useProjectsListPreferences.ts
  • apps/web/src/v2/hooks/useWorkspaceViewPreferences.ts
  • apps/web/src/v2/lib/filterProjectsList.ts
  • apps/web/src/v2/lib/lastWorkspaceView.ts
  • apps/web/src/v2/lib/listControls.ts
  • apps/web/src/v2/lib/project.ts
  • apps/web/src/v2/lib/projectIssueLoader.ts
  • apps/web/src/v2/lib/projectIssuesFiltersApply.ts
  • apps/web/src/v2/lib/projectIssuesFiltersStorage.ts
  • apps/web/src/v2/lib/projectListEvents.ts
  • apps/web/src/v2/lib/workItemRelations.ts
  • apps/web/src/v2/lib/workItemsSort.ts
  • apps/web/src/v2/lib/workspaceViewFiltersApply.ts
  • apps/web/src/v2/lib/workspaceViewParams.ts
  • apps/web/src/v2/styles/index.css
  • apps/web/src/v2/styles/shadcn-bridge.css
  • apps/web/src/v2/styles/shadcn-reference-theme.css
  • apps/web/src/v2/styles/shadcn-v4-theme.css
  • apps/web/src/v2/styles/v2-color-themes.css
  • apps/web/tsconfig.app.json
  • apps/web/tsconfig.json
  • apps/web/vite.config.ts

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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

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

YSamed and others added 6 commits October 13, 2026 11:54
Guard storage, preserve explicit filter clears, paginate complete cycle lists, use local dates and selected language, and prevent accidental submits and editor shortcut conflicts. Scope generated CSS and refresh logo colors on theme changes.

Co-Authored-By: Codex <noreply@openai.com>
Guard storage, preserve explicit filter clears, paginate complete cycle lists, use local dates and selected language, and prevent accidental submits and editor shortcut conflicts. Scope generated CSS and refresh logo colors on theme changes.

Co-Authored-By: Codex <noreply@openai.com>
Treat both date-only strings and RFC3339 date fields returned by the API as local calendar dates for display and filtering.

Co-Authored-By: Codex <noreply@openai.com>
Treat both date-only strings and RFC3339 date fields returned by the API as local calendar dates for display and filtering.

Co-Authored-By: Codex <noreply@openai.com>
Distinguish failed loading from a genuinely empty cycle, expose retry progress, preserve successful data on refresh failures, and discard stale requests after navigation or newer attempts.

Co-Authored-By: Codex <noreply@openai.com>
Distinguish failed loading from a genuinely empty cycle, expose retry progress, preserve successful data on refresh failures, and discard stale requests after navigation or newer attempts.

Co-Authored-By: Codex <noreply@openai.com>
@martian56

Copy link
Copy Markdown
Member

Thanks for the effort here! We're not considering a second (v2) UI option. Improvements to the current UI are very welcome, though, so feel free to open focused PRs against the existing pages and components.

@martian56 martian56 closed this Oct 25, 2026
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.

2 participants