Fix/header rendering

[2witstudios]

Walkthrough - Header Fixes and UI Polish
I have implemented comprehensive fixes and UI improvements for the header area.

1. Functional Fixes (Missing/Stuck Header)
   The header now loads reliably across all page types and during active editing sessions.

Centralized State Management
Store Sync:
CenterPanel
now automatically syncs the active pageId from the URL to the global store.
Direct Prop Passing:
ViewHeader
and its children now accept pageId as a prop, ensuring immediate and reliable rendering even if the store is lagging.
SWR Hook Improvements
First-Fetch Protection: Hooks for breadcrumbs, permissions, and page tree now ensure the first fetch is never blocked by active AI chat or document editing.
Navigation Resets: The loaded state is reset on every navigation, allowing fresh data to load even if the previous page was already loaded.
2. UI Polish (Truncation)
To ensure a consistent and mobile-friendly UI, I've added truncation to long titles and breadcrumb items.

Breadcrumb Truncation
Each individual item in the breadcrumb path now has a responsive maximum width.
Long folder or page names will be truncated with ... to prevent the breadcrumbs from overflowing the screen.
Full titles are still accessible via browser hover tooltips.
Page Title Truncation
The main page title now truncates if it becomes too long to fit in the header area.
Like breadcrumbs, the full title is available on hover.
Verification Tips
Long Names: Create a page or folder with an extremely long name; verify it truncates cleanly.
Mobile View: Check the header on small screens; breadcrumbs should stay on one line or truncate cleanly.
Hover: Hover over a truncated element to see the full text.

Summary by CodeRabbit

Release Notes

• New Features

  • Added version history browsing for pages and drives with rollback capability
  • Implemented activity restore functionality to revert changes to previous versions
  • Added AI conversation undo with preview and selective rollback modes
  • Introduced retention policies for version history based on subscription tier

• Documentation

  • Added critical rules for tool usage and database migration guidelines

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

[chatgpt-codex-connector]

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.
To continue using code reviews, you can upgrade your account or add credits to your account and enable them for code reviews in your settings.

[coderabbitai]

Caution

Review failed

The pull request is closed.

Walkthrough

This PR introduces a comprehensive activity rollback and AI conversation undo system. It adds new API endpoints for previewing and executing rollbacks, retrieves version history with retention policies, implements permission-based authorization for rollback operations, introduces database schema extensions for audit tracking and retention configuration, and adds UI components for history viewing, restoration confirmations, and undo dialogs.

Changes

