Training Resources

npx shadcn add "https://ui.beste.co/r/onboarding42?email=YOUR_EMAIL&license_key=YOUR_KEY"

npx shadcn add "https://ui.beste.co/r-base/onboarding42?email=YOUR_EMAIL&license_key=YOUR_KEY"

import { Onboarding42, onboarding42Demo } from "@/components/beste/block/onboarding42";

export default function LearningPage() {
  return <Onboarding42 {...onboarding42Demo} />;
}

import { Onboarding42 } from "@/components/beste/block/onboarding42";
import { Search24 } from "@/components/beste/piece/search24";

export default function LearningPage() {
  return (
    <Onboarding42
      badge={{ label: "Learning it" }}
      heading="Learn it in the order you actually need it"
      description="A search bar and six short things, instead of a training course nobody finishes."
      featuredTitle="Start by searching, not watching"
      featuredBody="The help centre uses the same search as the product and looks across guides and release notes at once."
      media={
        <Search24
          query="waiting list"
          groupLabel="Guides"
          results={[
            { title: "Waiting list backfill rules", meta: "Updated last week", kind: "Guide" },
          ]}
          footer="1 of 24 matches shown"
        />
      }
      image={{ src: "/backdrops/blue.jpg", alt: "Soft blue gradient backdrop" }}
      button={{ label: "Open the help centre", href: "/help" }}
      resources={[
        {
          kind: "Video",
          title: "The clinic list, for reception",
          description: "The one screen the front desk lives in.",
          length: "4 min",
          href: "/help/clinic-list",
        },
        {
          kind: "Guide",
          title: "Billing and month-end",
          description: "How charges attach to appointments.",
          length: "9 pages",
          href: "/help/billing",
        },
      ]}
      note="There is no certification and no completion percentage."
    />
  );
}

type ActionLink = {
  label: string;
  href: string;
};

type TileImage = {
  src: string;
  alt: string;
};

type Resource = {
  kind: string;
  title: string;
  description: string;
  length: string;
  href: string;
};