import { useTranslation } from 'react-i18next';

import { SidebarHeader } from '@composed-components/LibrariesSidebar/components/headers/SidebarHeader';
import { SidebarHeaderActions } from '@composed-components/LibrariesSidebar/components/headers/SidebarHeaderActions';
import { SidebarChildrenList } from '@composed-components/LibrariesSidebar/components/list/children/SidebarChildrenList';
import { SidebarRootList } from '@composed-components/LibrariesSidebar/components/list/root/SidebarRootList';
import { SidebarProvider } from '@composed-components/LibrariesSidebar/context';
import { type LibrariesSidebarProps } from '@composed-components/LibrariesSidebar/types';

const LibrariesSidebar = ({
  model,
  capabilities,
  parentId,
  onBack,
  onSort,
  onAdd,
  onAddMouseEnter,
  onItemClick,
  loading,
  slotProps,
}: LibrariesSidebarProps) => {
  const { t } = useTranslation('material_hu_only');

  const isRoot = !parentId;

  return (
    <SidebarProvider
      model={model}
      capabilities={capabilities}
      onSort={onSort}
      onAddMouseEnter={onAddMouseEnter}
      onItemClick={onItemClick}
    >
      <SidebarHeader
        hide={isRoot}
        title={model.headerTitle}
        onBack={onBack}
        loading={loading}
      />
      <SidebarHeaderActions
        title={
          isRoot
            ? t('libraries_sidebar.articles')
            : t('libraries_sidebar.subarticles')
        }
        loading={loading}
        onAdd={onAdd}
        isEmpty={!model.nodes.length}
        parentId={parentId}
        slotProps={slotProps}
      />
      {isRoot && <SidebarRootList loading={loading} />}
      {!isRoot && (
        <SidebarChildrenList
          parentId={parentId}
          loading={loading}
          onAdd={onAdd}
        />
      )}
    </SidebarProvider>
  );
};

export type { LibrariesSidebarProps };

export default LibrariesSidebar;