78 lines
4.3 KiB
Markdown
78 lines
4.3 KiB
Markdown
## ADDED Requirements
|
|
|
|
### Requirement: Two-column dashboard layout
|
|
|
|
The profile section SHALL be presented as a two-column layout: a left menu column occupying approximately 25% of the available width and a right content column occupying approximately 75%. On viewports narrower than 1024px the two columns SHALL collapse into a single stacked column.
|
|
|
|
#### Scenario: Wide viewport shows two columns
|
|
- **WHEN** an authenticated user opens the profile section on a viewport ≥ 1024px wide
|
|
- **THEN** the left menu column (~25%) and the right content column (~75%) are displayed side by side
|
|
|
|
#### Scenario: Narrow viewport stacks columns
|
|
- **WHEN** an authenticated user opens the profile section on a viewport < 1024px wide
|
|
- **THEN** the menu and the content are stacked vertically in a single column
|
|
|
|
### Requirement: Pinned profile summary
|
|
|
|
The left menu column SHALL display the profile summary (`ProfileSummary` — avatar and identity) pinned at the top, above the list of menu items, and it SHALL remain visible regardless of which menu item is active.
|
|
|
|
#### Scenario: Summary visible on every item
|
|
- **WHEN** the user switches between any menu items
|
|
- **THEN** the profile summary remains displayed at the top of the left column
|
|
|
|
### Requirement: Menu items for profile sections and transactions
|
|
|
|
The left menu SHALL list selectable items for: Данные профиля (`ProfileDetails`), Безопасность (`SecuritySection`), Мнемоническая фраза (`MnemonicSection`), and Транзакции (transactions content). Selecting an item SHALL render its content in the right column, and the currently active item SHALL be visually highlighted.
|
|
|
|
#### Scenario: Selecting a menu item shows its content
|
|
- **WHEN** the user clicks a menu item
|
|
- **THEN** the right column renders that item's content and the clicked item is marked as active
|
|
|
|
#### Scenario: Transactions appears as a menu item
|
|
- **WHEN** the user views the profile menu
|
|
- **THEN** a «Транзакции» item is present alongside the profile section items, and selecting it renders the transactions content (list plus the «Транзакции / Заявки» tabs for legal-entity accounts)
|
|
|
|
### Requirement: Per-item routing with default redirect
|
|
|
|
Each menu item SHALL have its own URL under `/profile` (`/profile/details`, `/profile/security`, `/profile/mnemonic`, `/profile/transactions`) so that the browser Back button and direct links select the corresponding item. Navigating to `/profile` SHALL redirect to the default item `/profile/details`.
|
|
|
|
#### Scenario: Direct link opens the matching item
|
|
- **WHEN** the user navigates directly to `/profile/transactions`
|
|
- **THEN** the transactions item is active and its content is shown in the right column
|
|
|
|
#### Scenario: Bare profile path redirects to default
|
|
- **WHEN** the user navigates to `/profile`
|
|
- **THEN** the app redirects to `/profile/details` and shows the profile data item
|
|
|
|
#### Scenario: Back button restores previous item
|
|
- **WHEN** the user selects one item and then another, and then presses the browser Back button
|
|
- **THEN** the previously active item is restored
|
|
|
|
### Requirement: Legacy transactions route redirect
|
|
|
|
The legacy route `/transactions` SHALL redirect to `/profile/transactions` so existing links and bookmarks continue to work.
|
|
|
|
#### Scenario: Old transactions URL redirects
|
|
- **WHEN** the user navigates to `/transactions`
|
|
- **THEN** the app redirects to `/profile/transactions`
|
|
|
|
### Requirement: KYC banner placement
|
|
|
|
The KYC banner (`KycBanner`) SHALL be displayed above the content in the right column.
|
|
|
|
#### Scenario: KYC banner shown above content
|
|
- **WHEN** the profile section is displayed and the KYC banner is applicable
|
|
- **THEN** the banner appears above the active item's content in the right column
|
|
|
|
### Requirement: Loading state for content
|
|
|
|
While the data for the active menu item is loading, the right column SHALL show a loading indicator (the shared `Spinner`) while the left menu remains interactive.
|
|
|
|
#### Scenario: Spinner while data loads
|
|
- **WHEN** the active item's data is still loading
|
|
- **THEN** a loading indicator is shown in the right column and the user can still click other menu items
|
|
|
|
#### Scenario: Content replaces spinner when ready
|
|
- **WHEN** the active item's data finishes loading
|
|
- **THEN** the loading indicator is replaced by the item's content
|