// * Packages import { usePage } from "@inertiajs/react"; // * Other import SimpleString from "@/back/Components/Inputs/SimpleString"; import SimpleNumber from "@/back/Components/Inputs/SimpleNumber"; import SimpleSwitch from "@/back/Components/Inputs/SimpleSwitch"; import SimpleWysiwyg from "@/back/Components/Inputs/Wysiwyg/SimpleWysiwyg"; import CompleteInputFile from "@/back/Components/Inputs/CompleteInputFile"; import DynamicList from "@/back/Components/DynamicPages/DynamicList"; import SimpleTextarea from "@/back/Components/Inputs/SimpleTextarea"; import SimpleDatePicker from "@/back/Components/Inputs/SimpleDatePicker"; import SimpleColorPicker from "@/back/Components/Inputs/SimpleColorPicker"; import SimpleYoutubeId from "@/back/Components/Inputs/SimpleYoutubeId"; import SimpleVimeoId from "@/back/Components/Inputs/SimpleVimeoId"; import EnumSelect from "@/back/Components/Inputs/EnumSelect"; import StaticRouteSelect from "@/back/Components/Inputs/StaticRouteSelect"; import DynamicWrapperModelSelect from "@/back/Components/DynamicPages/DynamicWrapperModelSelect"; import { LaravelEnum } from "@/back/types/global"; import { ConfigField, DynamicFieldTypes, DynamicInternalField, } from "@/back/types/dynamic-pages"; import str from "@/hooks/use-string"; import useTrans from "@/hooks/use-translations"; import { extractLaravelValidationValue, extractMinMaxFromValidation, extractRequiredValidation, } from "@/hooks/use-laravel-validation"; import VideoInput from "../Inputs/VideoInput"; import { VideoAttributes } from "../Inputs/Video/VideoButton"; /* eslint-disable no-unused-vars */ type DynamicInputsProps = { name: string; config: ConfigField[]; content: DynamicInternalField | null; isChildren?: boolean; setData: ( name: string, value: string | number | boolean | File | object | null, ) => void; reset: (name?: string) => void; parentErrors?: Record | null; }; /* eslint-enable no-unused-vars */ // Allows to get specific input from enum value. export default function DynamicInputs({ name, config, content = null, isChildren = false, setData, reset, parentErrors, }: DynamicInputsProps) { // Enums. const enumDynamicFieldTypes = usePage().props .enumDynamicFieldTypes as DynamicFieldTypes; const enumElementPosition = usePage().props .enumElementPosition as LaravelEnum; const enumContactFormType = usePage().props.enumContactFormType as LaravelEnum const videoProviderEnum = usePage().props.videoProviderEnum as LaravelEnum; // Translations. const transAssociateTo = useTrans("back.form_associate_to"); const transUnsupportedType = useTrans("back.unsupported_type"); /** * Get a translation for a specific field label. * Need to recreate useTrans hook to avoid hook error. * @param fieldLabel string * @returns string */ const getTrans = (fieldLabel: string): string => { return str( `${transAssociateTo.split("|")[0].replace(":attribute", fieldLabel)}`, ) .ucFirst() .value(); }; return (
{/* Loop on all config elements. */} {Object.entries(config).map(([id, field]) => { // Get the enum value from the element type value. const typeEnum = Object.values(enumDynamicFieldTypes).find( (def) => def.value === field.type, ); // Set the name of the current field. const fieldName = `${name}.${field.key}`; // Set the content value from the config key. const fieldValue = content?.[field.key as keyof typeof content] ?? ""; switch (field.type) { // String input. case enumDynamicFieldTypes.string.value: return ( ); // Textarea input. case enumDynamicFieldTypes.textarea.value: return ( ); // Wysiwyg input. case enumDynamicFieldTypes.wysiwyg.value: return (
); // Numbers input. case enumDynamicFieldTypes.number.value: return ( ); // Switch input. case enumDynamicFieldTypes.boolean.value: return (
); // Url input. case enumDynamicFieldTypes.url.value: return ( ); // Image input. case enumDynamicFieldTypes.image.value: return ( ); // Email input. case enumDynamicFieldTypes.email.value: return ( ); // List input. case enumDynamicFieldTypes.list.value: return ( ); // File input. case enumDynamicFieldTypes.file.value: return ( ); // VimeoId input case enumDynamicFieldTypes.vimeoid.value: return ( ); // YoutubeId input case enumDynamicFieldTypes.youtubeid.value: return ( ); // Date picker. case enumDynamicFieldTypes.date.value: return ( ); // Color picker. case enumDynamicFieldTypes.color.value: return ( ); // Model select. case enumDynamicFieldTypes.model.value: return ( ); // Static route select. case enumDynamicFieldTypes.staticroute.value: return ( ); // Position select. case enumDynamicFieldTypes.position.value: return ( ); case enumDynamicFieldTypes.contactform.value: return ( ) case enumDynamicFieldTypes.video.value: return ( ) default: return (

{transUnsupportedType}{" "} {typeEnum?.label ?? field.type}

); } })}
); }