import type { Meta, StoryObj } from '@storybook/sveltekit';
import OrganisationCard from './OrganisationCard.svelte';
import type { OrganisationEntry } from '$lib/block-types';

const LOGO =
  'https://cms.pm86.de/api/assets/pages/img_2814-ar4x2.webp?_environment=windwiderstand';

const base: OrganisationEntry = {
  name: 'BI Steigerwald',
  description:
    'Bürgerinitiative gegen überdimensionierte Windkraftplanung im Steigerwald. Aktiv seit 2021.',
  link: { url: 'https://example.org' },
};

const meta = {
  title: 'Molecules/OrganisationCard',
  component: OrganisationCard,
  tags: ['autodocs'],
  parameters: { layout: 'centered' },
  argTypes: {
    compact: { control: 'boolean' },
  },
} satisfies Meta<typeof OrganisationCard>;

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

// Logo aus CMS.
export const MitLogo: Story = {
  args: { org: { ...base, logo: { src: LOGO } } },
};

// Ohne Logo → Fisch-Fallback.
export const FischFallback: Story = {
  args: { org: { ...base, logo: undefined } },
};

// Badge oben rechts + Social-Chips.
export const BadgeUndSocial: Story = {
  args: {
    org: {
      ...base,
      logo: { src: LOGO },
      badge: { label: 'Neu', color: 'green' },
      whatsapp: 'https://chat.whatsapp.com/xyz',
      youtube: 'https://youtube.com/@example',
    },
  },
};

// Kompakt: Logo links, kein Social, dichteres Grid.
export const Kompakt: Story = {
  args: { org: { ...base, logo: { src: LOGO } }, compact: true },
};