/* BackLink — sub-page navigation back to the landing page.
 *
 * Matches the iOS app's back chevron (ChevronLeft, d="M15 18l-6-6 6-6",
 * stroke 2, round caps + joins, 24×24 viewBox) and adds a "Back" label
 * because web pages need more affordance than the app does.
 *
 * Behaviour: if the user navigated here from elsewhere on fanish.app,
 * we prefer history.back() so they land where they were. Otherwise we
 * fall back to the href (default "/") — covers external-deep-link cases.
 *
 * Convention: render <BackLink /> at the top of every sub-page that uses
 * <SiteHeader> + <main className="placeholder-page-main">. Place it as a
 * sibling above <main>, NOT inside it (the main is flex-centered).
 */
function BackLink({ href = "/", label = "Back" }) {
  const onClick = (e) => {
    try {
      if (
        window.history.length > 1 &&
        document.referrer &&
        new URL(document.referrer).host === window.location.host
      ) {
        e.preventDefault();
        window.history.back();
      }
    } catch (_) {
      // Bad referrer URL — let the href take over.
    }
  };
  return (
    <nav className="back-bar" aria-label="Page navigation">
      <div className="container">
        <a
          href={href}
          onClick={onClick}
          className="back-link"
          aria-label={label}
        >
          <svg
            className="back-link-chevron"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            strokeWidth="2"
            strokeLinecap="round"
            strokeLinejoin="round"
            aria-hidden="true"
          >
            <path d="M15 18l-6-6 6-6" />
          </svg>
          <span className="back-link-label">{label}</span>
        </a>
      </div>
    </nav>
  );
}

window.BackLink = BackLink;