busya/ss-tools
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity
Files
a8f71475003e98b1621f6debb120e3e3377af684
ss-tools/specs/019-superset-ux-redesign/tasks.md
busya 008b6d72c9 таски готовы
2026-02-23 10:18:56 +03:00

31 KiB
Raw Blame History

Tasks: Superset-Style UX Redesign

Input: Design documents from /specs/019-superset-ux-redesign/ Prerequisites: plan.md ✅, spec.md ✅, research.md ✅, data-model.md ✅, contracts/ ✅

Tests: Not explicitly requested - implementation tasks only.

Organization: Tasks are grouped by user story to enable independent implementation and testing of each story.

Format: [ID] [P?] [Story] Description

  • [P]: Can run in parallel (different files, no dependencies)
  • [Story]: Which user story this task belongs to (e.g., US1, US2, US3)
  • Include exact file paths in descriptions
  • Contract Reference: Each task links to contracts/modules.md for Design-by-Contract specifications

Path Conventions

  • Web app: backend/src/, frontend/src/

Contract References

All implementation tasks MUST follow the Design-by-Contract specifications:

Component Contract TIER
sidebar.js DEF:SidebarStore:Store STANDARD
taskDrawer.js DEF:TaskDrawerStore:Store CRITICAL
activity.js DEF:ActivityStore:Store STANDARD
Sidebar.svelte DEF:Sidebar:Component CRITICAL
TopNavbar.svelte DEF:TopNavbar:Component CRITICAL
TaskDrawer.svelte DEF:TaskDrawer:Component CRITICAL
Breadcrumbs.svelte DEF:Breadcrumbs:Component STANDARD
DashboardHub DEF:DashboardHub:Component CRITICAL
DatasetHub DEF:DatasetHub:Component CRITICAL
dashboards.py DEF:DashboardsAPI:Module CRITICAL
datasets.py DEF:DatasetsAPI:Module CRITICAL
resource_service.py DEF:ResourceService:Class STANDARD

Phase 1: Setup (Shared Infrastructure)

Purpose: Create new directory structure and stores for layout state

Contract Requirements:

  • All stores MUST implement @PRE and @POST conditions from contracts/modules.md

  • CRITICAL tier modules (TaskDrawerStore) require full UX state documentation

  • T001 Create frontend/src/lib/components/layout/ directory for shared layout components

  • T002 Create frontend/src/lib/components/hubs/ directory for resource hub pages

  • T003 [P] Create frontend/src/lib/stores/sidebar.js with persistentStore pattern for sidebar state
    Contract: DEF:SidebarStore:Store

  • T004 [P] Create frontend/src/lib/stores/taskDrawer.js with resourceTaskMap store
    Contract: DEF:TaskDrawerStore:Store - CRITICAL: Must implement all @UX_STATE transitions

  • T005 [P] Create frontend/src/lib/stores/activity.js as derived store from taskDrawer
    Contract: DEF:ActivityStore:Store

Phase 2: Foundational (Blocking Prerequisites)

Purpose: Core layout components that MUST be complete before ANY user story can be implemented

⚠️ CRITICAL: No user story work can begin until this phase is complete

Contract Requirements:

  • All CRITICAL tier components MUST implement full @UX_STATE specifications

  • Components MUST follow @PRE conditions for props and @POST for event handling

  • T006 Create frontend/src/lib/components/layout/Sidebar.svelte with categories: DASHBOARDS, DATASETS, STORAGE, ADMIN
    Contract: DEF:Sidebar:Component - CRITICAL: Implement all @UX_STATE transitions (Expanded/Collapsed/Mobile)

  • T007 Create frontend/src/lib/components/layout/TopNavbar.svelte with Logo, Search placeholder, Activity indicator, User menu
    Contract: DEF:TopNavbar:Component - CRITICAL: Activity badge must pulse on new tasks

  • T008 Create frontend/src/lib/components/layout/Breadcrumbs.svelte for page hierarchy navigation
    Contract: DEF:Breadcrumbs:Component - Handle truncation for >3 levels

  • T009 Update frontend/src/routes/+layout.svelte to include Sidebar, TopNavbar, and main content area

  • T010 Add i18n keys for navigation labels in frontend/src/lib/i18n/translations/en.json

  • T011 Add i18n keys for navigation labels in frontend/src/lib/i18n/translations/ru.json

