import { useDrawerV2 } from '@material-hu/hooks/useDrawerV2';

import { LogEvents, logEvent } from 'src/utils/logging';

import { ContentWrapper } from '../../components/ContentWrapper';
import { type LibraryHomeConfig } from '../../types';

import EditLibraryHomeDrawer from './EditLibraryHomeDrawer';
import { LibraryHomeHeroCard } from './LibraryHomeCard';

type LibraryHomeProps = {
  config: LibraryHomeConfig;
};

export const LibraryHome = ({ config }: LibraryHomeProps) => {
  const { drawer: editHomeDrawer, showDrawer: showEditHomeDrawer } =
    useDrawerV2(EditLibraryHomeDrawer);

  const handleOpenEdit = () => {
    logEvent(LogEvents.LIBRARIES_HOME_EDIT_INITIATED);
    showEditHomeDrawer(config);
  };

  return (
    <ContentWrapper>
      {editHomeDrawer}
      <LibraryHomeHeroCard
        config={config}
        onEdit={handleOpenEdit}
      />
    </ContentWrapper>
  );
};