Function OnboardingLoadingGate

desktop/src/app/App.tsx:84–154

()

}

function OnboardingLoadingGate() {
  const systemColorScheme = useSystemColorScheme();

  return (
    <div
      className="buzz-onboarding-neutral-theme buzz-startup-shell flex items-center justify-center bg-background px-4 py-8 text-foreground"
      data-system-color-scheme={systemColorScheme}
    >
      <StartupWindowDragRegion />
      <div className="relative flex w-full max-w-[500px] flex-col items-center text-center">
        <StepProgress
          activeSegmentClassName="bg-primary"
          className="fixed bottom-12 left-1/2 z-40 -translate-x-1/2"
          completeSegmentClassName="bg-primary/35"
          currentStep={2}
          inactiveSegmentClassName="bg-muted-foreground/25"
        />

        <OnboardingSlideTransition
          className="flex w-full flex-col items-center text-center"
          direction="forward"
          effect="none"
          transitionKey="workspace-connecting"
        >
          <div className="flex h-14 w-14 items-center justify-center rounded-lg border border-border bg-background text-foreground shadow-xs">
            <Hexagon className="h-7 w-7" aria-hidden="true" />
          </div>

          <h1 className="mt-6 text-3xl font-semibold tracking-tight">
            Welcome to Buzz
          </h1>
          <p className="mt-3 max-w-[440px] text-sm leading-6 text-muted-foreground">
            Choose your first workspace to get started.
          </p>

          <div className="mt-8 flex w-full max-w-[500px] flex-col gap-3">
            <Button
              aria-disabled="true"
              className="h-10 w-full"
              tabIndex={-1}
              type="button"
            >
              Continue with Block Inc. workspace
            </Button>

            <Button
              aria-disabled="true"
              className="h-10 w-full"
              tabIndex={-1}
              type="button"
              variant="secondary"
            >
              Join a workspace
            </Button>

            <Button
              aria-disabled="true"
              className="h-10 w-full"