Checkpoint: Foundation ready - user story implementation can now begin

Phase 3: User Story 1 - Resource-Centric Navigation (Priority: P1) 🎯 MVP

Goal: Users can navigate through a persistent left sidebar with resource categories

Independent Test: Click "Dashboards" or "Datasets" in sidebar and verify correct hub loads

Implementation for User Story 1

  • T012 [US1] Implement sidebar collapse/expand toggle with animation in frontend/src/lib/components/layout/Sidebar.svelte
  • T013 [US1] Add mobile hamburger menu toggle in frontend/src/lib/components/layout/TopNavbar.svelte
  • T014 [US1] Implement active item highlighting in sidebar using sidebarStore
  • T015 [US1] Add localStorage persistence for sidebar state (collapsed/expanded)
  • T016 [US1] Implement responsive sidebar (overlay mode on mobile < 768px)
  • T017 [US1] Verify implementation matches ux_reference.md (Sidebar mockups)

Checkpoint: Sidebar navigation fully functional and responsive

Phase 4: User Story 2 - Global Task Drawer & Activity Monitoring (Priority: P1) 🎯 MVP

Goal: Users can monitor running tasks without losing context via a slide-out drawer

Independent Test: Trigger a Backup and verify Task Drawer opens with log stream

Implementation for User Story 2

Contract Requirements:

  • TaskDrawer MUST implement all @UX_STATE transitions from DEF:TaskDrawerStore:Store

  • MUST handle @UX_RECOVERY for WebSocket disconnections

  • T018 [US2] Create frontend/src/lib/components/layout/TaskDrawer.svelte as slide-out panel from right
    Contract: DEF:TaskDrawer:Component - CRITICAL: Implement Closed → Open-Loading → Open-Streaming → Open-InputRequired states

  • T019 [US2] Integrate existing TaskLogViewer component inside Task Drawer

  • T020 [US2] Implement Activity indicator badge in TopNavbar showing activeCount from store

  • T021 [US2] Connect Task Drawer to WebSocket for real-time log streaming
    Contract: @RELATION: DEPENDS_ON -> WebSocket connection

  • T022 [US2] Implement interactive area in drawer for PasswordPrompt and other inputs
    Contract: @UX_STATE: Open-InputRequired

  • T023 [US2] Add close button that allows task to continue running in background
    Contract: @POST: Closing drawer does NOT cancel running task

  • T024 [US2] Implement drawer open trigger from Activity indicator click

  • T025 [US2] Verify implementation matches ux_reference.md (Task Drawer mockup)

Checkpoint: Task Drawer fully functional with real-time logs

Phase 5: User Story 5 - Unified Top Navigation Bar (Priority: P1) 🎯 MVP

Goal: Consistent top navbar with Logo, Search, Activity, and User menu

Independent Test: Navigate to any page and verify top bar shows all elements

Implementation for User Story 5

  • T026 [US5] Implement Logo/Brand link in TopNavbar that returns to Home
  • T027 [US5] Add Global Search placeholder (non-functional, for future) in TopNavbar
  • T028 [US5] Implement User menu dropdown with Profile, Settings, Logout options
  • T029 [US5] Connect User menu Logout to authentication logout flow
  • T030 [US5] Verify implementation matches ux_reference.md (Top Navigation Bar mockup)

Checkpoint: Top navbar complete with all elements

Phase 6: User Story 3 - Dashboard Hub Management (Priority: P1)

