ConceptPortal-public/rsconcept/frontend/src/dialogs/DlgCloneLibraryItem.tsx

'use client';

import clsx from 'clsx';
import { useEffect, useMemo, useState } from 'react';
import { toast } from 'react-toastify';

import Checkbox from '@/components/Common/Checkbox';
import Modal, { ModalProps } from '@/components/Common/Modal';
import TextArea from '@/components/Common/TextArea';
import TextInput from '@/components/Common/TextInput';
import { useLibrary } from '@/context/LibraryContext';
import { useConceptNavigation } from '@/context/NavigationContext';
import { ILibraryItem } from '@/models/library';
import { IRSFormCreateData } from '@/models/rsform';
import { classnames } from '@/utils/constants';
import { cloneTitle } from '@/utils/misc';

interface DlgCloneLibraryItemProps extends Pick<ModalProps, 'hideWindow'> {
  base: ILibraryItem;
}

function DlgCloneLibraryItem({ hideWindow, base }: DlgCloneLibraryItemProps) {
  const router = useConceptNavigation();
  const [title, setTitle] = useState('');
  const [alias, setAlias] = useState('');
  const [comment, setComment] = useState('');
  const [common, setCommon] = useState(false);
  const [canonical, setCanonical] = useState(false);

  const { cloneItem } = useLibrary();

  const canSubmit = useMemo(() => title !== '' && alias !== '', [title, alias]);

  useEffect(() => {
    if (base) {
      setTitle(cloneTitle(base));
      setAlias(base.alias);
      setComment(base.comment);
      setCommon(base.is_common);
      setCanonical(false);
    }
  }, [base, base?.title, base?.alias, base?.comment, base?.is_common]);

  function handleSubmit() {
    const data: IRSFormCreateData = {
      item_type: base.item_type,
      title: title,
      alias: alias,
      comment: comment,
      is_common: common,
      is_canonical: canonical
    };
    cloneItem(base.id, data, newSchema => {
      toast.success(`Копия создана: ${newSchema.alias}`);
      router.push(`/rsforms/${newSchema.id}`);
    });
  }

  return (
    <Modal
      header='Создание копии концептуальной схемы'
      hideWindow={hideWindow}
      canSubmit={canSubmit}
      submitText='Создать'
      onSubmit={handleSubmit}
      className={clsx('px-6 py-2', classnames.flex_col)}
    >
      <TextInput label='Полное название' value={title} onChange={event => setTitle(event.target.value)} />
      <TextInput
        label='Сокращение'
        value={alias}
        className='max-w-sm'
        onChange={event => setAlias(event.target.value)}
      />
      <TextArea label='Комментарий' value={comment} onChange={event => setComment(event.target.value)} />
      <Checkbox label='Общедоступная схема' value={common} setValue={value => setCommon(value)} />
    </Modal>
  );
}

export default DlgCloneLibraryItem;