---
import IconChevronLeft from "@/assets/icons/IconChevronLeft.svg";
import LinkButton from "@/components/LinkButton.astro";
import { getRelativeLocaleUrl } from "astro:i18n";
import { useTranslations } from "@/i18n";
import config from "@/config";

const locale = Astro.currentLocale ?? config.site.lang;
const t = useTranslations(locale);
---

{
  config.features.showBackButton && (
    <div class="app-layout flex items-center justify-start">
      <LinkButton
        id="back-button"
        href={getRelativeLocaleUrl(locale, "")}
        class="focus-outline hover:text-foreground/75 -ms-2 mt-8 mb-2"
      >
        <IconChevronLeft class="inline-block size-6 rtl:rotate-180" />
        <span>{t.post.goBack}</span>
      </LinkButton>
    </div>
  )
}

<script>
  function updateGoBackUrl() {
    const backButton: HTMLAnchorElement | null =
      document.querySelector("#back-button");

    const backUrl = sessionStorage.getItem("backUrl");

    if (backUrl && backButton) {
      backButton.href = backUrl;
    }
  }

  document.addEventListener("astro:page-load", updateGoBackUrl);
  updateGoBackUrl();
</script>