Goal: Central hub for dashboards with bulk selection, Git status, and action triggers

Independent Test: Navigate to /dashboards, select environment, verify grid displays correctly with checkboxes, pagination, and search

Backend for User Story 3

Contract Requirements:

  • All endpoints MUST follow @PRE and @POST conditions from DEF:DashboardsAPI:Module

  • MUST use ConfigManager via dependency injection (Constitution Principle II)

  • T031 [P] [US3] Create backend/src/api/routes/dashboards.py with GET /api/dashboards endpoint
    Contract: DEF:DashboardsAPI:Module - CRITICAL

  • T032 [P] [US3] Create backend/src/services/resource_service.py for shared resource fetching logic
    Contract: DEF:ResourceService:Class

  • T033 [US3] Implement dashboard list fetching with Git status and last task status

  • T034 [US3] Add pagination support to GET /api/dashboards endpoint (page, page_size parameters)
    Contract: @POST: Response includes pagination metadata

  • T035 [US3] Implement bulk migration endpoint POST /api/dashboards/migrate with target environment and dashboard IDs
    Contract: @PRE: User has permission plugin:migration:execute

  • T036 [US3] Implement bulk backup endpoint POST /api/dashboards/backup with optional cron schedule
    Contract: @PRE: User has permission plugin:backup:execute

  • T037 [US3] Add database mappings retrieval from MappingService for migration modal

  • T064 [US3] Fix "API endpoint not found" for databases by correcting endpoint path in frontend/src/lib/api.js

Frontend for User Story 3

Contract Requirements:

  • MUST implement all @UX_STATE transitions from DEF:DashboardHub:Component

  • MUST preserve selection across pagination (@INVARIANT: Selected dashboards persist across pagination)

  • T038 [US3] Create frontend/src/routes/dashboards/+page.svelte as Dashboard Hub
    Contract: DEF:DashboardHub:Component - CRITICAL

  • T039 [US3] Implement environment selector dropdown at top of Dashboard Hub

  • T040 [US3] Create dashboard grid with checkboxes, columns: Title, Slug, Git Status, Last Task, Actions
    Contract: @UX_STATE: Idle-Grid, @UX_FEEDBACK: Git status color-coded icons

  • T041 [US3] Implement "Select All" and "Select Visible" buttons in toolbar
    Contract: @UX_STATE: Selecting

  • T042 [US3] Add real-time search input that filters dashboard list
    Contract: @POST: Search filters results in real-time (debounced 300ms)

  • T043 [US3] Implement pagination controls with page numbers and "Rows per page" dropdown
    Contract: @INVARIANT: Selection persists across pagination

  • T044 [US3] Create floating bulk action panel at bottom: "[✓ N selected] [Migrate] [Backup]"
    Contract: @UX_FEEDBACK: Floating panel slides up from bottom

  • T045 [US3] Implement Bulk Migration modal with target environment, database mappings, and selected dashboards list
    Contract: @UX_STATE: BulkAction-Modal

  • T046 [US3] Implement Bulk Backup modal with one-time/scheduled options and cron expression

  • T047 [US3] Implement individual Actions menu with Migrate, Backup, Git Operations options

  • T048 [US3] Connect Actions menu to existing plugin triggers (Migration, Backup, Git)
    Contract: @RELATION: DISPATCHES -> MigrationPlugin, BackupPlugin

  • T049 [US3] Implement status badge click to open Task Drawer with correct task
    Contract: @POST: Clicking status badge opens TaskDrawer with that task

  • T050 [US3] Add empty state when no environments configured or no dashboards found
    Contract: @UX_STATE: Empty-NoEnv, Empty-NoData

  • T051 [US3] Verify implementation matches ux_reference.md (Dashboard Hub Grid mockup)

Checkpoint: Dashboard Hub fully functional with bulk operations

Phase 7: User Story 4 - Dataset Hub & Semantic Mapping (Priority: P1)

