import type { Action, ButtonAction } from "./action"

export const ComponentType = {
    Button: "button",
    Text: "text",
    TextField: "textField",
    Table: "table"
} as const;

export type ComponentType = typeof ComponentType[keyof typeof ComponentType];

export interface UIData {
    posX: number,
    posY: number,
    width: number,
    height: number
}

export interface TextGeneralData {
    text: string
}

export interface ButtonGeneralData {
    text: string
}

export interface TextFieldGeneralData {
    text: string
}

export interface TableGeneralData {
    referenceTableName: string,
    columns: string[]
}

export type GeneralData = TextGeneralData | ButtonGeneralData | TextFieldGeneralData | TableGeneralData

export interface ComponentData {
    _id: string,
    projectId: string
    screenId: string,
    name: string,
    type: ComponentType,
    uiData: UIData,
    index: number,
    generalData: GeneralData
    style: { [k: string]: string },
    action?: Action
}



export type Component = ButtonComponent | TextComponent | TextFieldComponent | TableComponent

export interface ButtonComponent {
    id: string
    screenId: string,
    name: string,
    type: "button",
    uiData: UIData,
    index: number,
    generalData: ButtonGeneralData,
    style: { [k: string]: string },
    action?: ButtonAction
}

export interface TextComponent {
    id: string
    screenId: string,
    name: string,
    type: "text",
    uiData: UIData,
    index: number,
    generalData: TextGeneralData,
    style: { [k: string]: string },
}

export interface TextFieldComponent {
    id: string
    screenId: string,
    name: string,
    type: "textField",
    uiData: UIData,
    index: number,
    generalData: TextFieldGeneralData,
    style: { [k: string]: string },
}

export interface TableComponent {
    id: string
    screenId: string,
    name: string,
    type: "table",
    uiData: UIData,
    index: number,
    generalData: TableGeneralData,
    style: { [k: string]: string },
}