43 lines
2.3 KiB
Markdown
43 lines
2.3 KiB
Markdown
# Broker Accounts Page — Tasks
|
|
|
|
## Tasks Checklist
|
|
|
|
- [x] **Task 1: BrokerAllocationBar**
|
|
- [x] Replace `p.broker-allocation-bar__empty` with `<Text tone="muted">`
|
|
- [x] Replace `div.broker-allocation-bar` with `<Box>` container
|
|
- [x] Replace track and segment divs/spans with `<Box>` components with MUI `sx` styling
|
|
- [x] Replace legend and swatch elements with `<Box>` and `<Text>` components
|
|
- [x] Verify BrokerAllocationBar compile state
|
|
|
|
- [x] **Task 2: BrokerAccountCard**
|
|
- [x] Replace `<SkeletonBlock>` with `<Skeleton>` from `@moex-vibe/design-system`
|
|
- [x] Replace eyebrow with `<Text variant="label" tone="secondary">`
|
|
- [x] Replace title `h2` with `<Heading level={2}>`
|
|
- [x] Replace error alert block with `<Alert severity="error">` and a `<Button>`
|
|
- [x] Replace layout grids, stats, and card component with `<Box>` with `sx`
|
|
- [x] Set component on `<Box>` to `Link` from `react-router-dom` for card wrapper
|
|
- [x] Ensure stat elements use proper Text styles and spacing
|
|
|
|
- [x] **Task 3: BrokerAccountsSummary**
|
|
- [x] Replace skeleton placeholders with `<Skeleton>` from DS
|
|
- [x] Replace headers and subheaders with proper typography
|
|
- [x] Convert layout container to `<Box>` component with `sx` positioning
|
|
- [x] Replace metrics detail grid with Box layout using custom margins and spacing
|
|
- [x] Keep custom hero layout styles and replace text styling inside the hero with `<Box>` and custom variables to ensure colors map correctly
|
|
|
|
- [x] **Task 4: BrokerAccountsPage**
|
|
- [x] Replace layout containers and headers with `<Box>` with `sx` flex/grid
|
|
- [x] Replace main title with `<Heading level={1}>` and subtitle with `<Text>`
|
|
- [x] Replace empty state section with `<EmptyState>` component
|
|
- [x] Replace error styling with `<Text tone="negative">`
|
|
|
|
- [x] **Task 5: Clean up orphaned CSS**
|
|
- [x] Find and delete unused CSS selectors in `apps/frontend/src/styles.css`
|
|
- [x] Verify reduced motion and max-width 720px responsive rules are cleanly updated without leaving dead rules
|
|
- [x] Ensure we only leave rules for pages and components that have not yet been migrated
|
|
|
|
- [x] **Task 6: Verification**
|
|
- [x] Run `npm run test:frontend` and ensure all 111 tests pass
|
|
- [x] Run `npm run lint -w apps/frontend` to verify ESLint compatibility
|
|
- [x] Run `npm run build:frontend` to compile production assets and verify type safety
|