import { TemsModal, type TemsModalProps } from "@components/modal/tems-modal";
import { Mocks } from "@startinblox/solid-tems-shared";
import type { Meta, StoryObj } from "@storybook/web-components";
import { html } from "lit";

const meta: Meta<TemsModalProps> = {
  title: "components/modal/tems-modal",
  tags: ["autodocs", "!dev", "Organisms"],
  render: (args) => {
    new TemsModal();

    return html`<tems-modal .object=${args.object}></tems-modal>`;
  },
  args: {
    object: undefined,
  },
  argTypes: {
    object: {
      control: false,
    },
  },
};

export default meta;

export type TemsModalStory = StoryObj<TemsModalProps>;

export const Object_3dObject: TemsModalStory = {
  args: {
    object: Mocks.objects.object3D.get_random_3DObject({
      imageCount: 3,
      keepImage: true,
      imageAsIframe: false,
    }),
  },
};

export const Object_CivilSociety: TemsModalStory = {
  args: {
    object: Mocks.objects.mediaobjects.civilSociety.get_random_civilSocietyObject({
      imageCount: 4,
      keepImage: true,
      imageAsIframe: false,
    }),
  },
};

export const Object_FactChecking: TemsModalStory = {
  args: {
    object: Mocks.objects.mediaobjects.factChecking.get_random_factCheckingObject({
      imageCount: 1,
      keepImage: true,
      imageAsIframe: false,
    }),
  },
};

export const Object_InteractiveInfographics: TemsModalStory = {
  args: {
    object: Mocks.objects.mediaobjects.interactiveInfographics.get_random_interactiveInfographicsObject({
      imageCount: 2,
      keepImage: true,
      imageAsIframe: false,
    }),
  },
};

export const Object_Stories: TemsModalStory = {
  args: {
    object: Mocks.objects.mediaobjects.stories.get_random_storiesObject({
      imageCount: 1,
      keepImage: true,
      imageAsIframe: true,
    }),
  },
};

export const NoImageObject: TemsModalStory = {
  args: {
    object: Mocks.objects.object3D.get_random_3DObject({ imageCount: 0, keepImage: true }),
  },
};

export const DataOffer: TemsModalStory = {
  args: {
    object: Mocks.dataOffer.get_random_dataOffer(),
  },
};

export const Service: TemsModalStory = {
  args: {
    object: Mocks.service.get_random_service(),
  },
};

export const Provider: TemsModalStory = {
  args: {
    object: Mocks.provider.get_random_provider(),
  },
};