Cohort / File(s)	Summary
Database Schema & Migrations packages/db/drizzle/0025_icy_wallflower.sql, 0026_nervous_carnage.sql, 0027_fix_retention_updated_at.sql, 0028_version_history_review_fixes.sql, 0029_brave_guardsmen.sql, packages/db/src/schema/monitoring.ts, packages/db/drizzle/meta/_journal.json	Adds rollback operation enum values; introduces retention_policies table with subscription tier mapping and retention days enforcement; augments activity_logs with contentSnapshot, contentFormat, rollback source tracking (rollbackFromActivityId, rollbackSourceOperation, rollbackSourceTimestamp, rollbackSourceTitle); defines content_format and subscription_tier enums with check constraints.
Rollback Service Layer packages/lib/src/permissions/rollback-permissions.ts, packages/lib/src/permissions/__tests__/rollback-permissions.test.ts, packages/lib/src/permissions/index.ts, apps/web/src/services/api/rollback-service.ts, apps/web/src/services/api/__tests__/rollback-service.test.ts	Introduces RollbackContext type and permission model; implements canUserRollback with context-specific authorization (ai_tool, drive, page, user_dashboard); adds rollback preview/execute functions handling per-resource rollback logic (page, drive, permissions, agent config, members, roles, messages); includes getUserRetentionDays, getPageVersionHistory, getDriveVersionHistory with filtering and pagination.
AI Undo Service Layer apps/web/src/services/api/ai-undo-service.ts, apps/web/src/services/api/__tests__/ai-undo-service.test.ts	Adds previewAiUndo and executeAiUndo functions supporting messages_only and messages_and_changes modes; handles transaction-based message soft-deletion and activity rollback with comprehensive error handling and logging.
Activity API Endpoints apps/web/src/app/api/activities/[activityId]/rollback/route.ts, apps/web/src/app/api/activities/[activityId]/rollback/__tests__/route.test.ts, apps/web/src/app/api/activities/[activityId]/route.ts	Implements POST /rollback endpoint for executing/previewing activity rollback with dryRun support; adds GET /activities/[activityId] to fetch activity with rollback eligibility and authorization checks.
Chat Undo API Endpoint apps/web/src/app/api/ai/chat/messages/[messageId]/undo/route.ts, apps/web/src/app/api/ai/chat/messages/[messageId]/undo/__tests__/route.test.ts	Adds GET /undo for preview and POST /undo for execution with mode validation; implements per-chat permission checks (page_chat vs global) and partial-failure (207) response handling.
Drive History Endpoint apps/web/src/app/api/drives/[driveId]/history/route.ts	Implements GET /history with admin/owner authorization, query parameter parsing (limit, offset, date range, filters), retention cutoff application, and paginated activity response with rollback eligibility augmentation.
Page History Endpoint & Tests apps/web/src/app/api/pages/[pageId]/history/route.ts, apps/web/src/app/api/pages/[pageId]/history/__tests__/route.test.ts	Adds GET /history endpoint with authorization, retention logic, query validation (limit, offset, date range, actorId, operation, includeAiOnly); comprehensive test coverage for auth, retention tiers, pagination, and response formatting.
Activity UI Components apps/web/src/components/activity/ActivityDashboard.tsx, apps/web/src/components/activity/ActivityItem.tsx, apps/web/src/components/activity/ActivityTimeline.tsx, apps/web/src/components/activity/constants.ts	Adds rollback context propagation and handleRollback handlers; extends ActivityItem and ActivityTimeline with context/onRollback props; adds RollbackContext type and rollback operation icon/label config.
Version History UI Components apps/web/src/components/version-history/VersionHistoryPanel.tsx, apps/web/src/components/version-history/VersionHistoryItem.tsx, apps/web/src/components/version-history/RollbackConfirmDialog.tsx, apps/web/src/components/version-history/index.ts	Introduces VersionHistoryPanel with filtering, pagination, and rollback; VersionHistoryItem with restore action and preview fetching; RollbackConfirmDialog with warnings display and loading states.
Chat Undo UI Components apps/web/src/components/ai/shared/chat/UndoAiChangesDialog.tsx, apps/web/src/components/ai/shared/chat/ChatMessagesArea.tsx, apps/web/src/components/ai/shared/chat/MessageActionButtons.tsx, apps/web/src/components/ai/shared/chat/MessageRenderer.tsx, apps/web/src/components/ai/shared/chat/index.ts	Adds UndoAiChangesDialog component with preview fetching and mode selection; integrates undo trigger into ChatMessagesArea, MessageActionButtons, and MessageRenderer with conditional rendering based on tool-call presence.
UI Radio Group Component apps/web/src/components/ui/radio-group.tsx	New styled RadioGroup and RadioGroupItem components wrapping Radix UI primitives for mode selection in undo dialogs.
Layout/Header Component Updates apps/web/src/components/layout/middle-content/CenterPanel.tsx, apps/web/src/components/layout/middle-content/content-header/index.tsx, apps/web/src/components/layout/middle-content/content-header/Breadcrumbs.tsx, apps/web/src/components/layout/middle-content/content-header/EditableTitle.tsx, apps/web/src/components/layout/middle-content/content-header/page-settings/ShareDialog.tsx	Introduces optional pageId prop propagation to header components for explicit page context; adds global store/socket initialization in CenterPanel; updates Breadcrumbs, EditableTitle, ShareDialog to accept and resolve pageId prop with store fallback.
Sidebar Activity Tab apps/web/src/components/layout/right-sidebar/ai-assistant/SidebarActivityTab.tsx	Adds rollback state management, preview fetching, and rollback execution with confirmation dialog and toast notifications.
Hooks Updates apps/web/src/hooks/useBreadcrumbs.ts, apps/web/src/hooks/usePageTree.ts, apps/web/src/hooks/usePermissions.ts	Introduces hasLoadedRef-based initial-load safeguard to prevent premature SWR pausing; resets on dependency changes (pageId/driveId); updates isLoading logic to require valid context IDs.
Monitoring & Activity Logging packages/lib/src/monitoring/activity-logger.ts, packages/lib/src/monitoring/__tests__/activity-logger-compliance.test.ts	Extends ActivityOperation enum with rollback and conversation undo variants; extends ActivityLogInput with contentFormat, rollback source tracking fields; adds logRollbackActivity and logConversationUndo convenience wrappers.
Library Exports packages/lib/src/permissions/index.ts, packages/lib/package.json, apps/web/src/services/api/index.ts	Exports new rollback-permissions and ai-undo-service modules; adds ./permissions and ./monitoring entry points to lib package.json with type mappings.
Dependencies apps/web/package.json	Adds @radix-ui/react-radio-group@^1.3.8 for radio button UI in undo mode selection.
Documentation CLAUDE.md	Adds section 4.3 Critical Rules documenting mandatory tool usage (pnpm) and strict Drizzle migration guidelines.

