import { JsonToHtml } from "@scandic-hotels/design-system/JsonToHtml"
import { TeaserCard } from "@scandic-hotels/design-system/TeaserCard"
import { DynamicContentEnum } from "@scandic-hotels/trpc/types/dynamicContent"
import { SidebarEnums } from "@scandic-hotels/trpc/types/sidebar"

import { CookieConsentButton } from "@/components/Blocks/DynamicContent/ManageCookieConsent/CookieConsentButton"
import EmployeeBenefitsAuthCard from "@/components/DigitalTeamMemberCard/EmployeeBenefits/AuthCard"

import ShortcutsList from "../Blocks/ShortcutsList"
import Card from "../TempDesignSystem/Card"
import JoinLoyaltyContact from "./JoinLoyalty"

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

import type { SidebarProps } from "@/types/components/sidebar"

export default function Sidebar({ blocks }: SidebarProps) {
  return (
    <aside className={styles.aside}>
      {blocks.map((block, idx) => {
        switch (block.typename) {
          case SidebarEnums.blocks.Content:
            return (
              <JsonToHtml
                key={`${block.typename}-${idx}`}
                embeds={block.content.embedded_itemsConnection.edges}
                nodes={block.content.json.children}
              />
            )
          case SidebarEnums.blocks.DynamicContent:
            switch (block.dynamic_content.component) {
              case DynamicContentEnum.Sidebar.components
                .employee_benefits_auth_card:
                return (
                  <EmployeeBenefitsAuthCard key={`${block.typename}-${idx}`} />
                )
              case DynamicContentEnum.Sidebar.components.cookie_consent_button:
                return <CookieConsentButton key={`${block.typename}-${idx}`} />
              default:
                return null
            }
          case SidebarEnums.blocks.JoinLoyaltyContact:
            return (
              <JoinLoyaltyContact
                key={`${block.typename}-${idx}`}
                block={block.join_loyalty_contact}
              />
            )
          case SidebarEnums.blocks.ScriptedCard:
            if (!block.scripted_card) {
              return null
            }

            return (
              <Card
                key={block.scripted_card.system.uid}
                heading={block.scripted_card.heading}
                secondaryButton={block.scripted_card.secondaryButton}
                primaryButton={block.scripted_card.primaryButton}
                bodyText={block.scripted_card.body_text}
                scriptedTopTitle={block.scripted_card.scripted_top_title}
                theme={block.scripted_card.theme ?? "image"}
                backgroundImage={block.scripted_card.backgroundImage}
              />
            )
          case SidebarEnums.blocks.TeaserCard:
            if (!block.teaser_card) {
              return null
            }

            return (
              <TeaserCard
                key={block.teaser_card.system.uid}
                heading={block.teaser_card.heading}
                bodyText={block.teaser_card.body_text}
                style={block.teaser_card.theme}
                primaryButton={block.teaser_card.primaryButton}
                secondaryButton={block.teaser_card.secondaryButton}
                sidePeekButton={block.teaser_card.sidePeekButton}
                sidePeekContent={block.teaser_card.sidePeekContent}
                image={block.teaser_card.image}
              />
            )
          case SidebarEnums.blocks.QuickLinks:
            return (
              <ShortcutsList
                key={`${block.typename}-${idx}`}
                {...block.shortcuts}
                hasTwoColumns={false}
              />
            )

          default:
            return null
        }
      })}
    </aside>
  )
}