import Konva from 'konva';
import { KonvaNodeComponent } from 'react-konva';

// Shapes
export enum ShapeTypes {
  RECTANGLE = 'reactangle',
  CIRCLE = 'circle',
}

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

export type WithCustomConfig<
  TConfig extends Konva.ShapeConfig,
  TData = DefaultShapeData,
> = TConfig & {
  id: string;
  data?: TData;
} & WithTransformProps<TConfig>;

export type RectangleConfig<TData = DefaultShapeData> = {
  type: ShapeTypes.RECTANGLE;
} & WithCustomConfig<Konva.RectConfig, TData>;

export type CircleConfig<TData = DefaultShapeData> = {
  type: ShapeTypes.CIRCLE;
} & WithCustomConfig<Konva.CircleConfig, TData>;

export type ShapeConfig<TData = DefaultShapeData> =
  | RectangleConfig<TData>
  | CircleConfig<TData>;

// Store
export type SubcribeHandler = (store: StoreValue) => void;
export type StoreSelector<ReturnType> = (store: StoreValue) => ReturnType;
export interface StoreValue {
  background: string;
  shapes: ShapeConfig[];
  selectedShapeId: ShapeConfig['id'] | null;
}

// Transformable
export type TransformableShapeProps<
  TShapeComponent extends KonvaNodeComponent<Konva.Node>,
> = TShapeComponent extends KonvaNodeComponent<Konva.Node, infer Props>
  ? Props & WithTransformProps<Props>
  : never;

export type WithTransformProps<
  TShapeConfig extends Konva.ShapeConfig = Konva.ShapeConfig,
> = {
  isTransformable?: boolean;
  isSelected?: boolean;
  onSelect?(): void;
  onChange?(shapeConfig: TShapeConfig): void;
  title?: string;
  isAnchor?: boolean;
};
