import { observer } from "mobx-react";
// buzzwareTech imports
import { ENotificationTab } from "@buzzwaretech/constants";
import { useTranslation } from "@buzzwaretech/i18n";
import { EmptyStateCompact } from "@buzzwaretech/propel/empty-state";

type TNotificationEmptyStateProps = {
  currentNotificationTab: ENotificationTab;
};

export const NotificationEmptyState = observer(function NotificationEmptyState({
  currentNotificationTab,
}: TNotificationEmptyStateProps) {
  // buzzwareTech imports
  const { t } = useTranslation();

  return (
    <>
      <EmptyStateCompact
        assetKey="inbox"
        assetClassName="size-24"
        title={
          currentNotificationTab === ENotificationTab.ALL
            ? t("workspace_empty_state.inbox_sidebar_all.title")
            : t("workspace_empty_state.inbox_sidebar_mentions.title")
        }
        className="max-w-56"
      />
    </>
  );
});