ENGLISH·COURSE API
    Preparing search index...

    Function

    InstallAppButton

    • The header chip that gets the course onto the learner's home screen or Dock.

      Parameters

      • props: InstallAppButtonProps

        See InstallAppButtonProps

      Returns Element

      The header control

      Purely presentational, like the theme and locale chips beside it. Whether it should exist at all is SiteHeader's call, because that decision can only be made after hydration and belongs with the thing that owns the header's layout. What it opens is this component's call, and it is decided by the path the header hands it — see useInstallPath.

      Four destinations, and the difference matters to the learner before they press it. A browser that offered an install can perform it in a tap. The three that cannot each need a different set of instructions, because an iPhone, an iPad and a Mac put these controls in different places and call the last step by different names — one ends on a home screen, the other in a Dock. The accessible name says which of those is about to happen, because being told "here is how to do it" and then handed a one-tap dialog is a promise the control did not keep.

      The glyph is the same for all four. The control means one thing on every platform; only what it opens differs. It is SquarePlus, the one iOS draws beside "Add to Home Screen" — a download glyph would be wrong twice over: nothing is downloaded, and it would teach the learner to look for the wrong icon. It is decorative; the name carries the meaning.

      No destination is a one-shot prompt. A learner who dismisses any of them can press the chip again and get it back.

      const path = useInstallPath();

      if (path.kind === "none") return null;
      return <InstallAppButton path={path} />;
      • SafariInstallGuideModal
      • InstallPromptModal
      • AddToHomeScreenModal

    Settings

    Member Visibility