import type { Meta, StoryObj } from '@storybook/react';
import { UnverifiedProviderStep } from './UnverifiedProviderStep';
import type { RecommendedProvider, ProviderDetail } from './UnverifiedProviderStep';
import { Navigation } from '../../organisms/Navigation';
import Box from '@mui/material/Box';

// ─── Helpers ─────────────────────────────────────────────────────────────────

const FALogo = () => (
  <Box sx={{ display: 'flex', alignItems: 'center' }}>
    <Box
      component="img"
      src="/brandlogo/logo-full.svg"
      alt="Funeral Arranger"
      sx={{ height: 28, display: { xs: 'none', md: 'block' } }}
    />
    <Box
      component="img"
      src="/brandlogo/logo-short.svg"
      alt="Funeral Arranger"
      sx={{ height: 28, display: { xs: 'block', md: 'none' } }}
    />
  </Box>
);

const nav = (
  <Navigation
    logo={<FALogo />}
    items={[
      { label: 'FAQ', href: '/faq' },
      { label: 'Contact Us', href: '/contact' },
      { label: 'Log in', href: '/login' },
    ]}
  />
);

const knownDetails: ProviderDetail[] = [
  { label: 'Estimated pricing', value: 'From approximately $750' },
  { label: 'Services', value: 'Cremation, Service & Cremation, Burial' },
  { label: 'Service area', value: 'Wollongong & surrounding suburbs' },
];

const minimalDetails: ProviderDetail[] = [
  { label: 'Estimated pricing', value: 'From approximately $750' },
];

const recommendedProviders: RecommendedProvider[] = [
  {
    id: 'parsons',
    name: 'H.Parsons Funeral Directors',
    location: 'Wentworth, NSW',
    imageUrl: 'https://placehold.co/600x200/E8E0D6/8B6F47?text=H.Parsons',
    logoUrl: 'https://placehold.co/64x64/FEF9F5/BA834E?text=HP',
    rating: 4.6,
    reviewCount: 7,
    startingPrice: 900,
  },
  {
    id: 'rankins',
    name: 'Rankins Funeral Services',
    location: 'Wollongong, NSW',
    imageUrl: 'https://placehold.co/600x200/D7E1E2/4C5B6B?text=Rankins',
    logoUrl: 'https://placehold.co/64x64/F2F5F6/4C5B6B?text=R',
    rating: 4.8,
    reviewCount: 23,
    startingPrice: 1200,
  },
];

// ─── Meta ────────────────────────────────────────────────────────────────────

const meta: Meta<typeof UnverifiedProviderStep> = {
  title: 'Pages/UnverifiedProviderStep',
  component: UnverifiedProviderStep,
  tags: ['autodocs'],
  parameters: {
    layout: 'fullscreen',
  },
};

export default meta;
type Story = StoryObj<typeof UnverifiedProviderStep>;

// ─── With known details + recommendations ───────────────────────────────────

/** Full data — pricing, services, and verified alternatives */
export const Default: Story = {
  args: {
    providerName: 'Wollongong City Funerals',
    providerLocation: 'Wollongong, NSW',
    providerRating: 4.2,
    providerReviewCount: 15,
    details: knownDetails,
    recommendations: recommendedProviders,
    recommendationContext: 'near Wollongong',
    onEnquire: () => alert('Enquiry submitted'),
    onSelectRecommendation: (id) => alert(`Navigate to provider: ${id}`),
    onBack: () => alert('Back to providers'),
    navigation: nav,
  },
};

// ─── Minimal data ───────────────────────────────────────────────────────────

/** Only rough pricing available — no services, no reviews */
export const MinimalData: Story = {
  args: {
    providerName: 'Botanical Funerals',
    providerLocation: 'Newtown, NSW',
    details: minimalDetails,
    recommendations: recommendedProviders,
    recommendationContext: 'near Newtown',
    onEnquire: () => alert('Enquiry submitted'),
    onSelectRecommendation: (id) => alert(`Navigate to provider: ${id}`),
    onBack: () => alert('Back to providers'),
    navigation: nav,
  },
};

// ─── No data at all ─────────────────────────────────────────────────────────

/** No scraped data — just the name and location */
export const NoData: Story = {
  args: {
    providerName: 'Smith & Sons Funerals',
    providerLocation: 'Penrith, NSW',
    recommendations: recommendedProviders,
    recommendationContext: 'near Penrith',
    onEnquire: () => alert('Enquiry submitted'),
    onSelectRecommendation: (id) => alert(`Navigate to provider: ${id}`),
    onBack: () => alert('Back to providers'),
    navigation: nav,
  },
};

// ─── No recommendations ─────────────────────────────────────────────────────

/** No verified alternatives available for this area */
export const NoRecommendations: Story = {
  args: {
    providerName: 'Wollongong City Funerals',
    providerLocation: 'Wollongong, NSW',
    providerRating: 4.2,
    providerReviewCount: 15,
    details: knownDetails,
    onEnquire: () => alert('Enquiry submitted'),
    onBack: () => alert('Back to providers'),
    navigation: nav,
  },
};