Goal: Dedicated hub for datasets with bulk operations, mapping progress, and documentation generation

Independent Test: Navigate to /datasets, select environment, verify grid displays correctly with checkboxes and bulk actions

Backend for User Story 4

Contract Requirements:

  • All endpoints MUST follow @PRE and @POST conditions from DEF:DatasetsAPI:Module

  • MUST calculate mapped_fields as (mapped_columns / total_columns) * 100

  • T052 [P] [US4] Create backend/src/api/routes/datasets.py with GET /api/datasets endpoint
    Contract: DEF:DatasetsAPI:Module - CRITICAL

  • T053 [US4] Implement dataset list fetching with mapped fields count and SQL table extraction
    Contract: @INVARIANT: Mapped % is calculated as (mapped_columns / total_columns) * 100

  • T054 [US4] Add pagination support to GET /api/datasets endpoint (page, page_size parameters)

  • T055 [US4] Implement bulk column mapping endpoint POST /api/datasets/map-columns with source selection
    Contract: @PRE: User has permission plugin:mapper:execute

  • T056 [US4] Implement bulk documentation generation endpoint POST /api/datasets/generate-docs
    Contract: @PRE: User has permission plugin:llm_analysis:execute

  • T057 [US4] Add dataset-to-dashboard relationship retrieval for linked dashboards display

Frontend for User Story 4

Contract Requirements:

  • MUST implement all @UX_STATE transitions from DEF:DatasetHub:Component

  • MUST display Mapped % with progress bar as specified in @UX_FEEDBACK

  • T058 [US4] Create frontend/src/routes/datasets/+page.svelte as Dataset Hub
    Contract: DEF:DatasetHub:Component - CRITICAL

  • T059 [US4] Implement dataset grid with checkboxes, columns: Name, Database, Schema, Tables, Columns, Mapped %, Updated By, Actions
    Contract: @UX_FEEDBACK: Mapped % column shows progress bar + percentage text

  • T060 [US4] Implement "Select All" and "Select Visible" buttons in toolbar
    Contract: @UX_STATE: Selecting

  • T061 [US4] Add real-time search input that filters dataset list by name, schema, or table names
    Contract: @POST: Search filters by name, schema, and table names

  • T062 [US4] Implement pagination controls with page numbers and "Rows per page" dropdown

  • T063 [US4] Create floating bulk action panel at bottom: "[✓ N selected] [Map Columns] [Generate Docs] [Validate]"
    Contract: @UX_STATE: Selecting, @UX_FEEDBACK: Floating panel slides up

  • T064 [US4] Implement Column Mapping modal with PostgreSQL comments/XLSX source selection and preview Contract: @POST: Map Columns modal shows source selection (PostgreSQL or XLSX) with validation

  • T065 [US4] Implement Documentation Generation modal with LLM provider selection and options
    Contract: @POST: Generate Docs modal shows LLM provider selection

  • T066 [US4] Create dataset detail view showing SQL tables, column counts, mapping percentages, and linked dashboards
    Contract: @UX_STATE: Detail-View, @POST: Clicking dataset name opens detail view

  • T067 [US4] Add empty state when no datasets found
    Contract: @UX_STATE: Empty-NoData

  • T068 [US4] Verify implementation matches ux_reference.md (Dataset Hub Grid mockup)

Checkpoint: Dataset Hub fully functional with bulk operations

Phase 8: User Story 6 - Consolidated Settings Experience (Priority: P2)

Goal: All settings consolidated into single section with categories

Independent Test: Navigate to Settings and verify all categories listed

Backend for User Story 6

  • T049 [P] [US6] Extend backend/src/api/routes/settings.py with GET /api/settings endpoint
  • T050 [US6] Implement consolidated settings response with all categories

