# Workspace Visual Overhaul - Tasks

## Phase 1: Workspace Header

- [x] **Task 1.1**: Create WorkspaceHeader component
- [x] **Task 1.2**: Integrate WorkspaceHeader into RepoWorkspace

## Phase 2: Project Settings Page

- [x] **Task 2.1**: Create SettingsTabLayout component
- [x] **Task 2.2**: Create ProjectSettingsPage
- [x] **Task 2.3**: Add API endpoint for project updates (already existed)

## Phase 3: Move Repository Management

- [x] **Task 3.1**: Create RepositoriesSettingsTab
- [x] **Task 3.2**: Update routes
- [x] **Task 3.3**: Update navigation

## Phase 4: Sidebar Cleanup

- [x] **Task 4.1**: Simplify sidebar
  - Remove management links from sidebar
  - Keep only: Branch selector, File tree
  - Adjust sidebar width if needed
  - Update sidebar styles

- [x] **Task 4.2**: Update workspace layout
  - Ensure clean separation between header, sidebar, and main content
  - Fix any layout issues from header changes
  - Ensure consistent spacing

## Phase 5: Members Placeholder

- [x] **Task 5.1**: Create Members tab placeholder
  - Create `components/members-settings-tab.tsx`
  - "Coming soon" message
  - Brief feature description
  - Add to settings tabs

## Phase 6: Polish & Integration

- [x] **Task 6.1**: Add breadcrumbs
  - Add breadcrumb navigation to settings page
  - Format: Projects > My Project > Settings > General
  - Make segments clickable

- [x] **Task 6.2**: Add mobile responsiveness
  - Settings tabs become horizontal on mobile
  - Header actions collapse to icons only
  - Sidebar becomes toggleable overlay

- [x] **Task 6.3**: Add transitions
  - Tab switching animations
  - Page transition animations
  - Button hover effects

- [x] **Task 6.4**: Test navigation flow
  - Workspace → Settings → back
  - Settings tabs switching
  - Save changes flow
  - Delete project flow

## Phase 7: Quality Gates

- [x] **Task 7.1**: Run backend checks
  - ruff check
  - mypy
  - pytest

- [x] **Task 7.2**: Run frontend checks
  - TypeScript typecheck
  - ESLint
  - Build

- [x] **Task 7.3**: Manual testing
  - Test all navigation flows
  - Test responsive breakpoints
  - Test form validation
  - Verify no broken links