'use client';

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Form, FormSubmit, RenderFields, useDocumentInfo, useServerFunctions, useTranslation } from '@payloadcms/ui';
import { abortAndIgnore } from '@payloadcms/ui/shared';
import React, { useCallback, useEffect, useRef, useState } from 'react';
import { v4 as uuid } from 'uuid';
import { useEditorConfigContext } from '../../lexical/config/client/EditorConfigProvider.js';
export const DrawerContent = ({
  data,
  featureKey,
  fieldMapOverride,
  handleDrawerSubmit,
  schemaFieldsPathOverride,
  schemaPath,
  schemaPathSuffix
}) => {
  const {
    t
  } = useTranslation();
  const {
    id,
    collectionSlug,
    getDocPreferences,
    globalSlug
  } = useDocumentInfo();
  const onChangeAbortControllerRef = useRef(new AbortController());
  const [initialState, setInitialState] = useState(false);
  const {
    fieldProps: {
      featureClientSchemaMap,
      permissions
    }
  } = useEditorConfigContext();
  const {
    getFormState
  } = useServerFunctions();
  const schemaFieldsPath = schemaFieldsPathOverride ?? `${schemaPath}.lexical_internal_feature.${featureKey}${schemaPathSuffix ? `.${schemaPathSuffix}` : ''}`;
  const fields = fieldMapOverride ?? featureClientSchemaMap[featureKey]?.[schemaFieldsPath] // Field Schema
  ;
  useEffect(() => {
    const controller = new AbortController();
    const awaitInitialState = async () => {
      const {
        state
      } = await getFormState({
        id,
        collectionSlug,
        data: data ?? {},
        docPermissions: {
          fields: true
        },
        docPreferences: await getDocPreferences(),
        globalSlug,
        operation: 'update',
        renderAllFields: true,
        schemaPath: schemaFieldsPath,
        signal: controller.signal
      });
      setInitialState(state);
    };
    void awaitInitialState();
    return () => {
      abortAndIgnore(controller);
    };
  }, [schemaFieldsPath, id, data, getFormState, collectionSlug, globalSlug, getDocPreferences]);
  const onChange = useCallback(async ({
    formState: prevFormState
  }) => {
    abortAndIgnore(onChangeAbortControllerRef.current);
    const controller_0 = new AbortController();
    onChangeAbortControllerRef.current = controller_0;
    const {
      state: state_0
    } = await getFormState({
      id,
      collectionSlug,
      docPermissions: {
        fields: true
      },
      docPreferences: await getDocPreferences(),
      formState: prevFormState,
      globalSlug,
      operation: 'update',
      schemaPath: schemaFieldsPath,
      signal: controller_0.signal
    });
    if (!state_0) {
      return prevFormState;
    }
    return state_0;
  }, [getFormState, id, collectionSlug, getDocPreferences, globalSlug, schemaFieldsPath]);
  // cleanup effect
  useEffect(() => {
    return () => {
      abortAndIgnore(onChangeAbortControllerRef.current);
    };
  }, []);
  if (initialState === false) {
    return null;
  }
  return /*#__PURE__*/_jsxs(Form, {
    beforeSubmit: [onChange],
    disableValidationOnSubmit: true,
    fields: Array.isArray(fields) ? fields : [],
    initialState: initialState,
    onChange: [onChange],
    onSubmit: handleDrawerSubmit,
    uuid: uuid(),
    children: [/*#__PURE__*/_jsx(RenderFields, {
      fields: Array.isArray(fields) ? fields : [],
      forceRender: true,
      parentIndexPath: "",
      parentPath: "" // See Blocks feature path for details as for why this is empty
      ,

      parentSchemaPath: schemaFieldsPath,
      permissions: permissions,
      readOnly: false
    }), /*#__PURE__*/_jsx(FormSubmit, {
      children: t('fields:saveChanges')
    })]
  });
};
//# sourceMappingURL=DrawerContent.js.map