wu-sheng opened a new pull request, #78:
URL: https://github.com/apache/skywalking-horizon-ui/pull/78

   ## Why
   
   Operators sometimes want several related views — traffic / latency / Apdex, 
or success-rate / error-count — together, but spending one grid slot each is 
wasteful on a dense board.
   
   ## What
   
   A new **`tab`** layer-dashboard widget: one grid slot that holds several 
full widgets (card / line / top / table) shown as switchable tabs.
   
   - **Model** — `'tab'` added to `DashboardWidgetType`; `tabs?: 
DashboardWidget[]` on `DashboardWidget` (the container carries empty 
`expressions`).
   - **Render** — new `TabWidget.vue` renders the tab strip + the active child 
through the shared chart components. `LayerDashboardsView` flattens each tab 
down to its **active child** in the metrics request, so the BFF stays 
tab-unaware (a tab child returns the same per-widget result as any leaf — **no 
wire change**). Only the active tab is queried; switching loads its child on 
demand and vue-query keeps prior tabs warm.
   - **Editor** — the widget drawer gains a `tab` type and a **Tabs** chip 
strip. Selecting a chip re-points the *same* form to edit that child (one 
`editingWidget` indirection — no form duplication); the **⚙ Container** chip 
edits the slot (title / span). A tab can't nest a tab. The canvas previews the 
tab strip.
   
   No bundled template ships a tab widget — it's an operator-authored 
capability.
   
   ## Validation
   
   Headless against the demo OAP:
   - **Editor flow**: add widget → set type `tab` → chip strip + ⚙ Container + 
1 seeded tab → canvas shows the tab preview → `+ tab` adds a 2nd → clicking a 
child re-points the form (expressions appear) → child type select excludes 
`tab` → back to Container hides expressions. **No console errors.**
   - **No regression**: `/layer/GENERAL/service` still renders all 11 widgets 
(the flatten is identity for non-tab widgets).
   
   type-check · UI build · BFF build · lint · license · 243 unit tests — all 
green. The admin editor uses hardcoded English by its existing convention, so 
no new i18n keys.
   
   ## Note
   
   The runtime render of a tab *with live data* wasn't exercised end-to-end 
because that needs a tab pushed into an OAP template overlay, which I 
deliberately did not do to the public demo. It's low-risk: `TabWidget` reuses 
the already-validated chart components with the same per-widget result shape as 
the single-entity branches it mirrors, and the no-regression check confirms the 
wiring.


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]

Reply via email to