import { ArrowLeft } from "react-feather"

import { overview } from "@/constants/routes/webviews"

import Link from "@/components/TempDesignSystem/Link"
import { getIntl } from "@/i18n"
import { getLang } from "@/i18n/serverContext"
import { webviewSearchParams } from "@/utils/webviews"

import styles from "./linkToOverview.module.css"

export default async function LinkToOverview() {
  const intl = await getIntl()
  const searchParams = await webviewSearchParams()

  const lang = await getLang()
  const overviewHref = `${overview[lang]}?${searchParams.toString()}`
  return (
    <Link className={styles.overviewLink} href={overviewHref}>
      <ArrowLeft height={20} width={20} />
      {intl.formatMessage({
        defaultMessage: "Go back to overview",
      })}
    </Link>
  )
}