import { AboutContactFields } from '@admin/pages/about/about-contact-fields';
import { AboutContentFields } from '@admin/pages/about/about-content-fields';
import { AboutImageFields } from '@admin/pages/about/about-image-fields';

type AboutFormFieldsProps = {
    data: {
        mission: string;
        vision: string;
        motto: string;
        intro: string;
        about_text: string;
        objectives: string;
        about_image: string;
        facebook: string;
        x: string;
        instagram: string;
        linkedin: string;
        address: string;
        email: string;
        primary_phone: string;
        secondary_phone: string;
        whatsapp: string;
    };
    errors: Partial<Record<keyof AboutFormFieldsProps['data'], string>>;
    setData: (key: string, value: unknown) => void;
};

export function AboutFormFields({ data, errors, setData }: AboutFormFieldsProps) {
    return (
        <>
            <AboutContentFields
                data={{
                    mission: data.mission,
                    vision: data.vision,
                    motto: data.motto,
                    intro: data.intro,
                    about_text: data.about_text,
                    objectives: data.objectives,
                }}
                errors={errors}
                setData={setData}
            />

            <AboutImageFields
                data={{ about_image: data.about_image }}
                errors={errors}
                setData={setData}
            />

            <AboutContactFields
                data={{
                    facebook: data.facebook,
                    x: data.x,
                    instagram: data.instagram,
                    linkedin: data.linkedin,
                    address: data.address,
                    email: data.email,
                    primary_phone: data.primary_phone,
                    secondary_phone: data.secondary_phone,
                    whatsapp: data.whatsapp,
                }}
                errors={errors}
                setData={setData}
            />
        </>
    );
}