import React from "react";

import { BlogCardImageProps } from "@shared/contentful/blocks/cards/blog-card/types";

export interface BlogCardProps {
  slug: string;
  title?: string;
  shortDescription?: string;
  blogCreationDate?: string;
  category?: string;
  cover?: {
    url: string;
    width?: number;
    height?: number;
    title?: string;
  };
}

export interface BlogGridBaseProps {
  title?: string;
  description?: string;
  paginatedArticles: BlogCardProps[];
  totalArticles: number;
  currentPage: number;
  totalPages: number;
  selectedCategory: BlogCategoryOption;
  categoryOptions: BlogCategoryOption[];
  onCategoryChange?: (category: BlogCategoryOption) => void;
  onPageChange?: (page: number) => void;
  getPageHref?: (page: number) => string;
  /** When true, render cards in a single-column list instead of a grid. */
  asList?: boolean;
  /** Pass next/image's Image component here to enable image optimization */
  imageComponent?: React.ComponentType<BlogCardImageProps>;
}

export interface BlogCategoryOption {
  value: string;
  label: string;
}