toScreen

toScreen turns session state into the one Screen your view should render.

const screen = toScreen(state, options?)

Reference

toScreen(state, options?)

import { screenEquals, toScreen } from '@partner-sdk/core/view-model';

session.select((s) => toScreen(s, { sectionId }), render, screenEquals);

Parameters

• state: a SessionState.
• options.sectionId (optional): the section the customer is on. Your view owns this. Without it, the first incomplete section is shown.
• options.locale (optional): for premiums. Default "en-US".

Returns

A Screen. Switch on kind:

kind	When	Fields
loading	Starting
error	start failed, or select failed with no URL	action
section	Questioning	see below
waiting	Quoting
quotes	Quoted	cards, selectable, comparisonUrl, selectFailed
failed	Quoting failed	reason: "quote_failed" | "timeout" | "error"
handoff	Selected, or handed off	url: redirect here

The section screen:

• section: { id, title, names, complete }. Render names.
• sections: every section, for a progress bar.
• previousId, nextId: neighbouring sections with questions.
• ready: quotes can be requested.
• missing: required names still outstanding, after a blocked requestQuotes().
• attention: { sectionId, name, reason }: where to send focus.
• syncing, syncFailed: from state.sync.

screenEquals(a, b)

Deep equality for screens. Pass it as session.select’s equals so you re-render only on visible changes.

Usage

Jump to the field that needs attention

if (screen.kind === 'section' && screen.attention) {
  sectionId = screen.attention.sectionId;
  document.getElementById(screen.attention.name)?.focus();
}

Show progress

const done = screen.sections.filter((s) => s.complete).length;
progress.value = done / screen.sections.length;