import { PayloadAction } from '@reduxjs/toolkit';
import { IComponentTemplate, TDatasourceTheme } from '@ws-ui/shared';

export type TInspectorType = 'css' | 'datasource';
export interface ITemplatedGroupItem {
    name: string;
    banner: string;
    description: string;
    data: IComponentTemplate;
}
export interface ITemplatedGroup {
    group: string;
    icon: string;
    tags: string[];
    link: string;
    components: ITemplatedGroupItem[];
}
export type ITemplateList = Record<string, {
    hide: boolean;
}>;
export interface ITemplatedComponent {
    selectedGroup: string;
    data: ITemplatedGroup[];
}
export interface IWebformEditorState {
    inspector: IInspectorState;
    components: IComponentTemplate[];
    templates: ITemplatedComponent;
    datasources: {
        theme: TDatasourceTheme;
    };
    flags: {
        [key: string]: any;
    };
    i18n: {
        current: string;
    };
}
/**
 * Inspector state
 */
export type IInspectorState = {
    css: IInspector;
    datasource: IInspector<IDatasourcedata>;
};
export interface IInspector<T = string> {
    active: boolean;
    data?: T;
}
export interface IDatasourcedata {
    dataclass?: string;
    datasource?: string;
    namespace?: string;
    parent?: string;
    name: string;
}
/**
 * Inspector actions
 */
export type TToggleInspectorPayload = {
    type: 'css';
    data?: string;
} | {
    type: 'datasource';
    data?: IDatasourcedata;
};
export type TToggleInspectorAction = PayloadAction<{
    type: 'css' | 'datasource';
}>;
export type TInspectAction = PayloadAction<TToggleInspectorPayload>;
/**
 * Components actions
 */
export type TAddComponentAction = PayloadAction<IComponentTemplate>;
export type TRemoveComponentAction = PayloadAction<string>;
