'use client';

import { useApi } from '@/lib/useApi';
import { RegimensTab } from '../RegimensTab';
import { SetPageHeader } from '@/components/layout/SetPageHeader';
import { PageSkeleton, NoHousehold } from '../helpers';

export default function RegimensPage() {
  const { householdId, isLoading: sessionLoading } = useApi();

  if (sessionLoading) {
    return (
      <>
        <SetPageHeader
          title="Regimens"
          subtitle="Daily medication schedules"
          crumbs={['Medicines', 'Regimens']}
        />
        <PageSkeleton />
      </>
    );
  }

  if (!householdId) {
    return (
      <>
        <SetPageHeader
          title="Regimens"
          subtitle="Daily medication schedules"
          crumbs={['Medicines', 'Regimens']}
        />
        <NoHousehold />
      </>
    );
  }

  return (
    <>
      <SetPageHeader
        title="Regimens"
        subtitle="Daily medication schedules"
        crumbs={['Medicines', 'Regimens']}
      />
      <div className="mt-page">
        <RegimensTab householdId={householdId} />
      </div>
    </>
  );
}