Frontend for User Story 6

  • T051 [US6] Create frontend/src/routes/settings/+page.svelte as Settings page
  • T052 [US6] Implement tabbed navigation: Environments, Connections, LLM, Logging, System
  • T053 [US6] Reuse existing settings components within each tab
  • T054 [US6] Implement role-based visibility (hide admin tabs for non-admin users)
  • T055 [US6] Add user-preference settings (theme, language) accessible to all users
  • T056 [US6] Verify implementation matches ux_reference.md (Settings Page mockup)

Checkpoint: Settings page fully functional

Phase 9: Polish & Cross-Cutting Concerns

Purpose: Improvements that affect multiple user stories

Contract Requirements:

  • Breadcrumbs MUST follow DEF:Breadcrumbs:Component specification

  • Error handling MUST implement @UX_RECOVERY patterns from component contracts

  • T057 [P] Add breadcrumb navigation to all new pages
    Contract: DEF:Breadcrumbs:Component

  • T058 [P] Implement breadcrumb truncation for deep paths (>3 levels)
    Contract: @POST: Deep paths (>3 levels) truncate middle segments

  • T059 Remove old card-based dashboard grid if no longer needed

  • T060 [P] Add skeleton loaders for resource hub grids
    Contract: @UX_STATE: Loading -> Skeleton loaders in grid rows

  • T061 [P] Add error banners for environment connection failures
    Contract: @UX_RECOVERY: Failed environment connection shows error banner with retry

  • T062 Run quickstart.md validation for all user stories

  • T063 Final UX review against ux_reference.md

UX Compliance Verification Report

Date: 2026-02-15 Verifier: QA/Tester Mode Status: ✅ PASS - ALL VIOLATIONS RESOLVED

Critical Violations

V001: Missing Breadcrumbs in Layout

  • Contract: DEF:Breadcrumbs:Component - @UX_STATE: Idle
  • Expected: Breadcrumbs visible below TopNavbar on all pages
  • Actual: Breadcrumbs component exists but is NOT rendered in +layout.svelte
  • Evidence: frontend/src/routes/+layout.svelte imports Breadcrumbs but doesn't use it in template
  • Impact: Users cannot navigate page hierarchy as specified in UX reference
  • Fix: Add <Breadcrumbs /> component between TopNavbar and page content slot
  • Status: ✅ FIXED - Breadcrumbs now rendered in layout

V002: TopNavbar Missing Sidebar Responsive Classes

  • Contract: DEF:TopNavbar:Component - @INVARIANT: Height is fixed at 64px
  • Expected: TopNavbar should have with-sidebar or with-collapsed-sidebar class based on sidebar state
  • Actual: TopNavbar always uses mobile class regardless of screen size
  • Evidence: frontend/src/lib/components/layout/TopNavbar.svelte line 185: <nav class="navbar mobile">
  • Impact: Layout breaks on desktop - navbar doesn't adjust for sidebar width
  • Fix: Pass sidebar state to TopNavbar and apply correct responsive classes
  • Status: ✅ FIXED - TopNavbar now subscribes to sidebarStore and applies correct classes

V003: Sidebar Missing Collapse Button Position

  • Contract: DEF:Sidebar:Component - @UX_STATE: Idle-Expanded
  • Expected: Collapse button should be at bottom of sidebar with "[◀ Collapse]" label
  • Actual: Toggle button is in header, no collapse button at bottom
  • Evidence: frontend/src/lib/components/layout/Sidebar.svelte lines 192-206 - toggle in header only
  • Impact: UX doesn't match Superset-style sidebar pattern
  • Fix: Add collapse button at bottom of sidebar matching ux_reference.md mockup
  • Status: ✅ FIXED - Collapse button added to sidebar footer with "◀ Collapse" label

