import type { Meta, StoryObj } from "@storybook/svelte";
import BlobViewer from "../components/display/BlobViewer.svelte";
import {
  audioAddress,
  imageAddress,
  imageVerticalAddress,
  stlAddress,
  videoAddress,
  videoVerticalAddress,
} from "./common";

const meta: Meta<BlobViewer> = {
  title: "Blobs/BlobViewer",
  component: BlobViewer,
  tags: ["autodocs"],
  args: {
    editable: false,
  },
  argTypes: {
    detail: {
      control: {
        type: "boolean",
      },
    },
    editable: {
      control: {
        type: "boolean",
        default: false,
      },
    },
  },
};

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

export const Image: Story = {
  args: { address: imageAddress },
};

export const ImageVertical: Story = {
  args: { address: imageVerticalAddress },
};

export const Audio: Story = {
  args: { address: audioAddress },
};

export const Video: Story = {
  args: { address: videoAddress },
};

export const VideoVertical: Story = {
  args: { address: videoVerticalAddress },
};

export const Model3d: Story = {
  args: { address: stlAddress },
};