QuotesReadyTodo

A TodoList item for the quotes the buyer can order now, with the soonest deadline among them. Renders nothing when none is ready.

import { QuotesReadyTodo } from "@evolve-storefront/feature-quote/quotes-ready-todo";

Renders inside QuoteProvider.

Preview

ReadyOpen in Storybook ↗

Usage

Ordered and expired quotes are not counted; the soonest deadline is the one shown.

const { data } = useQuotes();

<TodoList>
  <QuotesReadyTodo
    quotes={data?.items ?? []}
    renderLink={(children) => <Link href="/account/quotes">{children}</Link>}
  />
</TodoList>;

Props

Prop	Type	Description
quotes	Quote[]	A page of useQuotes(); the ones the buyer can order now are counted.
renderLink	(children: ReactNode) => ReactNode	Link the action to the quotes; routing is the app's.
isDone?	boolean	Already dealt with, as a step of a checklist; styled through data-done, with a success mark before the title. The mark is decorative, so say it in detail.
count?	number | null	Every quote ready to order, such as the PENDING page's totalCount. Defaults to the ones counted in quotes.
now?	Date	"Now" for the validity check; defaults to the current time.

Any other props go to the root element, like on a plain HTML element.

Examples

None ReadyNothing to order: the item is not there.

<QuotesReadyTodo quotes={quotes} renderLink={renderLink} />;

Open in Storybook ↗

Exact CountMore ready quotes than the page holds: count takes the exact number from the PENDING page's totalCount, and the page still gives the soonest deadline.

const { data } = useQuotes({ status: "PENDING" });

<QuotesReadyTodo
  quotes={data?.items ?? []}
  count={data?.pagination.totalCount}
  renderLink={renderLink}
/>;

Open in Storybook ↗