import { type ReactNode } from "react";

import type { ConfigField } from "@/back/types/dynamic-pages";

export interface DynamicInputProps {
  fieldName: string;
  fieldValue: string | number | boolean | File | Date;
  field: ConfigField;
  setData: (
    name: string,
    value: string | number | boolean | File | object | null,
  ) => void;
  errors: Record<string, string> | null | undefined;
}

export type InputResolver = (props: DynamicInputProps) => ReactNode;

const resolvers = new Map<string, InputResolver>();

export const DynamicInputRegistry = {
  add(name: string, resolver: InputResolver) {
    resolvers.set(name, resolver);
  },
  get(
    targetName: string,
    fieldName: string,
    fieldValue: string | number | boolean | File | Date,
    field: ConfigField,

    setData: (
      name: string,
      value: string | number | boolean | File | object | null,
    ) => void,

    errors?: Record<string, string> | null,
  ): ReactNode | null {
    const resolver = resolvers.get(targetName.toLowerCase());
    return resolver
      ? resolver({ fieldName, fieldValue, field, setData, errors })
      : null;
  },
};

// Add all custom inputs presents in files to the registry.
const modules = import.meta.glob<{ default: InputResolver }>(
  "./CustomInputs/*.tsx",
  {
    eager: true,
  },
);

Object.entries(modules).forEach(([path, module]) => {
  const name = path
    .replace("./CustomInputs/", "")
    .replace(".tsx", "")
    .toLowerCase();
  DynamicInputRegistry.add(name, module.default);
});