"use client"

import { usePathname } from "next/navigation"
import { useIntl } from "react-intl"

import { webviews } from "@/constants/routes/webviews"
import { dt } from "@/lib/dt"

import AwardPoints from "@/components/MyPages/Blocks/Points/EarnAndBurn/AwardPoints"
import Link from "@/components/TempDesignSystem/Link"
import Table from "@/components/TempDesignSystem/Table"
import Body from "@/components/TempDesignSystem/Text/Body"
import useLang from "@/hooks/useLang"

import type { RowProps } from "@/types/components/myPages/myPage/earnAndBurn"
import { RewardTransactionTypes } from "@/types/components/myPages/myPage/enums"

export default function Row({ transaction }: RowProps) {
  const intl = useIntl()
  const lang = useLang()
  const pathName = usePathname()
  const isWebview = webviews.includes(pathName)

  const nightString = `${transaction.nights} ${transaction.nights === 1 ? intl.formatMessage({ id: "night" }) : intl.formatMessage({ id: "nights" })}`

  let description =
    transaction.hotelName && transaction.city
      ? `${transaction.hotelName}, ${transaction.city} ${nightString}`
      : `${nightString}`

  switch (transaction.type) {
    case RewardTransactionTypes.stay:
    case RewardTransactionTypes.stayAdj:
      if (transaction.hotelId === "ORS") {
        description = intl.formatMessage({ id: "Former Scandic Hotel" })
      }
      if (transaction.confirmationNumber === "BALFWD") {
        description = intl.formatMessage({
          id: "Points earned prior to May 1, 2021",
        })
      }
      break
    case RewardTransactionTypes.ancillary:
      description = intl.formatMessage({ id: "Extras to your booking" })
      break
    case RewardTransactionTypes.enrollment:
      description = intl.formatMessage({ id: "Sign up bonus" })
      break
    case RewardTransactionTypes.mastercard_points:
      description = intl.formatMessage({ id: "Scandic Friends Mastercard" })
      break
    case RewardTransactionTypes.tui_points:
      description = intl.formatMessage({ id: "TUI Points" })

    case RewardTransactionTypes.pointShop:
      description = intl.formatMessage({ id: "Scandic Friends Point Shop" })
      break
  }

  const arrival = dt(transaction.checkinDate).locale(lang).format("DD MMM YYYY")

  function renderConfirmationNumber() {
    if (transaction.confirmationNumber === "BALFWD") return null

    if (
      !isWebview &&
      transaction.bookingUrl &&
      (transaction.type === RewardTransactionTypes.stay ||
        transaction.type === RewardTransactionTypes.rewardNight)
    ) {
      return (
        <Link variant="underscored" href={transaction.bookingUrl}>
          {transaction.confirmationNumber}
        </Link>
      )
    }

    return transaction.confirmationNumber
  }

  return (
    <Table.TR>
      <Table.TD>
        <AwardPoints
          awardPoints={transaction.awardPoints}
          isCalculated={transaction.pointsCalculated}
        />
      </Table.TD>
      <Table.TD>
        <Body textTransform="bold">{description}</Body>
      </Table.TD>
      <Table.TD>{renderConfirmationNumber()}</Table.TD>
      <Table.TD>
        {transaction.checkinDate && transaction.confirmationNumber !== "BALFWD"
          ? arrival
          : null}
      </Table.TD>
    </Table.TR>
  )
}
