import { ArrowLeft } from "react-feather"

import Link from "@scandic-hotels/design-system/OldDSLink"

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

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() {
  if (!env.WEBVIEW_SHOW_OVERVIEW) {
    return null
  }

  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({
        id: "webviews.goBackToOverview",
        defaultMessage: "Go back to overview",
      })}
    </Link>
  )
}