// Libs
// -----------------------------------------------------------------------------
import React, { FC } from 'react';
import { FormInstance } from 'antd';
import type { ValidateErrorEntity } from 'rc-field-form/lib/interface';
import { observer } from 'mobx-react-lite';

// App
// -----------------------------------------------------------------------------
import { TypeAccount } from 'types/default';
import { useStore } from 'stores/StoreProvider';
import { RootStore } from 'stores/RootStore';
import { AccountForm } from '../AccountForm/AccountForm';

// Props
// -----------------------------------------------------------------------------
type AccountCardProps = {
  form: FormInstance<TypeAccount>;
  onFormSubmit: (values: TypeAccount) => void;
  onFormError: (errData: ValidateErrorEntity<TypeAccount>) => void;
};

export const AccountCard: FC<AccountCardProps> = observer(
  ({ form, onFormSubmit, onFormError }) => {
    const rootStore: RootStore = useStore();
    const pageStore = rootStore.accountsDashboardUiStore;

    const isCurrentUser =
      rootStore.currentUserStore.user?.id === pageStore.currentElement?.user.id;

    const isFormDisabled = pageStore.isFormDisabled;

    const isNewUser = pageStore.isNewElement;

    const isFullSize = pageStore.cardSize === 'large';

    const initialValues = pageStore.currentElement ?? undefined;

    return (
      <AccountForm
        form={form}
        onFormSubmit={onFormSubmit}
        onFormError={onFormError}
        isCurrentUser={isCurrentUser}
        isFormDisabled={isFormDisabled}
        isNewUser={isNewUser}
        isFullSize={isFullSize}
        initialValues={initialValues}
      />
    );
  },
);