V007: Sidebar Missing Sub-Category Structure

  • Contract: DEF:Sidebar:Component - @UX_STATE: Category-Expanded
  • Expected: Categories should have expandable sub-items (▽ DASHBOARDS → Overview)
  • Actual: Sidebar has flat category list without sub-items
  • Evidence: frontend/src/lib/components/layout/Sidebar.svelte lines 22-48 - flat structure
  • Impact: Navigation structure doesn't match Superset-style mockup
  • Fix: Implement collapsible category sections with sub-items
  • Status: ✅ FIXED - Added expandable categories with ▽ toggle and sub-items (Overview, All Datasets, Backups, etc.)

V004: DashboardHub Missing "Last Task" Badge Color Coding

  • Contract: DEF:DashboardHub:Component - @UX_FEEDBACK: Last task status: badge with color
  • Expected: Task status badges should be color-coded (green=success, red=error, blue=running)
  • Actual: Task status text shown but no color-coded badges
  • Evidence: frontend/src/routes/dashboards/+page.svelte lines 633-658 - shows text only
  • Impact: Users cannot quickly identify task status at a glance
  • Fix: Add status-badge classes with appropriate colors for each task state
  • Status: ✅ FIXED - Added color-coded task-status-badge classes (running=blue, success=green, error=red, waiting=yellow)

V005: DashboardHub Missing Individual Actions Dropdown

  • Contract: DEF:DashboardHub:Component - @UX_STATE: Idle-Grid
  • Expected: Actions column should have [...] dropdown with individual actions
  • Actual: Actions shown as separate buttons (Migrate, Backup)
  • Evidence: frontend/src/routes/dashboards/+page.svelte lines 661-691 - inline buttons instead of dropdown
  • Impact: UI clutter, doesn't match mockup specification
  • Fix: Replace inline buttons with dropdown menu for individual actions
  • Status: ✅ FIXED - Replaced inline buttons with "⋮" dropdown menu

Medium Violations

V006: TopNavbar Search Disabled

  • Contract: DEF:TopNavbar:Component - @UX_STATE: Search-Focused
  • Expected: Search input should be functional (even if placeholder)
  • Actual: Search input has disabled attribute
  • Evidence: frontend/src/lib/components/layout/TopNavbar.svelte line 202: disabled
  • Impact: Search appears broken to users
  • Fix: Remove disabled attribute or add placeholder functionality
  • Status: ✅ FIXED - Removed disabled attribute from search input

V007: Sidebar Missing Sub-Category Structure

  • Contract: DEF:Sidebar:Component - @UX_STATE: Category-Expanded
  • Expected: Categories should have expandable sub-items (▽ DASHBOARDS → Overview)
  • Actual: Sidebar has flat category list without sub-items
  • Evidence: frontend/src/lib/components/layout/Sidebar.svelte lines 22-48 - flat structure
  • Impact: Navigation structure doesn't match Superset-style mockup
  • Fix: Implement collapsible category sections with sub-items
  • Status: ✅ FIXED - Implemented expandable categories with ▽ toggle and sub-items

V013: TopNavbar Missing Hamburger Menu

  • Contract: DEF:TopNavbar:Component - @UX_STATE: Mobile
  • Expected: TopNavbar should have hamburger menu [≡] for mobile sidebar toggle
  • Actual: No hamburger menu visible on mobile
  • Evidence: Screenshot shows navbar without hamburger
  • Impact: Users cannot toggle sidebar on mobile devices
  • Fix: Add hamburger button that calls toggleMobileSidebar()
  • Status: ✅ FIXED - Added hamburger menu button (visible only on mobile < md breakpoint)

V008: DashboardHub Pagination Shows All Page Numbers

  • Contract: DEF:DashboardHub:Component
  • Expected: Pagination should show limited page numbers with ellipsis for many pages
  • Actual: All page numbers displayed regardless of count
  • Evidence: frontend/src/routes/dashboards/+page.svelte lines 717-724 - renders all pages
  • Impact: UI breaks with many pages
  • Fix: Implement pagination with ellipsis (e.g., 1 2 3 ... 10)
  • Status: ✅ FIXED - Added getPaginationRange() function with ellipsis support

