import type { Meta, StoryObj } from "@storybook/react"
import { ErrorReport } from "./error-report"

const meta: Meta<typeof ErrorReport> = {
  title: "Widgets/Support/ErrorReport",
  component: ErrorReport,
  parameters: {
    layout: "centered",
  },
  tags: ["autodocs"],
  argTypes: {
    variant: {
      control: "radio",
      options: ["popover", "modal"],
    },
    side: {
      control: "radio",
      options: ["top", "bottom", "left", "right"],
    },
    showSeverity: { control: "boolean" },
  },
}

export default meta
type Story = StoryObj<typeof ErrorReport>

export const Default: Story = {
  args: {
    onSubmit: async (data) => {
      console.log("Error report submitted:", data)
      await new Promise((resolve) => setTimeout(resolve, 500))
    },
  },
}

export const Popover: Story = {
  args: {
    variant: "popover",
    onSubmit: async (data) => {
      console.log("Error report submitted:", data)
      await new Promise((resolve) => setTimeout(resolve, 500))
    },
  },
}

export const WithErrorDetails: Story = {
  args: {
    errorDetails: {
      message: "Cannot read property 'map' of undefined",
      code: "TypeError",
      stack: `TypeError: Cannot read property 'map' of undefined
    at UserList (UserList.tsx:15:23)
    at renderWithHooks (react-dom.development.js:14985:18)
    at mountIndeterminateComponent (react-dom.development.js:17811:13)`,
    },
    onSubmit: async (data) => {
      console.log("Error report with details:", data)
      await new Promise((resolve) => setTimeout(resolve, 500))
    },
  },
}