Sequence Diagrams

sequenceDiagram
    participant User as User/Client
    participant UI as UI Component
    participant API as API Route
    participant Auth as Auth Service
    participant Service as Rollback Service
    participant DB as Database
    
    User->>UI: Click "Restore Previous Version"
    activate UI
    UI->>API: GET /api/activities/[id]?context=page
    activate API
    API->>Auth: authenticateRequestWithOptions(jwt, no-csrf)
    activate Auth
    Auth-->>API: ✓ authenticated
    deactivate Auth
    API->>Service: getActivityById(activityId)
    activate Service
    Service->>DB: Query activity log
    activate DB
    DB-->>Service: activity details
    deactivate DB
    Service->>Service: canUserViewPage(pageId)
    Service-->>API: activity + canRollback flag
    deactivate Service
    API-->>UI: { activity, canRollback, warnings }
    deactivate API
    UI->>UI: Show RollbackConfirmDialog with preview
    deactivate UI
    
    User->>UI: Confirm rollback
    activate UI
    UI->>API: POST /api/activities/[id]/rollback
    activate API
    API->>Auth: authenticateRequestWithOptions(jwt, csrf-required)
    activate Auth
    Auth-->>API: ✓ authenticated
    deactivate Auth
    API->>Service: executeRollback(activityId, userId, context)
    activate Service
    Service->>Service: previewRollback (validation)
    Service->>Service: canUserRollback (permission check)
    Service->>DB: Begin transaction
    activate DB
    Service->>DB: Restore previous values per resource type
    Service->>DB: Log rollback activity
    Service->>DB: Commit
    DB-->>Service: ✓ committed
    deactivate DB
    Service-->>API: { rollbackActivityId, restoredValues, message }
    deactivate Service
    API-->>UI: { success: true, data }
    deactivate API
    UI->>UI: Show success toast & refresh
    deactivate UI

Loading

sequenceDiagram
    participant User as User/Client
    participant UI as UI Component
    participant API as API Route
    participant Auth as Auth Service
    participant Service as AI Undo Service
    participant Rollback as Rollback Service
    participant DB as Database
    
    User->>UI: Click Undo on AI message
    activate UI
    UI->>API: GET /api/ai/chat/messages/[id]/undo
    activate API
    API->>Auth: authenticateRequestWithOptions(jwt)
    activate Auth
    Auth-->>API: ✓ authenticated
    deactivate Auth
    API->>Service: previewAiUndo(messageId, userId)
    activate Service
    Service->>DB: Get message & related AI activities
    activate DB
    DB-->>Service: message + activities
    deactivate DB
    Service->>Rollback: isActivityEligibleForRollback (per activity)
    activate Rollback
    Rollback-->>Service: canRollback flags
    deactivate Rollback
    Service-->>API: { messages, activities, canRollback array }
    deactivate Service
    API->>Service: checkUndoPermissions
    API-->>UI: preview data
    deactivate API
    UI->>UI: Show UndoAiChangesDialog with mode selection
    deactivate UI
    
    User->>UI: Select mode & confirm undo
    activate UI
    UI->>API: POST /api/ai/chat/messages/[id]/undo { mode }
    activate API
    API->>Auth: authenticateRequestWithOptions(jwt, csrf-required)
    activate Auth
    Auth-->>API: ✓ authenticated
    deactivate Auth
    API->>Service: executeAiUndo(messageId, userId, mode, preview)
    activate Service
    Service->>DB: Begin transaction
    activate DB
    Service->>DB: Soft-delete messages
    alt mode includes changes
        Service->>Rollback: executeRollback (per activity, reverse order)
        activate Rollback
        Rollback->>DB: Restore previous values
        Rollback-->>Service: results
        deactivate Rollback
    end
    Service->>DB: Log conversation_undo activity
    Service->>DB: Commit
    DB-->>Service: ✓ committed
    deactivate DB
    Service-->>API: { messagesDeleted, activitiesRolledBack }
    deactivate Service
    API-->>UI: { success: true, data }
    deactivate API
    UI->>UI: Show success toast & refresh
    deactivate UI

Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

