import { type MediaCardProps } from "@arc-ui/components/MediaCard";
import { type TypographyCardProps } from "@arc-ui/components/TypographyCard";
import { type InformationCardProps } from "@arc-ui/components/InformationCard";

/**
 * Information card configuration for bento grid positions. Extends InformationCard with required cardUrl.
 */
export interface BentoInformationCard
  extends Omit<
    InformationCardProps,
    "button" | "badges" | "preserveAspectRatios" | "onClick" | "cardUrl"
  > {
  type: "information";
  cardUrl: NonNullable<InformationCardProps["cardUrl"]>;
}

/**
 * Media card configuration for bento grid positions. Extends MediaCard with required url and image-only media.
 */
export interface BentoMediaCard
  extends Omit<
    MediaCardProps,
    "isContained" | "buttonIcon" | "preserveAspectRatios" | "url" | "media"
  > {
  type: "media";
  url: NonNullable<MediaCardProps["url"]>;
  media: Extract<MediaCardProps["media"], { type: "img" }>;
}

/**
 * Content structure for the bento grid layout within each tab.
 * - card1 & card2: Can be either information or media cards
 * - card3: Optional information card
 * - card4: Typography card with label, heading and url
 */
export type BentoGridContent = {
  card1: BentoInformationCard | BentoMediaCard;
  card2: BentoInformationCard | BentoMediaCard;
  card3?: BentoInformationCard;
  card4: {
    url: TypographyCardProps["url"];
    label?: TypographyCardProps["label"];
    /** Overrides the default heading if provided and is not falsey. */
    heading?: string;
    text?: TypographyCardProps["text"];
    onClick?: TypographyCardProps["onClick"];
  };
};