quick-view: Pages register readout data with a service that the app-shell quick view renders

Aperta
#937 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Questa issue non è ancora stata valutata.

Descrizione

by: ai frontend spike
Exploring

The page registers only readout data with a quick-view service: plain values, on/off states, values built from several topics, and status. One quick view in the app shell renders it with generic readout components, which start from the existing primitives and may end up as something new. The quick view:

  • renders next to page content on desktop and at phone width, without covering it
  • appears only on pages that register readouts, and elsewhere renders nothing and takes no space
  • shows only what the current page registered, with nothing carried over after you leave a page
  • can be opened and collapsed
flowchart LR
  scylla["scylla-server"]

  subgraph browser["Browser: angular-client"]
    direction LR
    socket["SocketService"] --> storage[("Storage")]
    storage --> page["Page that opts in"]
    page -- "register readout data" --> svc["Quick-view service"]
    svc --> shell["App shell quick view<br/>generic readout components"]
    otherPages["Every other page"] --> off["Quick view off"]
  end

  scylla -- "socket" --> socket
Hypothesis

A small set of generic readout components can show every readout Charging, BMS and eFuses need, with the page supplying only data through the service.

Context transfer
SUMMARY
Part of idea #933. One of three sibling spikes, each trying one way for pages to fill a single app-shell quick view: a CDK portal (#935), a service that renders registered components (#934), and a service that renders registered readout data (#937). Earlier spikes #898 (app-wide) and #899 (per page) are closed.

CONTEXT
- Branch 898-app-wide-quick-view (draft PR #900) is already close to this approach: QuickViewService.register(readouts, destroyRef) with a readout shaped { label, value: Signal, unit?, decimals?, icon?, detail?: Signal, status?: Signal<{color,label}> }, rendered by one chip component. QuickViewComponent renders StatusBarComponent once above router-outlet and nothing when empty. Nothing ties a claim to the current route.
- That branch chose readouts for Charging (8), BMS (7) and eFuses (LV battery). Multi-topic readouts (cell spread, located cells, fault roll-ups) are signals built in factories in quick-view.readouts.ts that must run in the page's injection context.
- #898 findings: the open panel covers Charging's Faults tile and BMS's segment overview; at 390px it takes about 55% of the width; collapse state carries across pages. https://github.com/Northeastern-Electric-Racing/Argos/issues/898#issuecomment-6260017218
- Value-display primitives on develop (angular-client/src/components/): stat-display (value, unit, subtitle, precision, header label and icon, connection dot), info-value-display (value or boolValue, precision, subtitle, unit, style inputs), gauge-stat (value, unit, color, precision), stat-summary (configs of StatConfig: label, unit, value, formatFn), sidebar-chip (icon, value, active), battery-level-indicator (percentage). StatConfig is a similar data shape.
- develop: StatusBarComponent (angular-client/src/components/status-bar/) is a reusable pop-out panel: docked top-right, sticky while scrolling, auto-opens, with a handle to reopen it after collapse; title input defaults to "Quick view".
- develop: app-context.component.html renders p-toast, app-nav-bar and router-outlet; no quick view in the app shell.
- Storage is filled by SocketService from scylla-server and uses plain subjects, so a value shows a dash until its topic publishes again.
- Unpublished topics: BMS/Pack/Voltage, BMS/Pack/SoC, BMS/Status/Balancing; BMS critical faults point mostly at unpublished topics (#902).
Lingua principale
TypeScript
Stelle
5
Fork
1
Merge medio
1g 20h
PR unite (30g)
38

Preparare l'ambiente

  • Nessun Dockerfile né file Docker Compose
  • Ha un modello di pull request
  • Nessuna guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di Northeastern-Electric-Racing/Argos

Tutte le issue di Northeastern-Electric-Racing/Argos

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.