import type { Edges } from "@/types/requests/utils/edges"
import type { TypenameInterface } from "@/types/requests/utils/typename"

export type Order = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9

export type ColSpan = 2 | 3 | 4 | 6 | 8
export type RowSpan = 1 | 2 | 3 | 6

// TODO: Extend query and fix type accordingly
export interface Row extends TypenameInterface<"Card"> {
  title: string
}

type Column = {
  span: ColSpan
  rows: {
    rowConnection: Edges<Row>
  }[]
}

export interface Grid {
  columns: Column[]
}

export interface GridProps
  extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {
  children: (row: Row) => React.ReactNode
  items: Grid
  tag?: "aside" | "article" | "div" | "main" | "section"
}