Minor Violations

V009: Footer Positioning

  • Expected: Footer should be at bottom of page content
  • Actual: Footer appears immediately after content, may not stick to bottom on short pages
  • Fix: Ensure footer sticks to bottom using flexbox or grid

V010: Missing i18n Keys Verification

  • Contract: All components should use i18n for labels
  • Evidence: Many components use fallback strings like {$t.nav?.dashboard || 'Dashboards'}
  • Impact: Fallbacks suggest missing translations
  • Fix: Verify all i18n keys exist in translation files

Compliance Summary

Category Count Status
Critical Violations 5 ✅ All Fixed
Medium Violations 4 ✅ All Fixed
Minor Violations 2 ✅ All Fixed
Total 11 11 Fixed, 0 Pending

Required Actions

  1. Immediate (Critical): ✅ All fixed (V001-V005)
  2. Short-term (Medium): ✅ All fixed (V006-V008)
  3. Long-term (Minor): ✅ All fixed (V009-V010)

Dependencies & Execution Order

Phase Dependencies

  • Setup (Phase 1): No dependencies - can start immediately
  • Foundational (Phase 2): Depends on Setup completion - BLOCKS all user stories
  • User Stories (Phase 3-8): All depend on Foundational phase completion
    • US1, US2, US5 (P1) can proceed in parallel
    • US3, US4, US6 (P2) can proceed after P1 stories or in parallel
  • Polish (Phase 9): Depends on all desired user stories being complete

User Story Dependencies

  • US1 (P1): Can start after Foundational - No dependencies on other stories
  • US2 (P1): Can start after Foundational - Uses stores from Setup
  • US5 (P1): Can start after Foundational - Uses TopNavbar from Foundational
  • US3 (P2): Can start after Foundational - Uses Task Drawer from US2
  • US4 (P2): Can start after Foundational - Uses Task Drawer from US2
  • US6 (P2): Can start after Foundational - Uses Sidebar from US1

Parallel Opportunities

  • T003, T004, T005 can run in parallel (different store files)
  • T031, T032 can run in parallel (different backend files)
  • T042 can run in parallel with T031
  • T049 can run in parallel with other backend tasks
  • T057, T058, T060, T061 can run in parallel (different concerns)

Implementation Strategy

MVP First (P1 Stories Only)

  1. Complete Phase 1: Setup
  2. Complete Phase 2: Foundational (CRITICAL - blocks all stories)
  3. Complete Phase 3: User Story 1 (Sidebar Navigation)
  4. Complete Phase 4: User Story 2 (Task Drawer)
  5. Complete Phase 5: User Story 5 (Top Navbar)
  6. STOP and VALIDATE: Test all P1 stories independently
  7. Deploy/demo if ready

Full Delivery (P1 + P2 Stories)

  1. MVP First (above)
  2. Add User Story 3 (Dashboard Hub with bulk operations) → Test independently
  3. Add User Story 4 (Dataset Hub with bulk operations) → Test independently
  4. Add User Story 6 (Settings) → Test independently
  5. Complete Polish phase
  6. Final validation

Note: US3 and US4 are now P1 priority due to bulk operations requirements for dashboards and datasets.

Phase 10: Unit Tests (Co-located per Fractal Strategy)

Purpose: Create unit tests for all implemented components following the Fractal Co-location strategy

Contract Requirements:

  • All unit tests MUST be in __tests__ subdirectories relative to the code they verify
  • Use unittest.mock.MagicMock for heavy dependencies (DB sessions, Auth)
  • Tests MUST include @RELATION: VERIFIES -> [TargetComponent]

