'use client';
import { useState } from 'react';
import type { NurseServiceVariant } from '@/services/catalog/types';
import MyServicesList from './MyServicesList';
import VariantBuilder from './VariantBuilder';

type BuilderState = { open: false } | { open: true; editing: NurseServiceVariant | null };

/**
 * Nurse **Services & prices** (the services half of B7). Switches in-page between the offerings list
 * and the variant builder (create/edit) — a stepper is roomier than a dialog, and colocating the
 * mode keeps the flow (list → build → back to list) simple with no extra routes. The `key` remounts
 * the builder so create/edit/another-variant each start from clean state.
 */
export default function NurseServicesPage() {
  const [builder, setBuilder] = useState<BuilderState>({ open: false });

  if (builder.open) {
    return (
      <VariantBuilder
        key={builder.editing?.id ?? 'new'}
        initial={builder.editing}
        onDone={() => setBuilder({ open: false })}
        onCancel={() => setBuilder({ open: false })}
      />
    );
  }

  return (
    <MyServicesList
      onAdd={() => setBuilder({ open: true, editing: null })}
      onEdit={(variant) => setBuilder({ open: true, editing: variant })}
    />
  );
}
