fix: improve cte review presentation
This commit is contained in:
@@ -169,30 +169,30 @@ Expected: PASS.
|
||||
- `SqlViewer({ blocks })` shows the layout toggle only when `blocks.length > 1`.
|
||||
- CTE plan data shape remains unchanged.
|
||||
|
||||
- [ ] **Step 1: Write failing semantic/layout tests**
|
||||
- [x] **Step 1: Write failing semantic/layout tests**
|
||||
|
||||
Assert long filter data is rendered in distinct elements labeled Column, Operator, and Value;
|
||||
assert card sections expose stable headings. Assert a one-block SQL viewer has no Horizontal or
|
||||
Vertical controls while a two-block viewer retains both.
|
||||
|
||||
- [ ] **Step 2: Run tests and verify RED**
|
||||
- [x] **Step 2: Run tests and verify RED**
|
||||
|
||||
Run: `cd frontend && npx vitest run src/viewers/CtePlanViewer.test.tsx src/viewers/SqlViewer.test.tsx src/viewers/CteResultViewer.test.tsx`
|
||||
|
||||
Expected: structured filter labels are absent and the one-block toggle is present.
|
||||
|
||||
- [ ] **Step 3: Implement responsive CTE cards**
|
||||
- [x] **Step 3: Implement responsive CTE cards**
|
||||
|
||||
Use a bordered header grid, prose blocks with `leading-relaxed`, metadata rows with fixed labels,
|
||||
`break-words`/`font-mono` for physical identifiers, and a responsive filter grid such as
|
||||
`grid-cols-1 sm:grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)]`. Keep output columns wrapping.
|
||||
|
||||
- [ ] **Step 4: Hide the single-block toggle**
|
||||
- [x] **Step 4: Hide the single-block toggle**
|
||||
|
||||
Wrap the layout control in `{blocks.length > 1 && (...)}` without changing multi-block state or
|
||||
rendering.
|
||||
|
||||
- [ ] **Step 5: Run targeted tests and typecheck**
|
||||
- [x] **Step 5: Run targeted tests and typecheck**
|
||||
|
||||
Run: `cd frontend && npx vitest run src/viewers/CtePlanViewer.test.tsx src/viewers/SqlViewer.test.tsx src/viewers/CteResultViewer.test.tsx && npx tsc -b`
|
||||
|
||||
|
||||
Reference in New Issue
Block a user