export function NoteTable()

in dashboards-notebooks/public/components/note_table.tsx [57:185]
117 lines of code
3 McCabe index (conditional complexity)

export function NoteTable(props: NoteTableProps) {
  const [isModalVisible, setIsModalVisible] = useState(false); // Modal Toggle
  const [modalLayout, setModalLayout] = useState(<EuiOverlayMask></EuiOverlayMask>); // Modal Layout
  const [isActionsPopoverOpen, setIsActionsPopoverOpen] = useState(false);
  const [selectedNotebooks, setSelectedNotebooks] = useState([]);
  const [searchQuery, setSearchQuery] = useState('');
  const {
    notebooks,
    createNotebook,
    renameNotebook,
    cloneNotebook,
    deleteNotebook,
  } = props;

  useEffect(() => {
    props.setBreadcrumbs([
      {
        text: 'Notebooks',
        href: '#',
      },
    ]);
    props.fetchNotebooks();
  }, []);

  const closeModal = () => {
    setIsModalVisible(false);
  };
  const showModal = () => {
    setIsModalVisible(true);
  };

  const onCreate = async (newNoteName: string) => {
    createNotebook(newNoteName);
    closeModal();
  };

  const onRename = async (newNoteName: string) => {
    renameNotebook(newNoteName, selectedNotebooks[0].id);
    closeModal();
  };

  const onClone = async (newName: string) => {
    cloneNotebook(newName, selectedNotebooks[0].id);
    closeModal();
  };

  const onDelete = async () => {
    const toastMessage = `Notebook${selectedNotebooks.length > 1 ?
      's' : ' ' + selectedNotebooks[0].path} successfully deleted!`;
    Promise.all(selectedNotebooks.map((notebook) => deleteNotebook(notebook.id, undefined, false)))
      .then(() => props.setToast(toastMessage))
      .catch((err) => {
        props.setToast('Error deleting notebooks, please make sure you have the correct permission.', 'danger');
        console.error(err.body.message);
      });
    closeModal();
  };

  const createNote = () => {
    setModalLayout(
      getCustomModal(
        onCreate,
        closeModal,
        'Name',
        'Create notebook',
        'Cancel',
        'Create',
        undefined,
        CREATE_NOTE_MESSAGE,
      )
    );
    showModal();
  };

  const renameNote = () => {
    setModalLayout(
      getCustomModal(
        onRename,
        closeModal,
        'Name',
        'Rename notebook',
        'Cancel',
        'Rename',
        selectedNotebooks[0].path,
        CREATE_NOTE_MESSAGE,
      )
    );
    showModal();
  };

  const cloneNote = () => {
    setModalLayout(
      getCustomModal(
        onClone,
        closeModal,
        'Name',
        'Duplicate notebook',
        'Cancel',
        'Duplicate',
        selectedNotebooks[0].path + ' (copy)',
        CREATE_NOTE_MESSAGE,
      )
    );
    showModal();
  };

  const deleteNote = () => {
    const notebookString = `notebook${selectedNotebooks.length > 1 ? 's' : ''}`;
    setModalLayout(
      <DeleteNotebookModal
        onConfirm={onDelete}
        onCancel={closeModal}
        title={`Delete ${selectedNotebooks.length} ${notebookString}`}
        message={`Are you sure you want to delete the selected ${selectedNotebooks.length} ${notebookString}?`}
      />
    );
    showModal();
  };
  
  const addSampleNotebooks = async () => {
    setModalLayout(getSampleNotebooksModal(closeModal, async () => {
      closeModal();
      await props.addSampleNotebooks();
    }));
    showModal();
  }

  const popoverButton = (
    <EuiButton iconType="arrowDown" iconSide="right" onClick={() => setIsActionsPopoverOpen(!isActionsPopoverOpen)}>