'use client';
import { FunctionComponent, PropsWithChildren, useMemo } from 'react';
import { useTranslations } from 'next-intl';
import { NotificationBell } from '@/components/notifications';
import { ROUTES } from '@/constants';
import { LinkToPage } from '@/utils';
import { useNurseRequestInbox } from '@/services/bookingRequests';
import { useSupportUnreadTotal } from '@/services/tickets';
import MobileShell from './MobileShell';

/**
 * Nurse app shell — the "نمای پرستار" workspace. Five bottom-nav destinations: امروز (the
 * operational home), درخواست‌ها, حرفهٔ من, مالی, and a بیشتر hub carrying support, notifications and
 * settings.
 *
 * **درخواست‌ها is a tab, not a link.** It was previously reachable only from a strip on the
 * dashboard — which meant the one screen in the whole nurse app with a *deadline* on it (a pending
 * request expires unanswered) lived one tab-plus-a-scroll away, and had no way to signal that
 * something was waiting from anywhere else in the app. As a tab it carries the pending count as a
 * badge, so the nurse sees the queue filling up from any screen. The inbox query is the same cached
 * one the dashboard strip and the inbox page already read — no extra request.
 *
 * Identity lives in the «بیشتر» hub only — never in the top bar. One tap from any screen via the
 * nav is close enough for a preference-and-account surface, and the header stays a title bar.
 * @layout NurseLayout
 */
const NurseLayout: FunctionComponent<PropsWithChildren> = ({ children }) => {
  const t = useTranslations('nav');
  const supportUnreadTotal = useSupportUnreadTotal();
  const { data: pendingRequests } = useNurseRequestInbox();

  const tabs: Array<LinkToPage> = useMemo(
    () => [
      {
        title: t('group_today'),
        path: ROUTES.NURSE,
        icon: 'today',
      },
      {
        title: t('requests'),
        path: ROUTES.NURSE_REQUESTS,
        icon: 'requests',
        badgeCount: pendingRequests?.total || undefined,
      },
      {
        title: t('group_profession'),
        path: ROUTES.NURSE_PRACTICE,
        icon: 'practice',
        matchPaths: [
          ROUTES.NURSE_PROFILE,
          ROUTES.NURSE_SERVICES,
          ROUTES.NURSE_COVERAGE,
          ROUTES.NURSE_VERIFICATION,
        ],
      },
      {
        title: t('group_finance'),
        path: ROUTES.NURSE_FINANCE,
        icon: 'earnings',
        matchPaths: [ROUTES.NURSE_EARNINGS, ROUTES.NURSE_BANK],
      },
      {
        title: t('more'),
        path: ROUTES.NURSE_MORE,
        icon: 'more',
        matchPaths: [ROUTES.NURSE_SUPPORT_TICKETS, ROUTES.NURSE_NOTIFICATIONS],
        badgeCount: supportUnreadTotal ?? undefined,
      },
    ],
    [t, supportUnreadTotal, pendingRequests]
  );

  return (
    <MobileShell name="Nurse" tabs={tabs} headerActions={<NotificationBell role="nurse" />}>
      {children}
    </MobileShell>
  );
};

export default NurseLayout;