import type { Meta, StoryObj } from '@storybook/react'
import { Button } from '../Button'
import { PageNotFound } from './PageNotFound'

const meta = {
  title: 'Blocks/PageNotFound',
  component: PageNotFound,
  parameters: {
    layout: 'centered',
  },
  argTypes: {
    customLink: {
      control: false,
      table: {
        type: { summary: 'React.ReactNode' },
      },
    },
  },
} satisfies Meta<typeof PageNotFound>

export default meta

type Story = StoryObj<typeof meta>

export const Default: Story = {
  render: (_args) => <PageNotFound />,
  parameters: {
    nextjs: {
      appDirectory: true,
    },
  },
}

export const WithCustomLink: Story = {
  render: (_args) => (
    <PageNotFound
      customLink={<Button variant="secondary">Back to dashboard</Button>}
    />
  ),
  parameters: {
    docs: {
      description: {
        story:
          'Use customLink when the 404 screen should return to an app-specific destination instead of the site root.',
      },
    },
    nextjs: {
      appDirectory: true,
    },
  },
}