import { MembershipLevelEnum } from "@/constants/membershipLevels"
import { serverClient } from "@/lib/trpc/server"

import { getIntl } from "@/i18n"
import { getFriendsMembership } from "@/utils/user"

import PointsContainer from "./Container"
import { PointsColumn } from "./PointsColumn"

import type { UserProps } from "@/types/components/myPages/user"

export default async function Points({ user }: UserProps) {
  const intl = await getIntl()

  const membership = user.loyalty ? getFriendsMembership(user.loyalty) : null

  const caller = await serverClient()
  const nextLevel =
    membership?.nextLevel && MembershipLevelEnum[membership.nextLevel]
      ? await caller.contentstack.loyaltyLevels.byLevel({
          level: MembershipLevelEnum[membership.nextLevel],
        })
      : null

  return (
    <PointsContainer>
      <PointsColumn
        value={membership?.currentPoints}
        title={intl.formatMessage({
          defaultMessage: "Your points to spend",
        })}
        subtitle={intl.formatMessage({
          defaultMessage: "as of today",
        })}
      />
      {nextLevel && (
        <PointsColumn
          value={membership?.pointsRequiredToNextlevel}
          title={intl.formatMessage({
            defaultMessage: "Points needed to level up",
          })}
          subtitle={intl.formatMessage(
            {
              defaultMessage: "next level: {nextLevel}",
            },
            { nextLevel: nextLevel.name }
          )}
        />
      )}
      {/* TODO: Show NextLevelNightsColumn when nightsToTopTier data is correct from Antavo */}
      {/* {membership?.nightsToTopTier && (
        <NextLevelNightsColumn
          nights={membership.nightsToTopTier}
          subtitle={
            membership.tierExpirationDate &&
            `by ${membership.tierExpirationDate}`
          }
        />
      )} */}
    </PointsContainer>
  )
}