• Create user activity dashboard page #103: Modifies the same activity dashboard and UI components (ActivityDashboard, ActivityItem, ActivityTimeline, constants), directly overlapping with rollback UI integration.
• feat: Activity Monitoring System for Enterprise Auditability #99 or #116: Extends the monitoring/activity-logger surface and database activity schema (new operation enums and activity log fields), foundational to the audit and logging changes in this PR.
• feat(ai): Refactor AI Components and Enhance Tool Rendering #91: Updates chat UI components (MessageRenderer, ChatMessagesArea exports) that are extended in this PR for undo integration, creating a shared component dependency.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix/header-rendering

---

📜 Recent review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 52dfdd1 and 4bd399d.

⛔ Files ignored due to path filters (1)

• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (55)

• CLAUDE.md
• apps/web/package.json
• apps/web/src/app/api/activities/[activityId]/rollback/__tests__/route.test.ts
• apps/web/src/app/api/activities/[activityId]/rollback/route.ts
• apps/web/src/app/api/activities/[activityId]/route.ts
• apps/web/src/app/api/ai/chat/messages/[messageId]/undo/__tests__/route.test.ts
• apps/web/src/app/api/ai/chat/messages/[messageId]/undo/route.ts
• apps/web/src/app/api/drives/[driveId]/history/route.ts
• apps/web/src/app/api/pages/[pageId]/history/__tests__/route.test.ts
• apps/web/src/app/api/pages/[pageId]/history/route.ts
• apps/web/src/components/activity/ActivityDashboard.tsx
• apps/web/src/components/activity/ActivityItem.tsx
• apps/web/src/components/activity/ActivityTimeline.tsx
• apps/web/src/components/activity/constants.ts
• apps/web/src/components/ai/shared/chat/ChatMessagesArea.tsx
• apps/web/src/components/ai/shared/chat/MessageActionButtons.tsx
• apps/web/src/components/ai/shared/chat/MessageRenderer.tsx
• apps/web/src/components/ai/shared/chat/UndoAiChangesDialog.tsx
• apps/web/src/components/ai/shared/chat/index.ts
• apps/web/src/components/layout/middle-content/CenterPanel.tsx
• apps/web/src/components/layout/middle-content/content-header/Breadcrumbs.tsx
• apps/web/src/components/layout/middle-content/content-header/EditableTitle.tsx
• apps/web/src/components/layout/middle-content/content-header/index.tsx
• apps/web/src/components/layout/middle-content/content-header/page-settings/ShareDialog.tsx
• apps/web/src/components/layout/right-sidebar/ai-assistant/SidebarActivityTab.tsx
• apps/web/src/components/ui/radio-group.tsx
• apps/web/src/components/version-history/RollbackConfirmDialog.tsx
• apps/web/src/components/version-history/VersionHistoryItem.tsx
• apps/web/src/components/version-history/VersionHistoryPanel.tsx
• apps/web/src/components/version-history/index.ts
• apps/web/src/hooks/useBreadcrumbs.ts
• apps/web/src/hooks/usePageTree.ts
• apps/web/src/hooks/usePermissions.ts
• apps/web/src/services/api/__tests__/ai-undo-service.test.ts
• apps/web/src/services/api/__tests__/rollback-service.test.ts
• apps/web/src/services/api/ai-undo-service.ts
• apps/web/src/services/api/index.ts
• apps/web/src/services/api/rollback-service.ts
• packages/db/drizzle/0025_icy_wallflower.sql
• packages/db/drizzle/0026_nervous_carnage.sql
• packages/db/drizzle/0027_fix_retention_updated_at.sql
• packages/db/drizzle/0028_version_history_review_fixes.sql
• packages/db/drizzle/0029_brave_guardsmen.sql
• packages/db/drizzle/meta/0025_snapshot.json
• packages/db/drizzle/meta/0026_snapshot.json
• packages/db/drizzle/meta/0028_snapshot.json
• packages/db/drizzle/meta/0029_snapshot.json
• packages/db/drizzle/meta/_journal.json
• packages/db/src/schema/monitoring.ts
• packages/lib/package.json
• packages/lib/src/monitoring/__tests__/activity-logger-compliance.test.ts
• packages/lib/src/monitoring/activity-logger.ts
• packages/lib/src/permissions/__tests__/rollback-permissions.test.ts
• packages/lib/src/permissions/index.ts
• packages/lib/src/permissions/rollback-permissions.ts

---

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