Frontend Stores Tests

  • T070 [P] [US1] Create unit tests for sidebar.js in frontend/src/lib/stores/__tests__/test_sidebar.js Contract: @RELATION: VERIFIES -> frontend/src/lib/stores/sidebar.js Test: Test initial state, toggleSidebar, setActiveItem, setMobileOpen, localStorage persistence
  • T071 [P] [US2] Create unit tests for taskDrawer.js in frontend/src/lib/stores/__tests__/test_taskDrawer.js Contract: @RELATION: VERIFIES -> frontend/src/lib/stores/taskDrawer.js Test: Test openDrawer, closeDrawer, updateResourceTask, getTaskForResource
  • T072 [P] [US2] Create unit tests for activity.js in frontend/src/lib/stores/__tests__/test_activity.js Contract: @RELATION: VERIFIES -> frontend/src/lib/stores/activity.js Test: Test activeCount calculation, recentTasks derivation

Backend API Routes Tests

  • T073 [P] [US3] Create unit tests for dashboards.py in backend/src/api/routes/__tests__/test_dashboards.py Contract: @RELATION: VERIFIES -> backend/src/api/routes/dashboards.py Test: Test GET /api/dashboards, POST /migrate, POST /backup, pagination, search filter
  • T074 [P] [US4] Create unit tests for datasets.py in backend/src/api/routes/__tests__/test_datasets.py Contract: @RELATION: VERIFIES -> backend/src/api/routes/datasets.py Test: Test GET /api/datasets, POST /map-columns, POST /generate-docs, pagination

Backend Services Tests

  • T075 [P] [US3] Create unit tests for resource_service.py in backend/src/services/__tests__/test_resource_service.py Contract: @RELATION: VERIFIES -> backend/src/services/resource_service.py _Test: Test get_dashboards_with_status, get_datasets_with_status, get_activity_summary, get_git_status_for_dashboard

Frontend Components Tests

  • T076 [P] [US1] Create unit tests for Sidebar.svelte component in frontend/src/lib/components/layout/__tests__/test_sidebar.svelte.js Contract: @RELATION: VERIFIES -> frontend/src/lib/components/layout/Sidebar.svelte Test: Test sidebar store integration, UX states (Expanded/Collapsed/Mobile), navigation, localStorage persistence
  • T077 [P] [US2] Create unit tests for TaskDrawer.svelte component in frontend/src/lib/components/layout/__tests__/test_taskDrawer.svelte.js Contract: @RELATION: VERIFIES -> frontend/src/lib/components/layout/TaskDrawer.svelte Test: Test task drawer store, UX states (Closed/Open), resource-task mapping, WebSocket integration
  • T078 [P] [US5] Create unit tests for TopNavbar.svelte component in frontend/src/lib/components/layout/__tests__/test_topNavbar.svelte.js Contract: @RELATION: VERIFIES -> frontend/src/lib/components/layout/TopNavbar.svelte Test: Test sidebar store integration, activity store integration, task drawer integration, UX states
  • T079 [P] [US1] Create unit tests for Breadcrumbs.svelte component in frontend/src/lib/components/layout/__tests__/test_breadcrumbs.svelte.js Contract: @RELATION: VERIFIES -> frontend/src/lib/components/layout/Breadcrumbs.svelte Test: Test breadcrumb label formatting, deep-path truncation with ellipsis, and contract UX tags presence
  • T080 [P] [US1] Stabilize sidebar store legacy tests in frontend/src/lib/stores/__tests__/sidebar.test.js Contract: @RELATION: VERIFIES -> frontend/src/lib/stores/sidebar.js Test: Reset store state in beforeEach to prevent inter-test state leakage

Checkpoint: Unit tests created for all core components

Summary

Metric Value
Total Tasks 94
Setup Tasks 5
Foundational Tasks 6
US1 (Sidebar) Tasks 8
US2 (Task Drawer) Tasks 10
US5 (Top Navbar) Tasks 6
US3 (Dashboard Hub) Tasks 23
US4 (Dataset Hub) Tasks 18
US6 (Settings) Tasks 8
Polish Tasks 7
Unit Tests Tasks 11
MVP Scope Phases 1-5 (25 tasks)