import React from "react";
import { SmartImageSlide } from "../components";
import { mockSmartImageSlide } from "../../__MOCK__/mockSmartImage";

export default {
  title: "page-ui/SmartImageSlide",
  component: SmartImageSlide,
};

const Template = (args) => <SmartImageSlide {...args} />;

export const Default = Template.bind({});
Default.args = {
  data: mockSmartImageSlide,
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};
export const DefaultFull = Template.bind({});
DefaultFull.args = {
  data: {
    "type": "smart_image",
    "order": 11,
    "column": 1,
    "metaData": {
      "subType": "slide",
      "images": [
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "68483736d31b14c5735f5f692f0444cf.png",
          "path": "image/68483736d31b14c5735f5f692f0444cf.png",
          "alt": " ",
          "title": "",
          "desc": "",
          "action": "none",
          "url": "",
          "target": "_blank",
          "positionText": "bottom",
          "isTextTitle": 1,
          "isTextDesc": 1,
          "shopId": 47,
          "albumId": 49,
          "size": 0.010822,
          "counter": 0,
          "lastUsed": null,
          "status": "show",
          "dimensions": {
            "width": 125,
            "height": 66
          },
          "trashAt": null,
          "deleted": 0,
          "_id": "653a93764e0ead00115289bb",
          "name": "B5.png(1)",
          "type": "image",
          "systemPath": "/var/www/data/media-server/6344f9a4ef4db1fee297c4eb/image/1/653a9376b6ac07d5cc5a3c1b/68483736d31b14c5735f5f692f0444cf.png",
          "createdBy": 83,
          "updatedBy": 83,
          "orgId": 29,
          "createdAt": "2023-10-26T16:27:34.944Z",
          "updatedAt": "2023-10-26T16:27:34.944Z",
          "id": 4080,
          "__v": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "729adea6ef966d2eb5d62eb3ccfde0bc.png",
          "path": "image/729adea6ef966d2eb5d62eb3ccfde0bc.png",
          "alt": " ",
          "title": "",
          "desc": "",
          "action": "none",
          "url": "",
          "target": "_blank",
          "positionText": "bottom",
          "isTextTitle": 1,
          "isTextDesc": 1,
          "shopId": 47,
          "albumId": 49,
          "size": 0.5967549999999999,
          "counter": 0,
          "lastUsed": null,
          "status": "show",
          "dimensions": {
            "width": 1560,
            "height": 870
          },
          "trashAt": null,
          "deleted": 0,
          "_id": "63d8e4eba7e6db0011ffe359",
          "name": "post1.png",
          "type": "image",
          "systemPath": "/var/www/data/media-server/6344f9a4ef4db1fee297c4eb/image/1/63d8e4eb150ebbb1ba6f2249/729adea6ef966d2eb5d62eb3ccfde0bc.png",
          "createdBy": 12,
          "updatedBy": 12,
          "createdAt": "2023-01-31T09:52:43.688Z",
          "updatedAt": "2023-03-02T11:06:21.957Z",
          "id": 963,
          "__v": 0,
          "orgId": 29
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "531bb470f5231071b9f77dcae892ac38.png",
          "path": "image/531bb470f5231071b9f77dcae892ac38.png",
          "alt": " ",
          "title": "",
          "desc": "",
          "action": "none",
          "url": "",
          "target": "_blank",
          "positionText": "bottom",
          "isTextTitle": 1,
          "isTextDesc": 1,
          "shopId": 47,
          "albumId": 45,
          "size": 4.774954999999999,
          "counter": 0,
          "lastUsed": null,
          "status": "show",
          "dimensions": {
            "width": 1720,
            "height": 2030
          },
          "trashAt": null,
          "deleted": 0,
          "_id": "63d8e5e9a7e6db0011ffe360",
          "name": "post1.png",
          "type": "image",
          "systemPath": "/var/www/data/media-server/6344f9a4ef4db1fee297c4eb/image/1/63d8e5e8150ebbb1ba6f2265/531bb470f5231071b9f77dcae892ac38.png",
          "createdBy": 12,
          "updatedBy": 12,
          "createdAt": "2023-01-31T09:56:57.154Z",
          "updatedAt": "2023-03-02T11:06:21.957Z",
          "id": 970,
          "__v": 0,
          "orgId": 29
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "73004300f26e37395a77c9f37ac13b5d.png",
          "path": "image/73004300f26e37395a77c9f37ac13b5d.png",
          "alt": " ",
          "title": "",
          "desc": "",
          "action": "none",
          "url": "",
          "target": "_blank",
          "positionText": "bottom",
          "isTextTitle": 1,
          "isTextDesc": 1,
          "shopId": 47,
          "albumId": 41,
          "size": 0.446584,
          "counter": 0,
          "lastUsed": null,
          "status": "show",
          "dimensions": {
            "width": 514,
            "height": 514
          },
          "trashAt": null,
          "deleted": 0,
          "_id": "653a86594e0ead0011521b9b",
          "name": "G-7.png",
          "type": "image",
          "systemPath": "/var/www/data/media-server/6344f9a4ef4db1fee297c4eb/image/1/653a8658b6ac07d5cc5a3b7d/73004300f26e37395a77c9f37ac13b5d.png",
          "createdBy": 83,
          "updatedBy": 83,
          "orgId": 29,
          "createdAt": "2023-10-26T15:31:37.277Z",
          "updatedAt": "2023-10-26T15:31:37.277Z",
          "id": 4065,
          "__v": 0
        },
        {
          "alt": " ",
          "title": "",
          "desc": "",
          "action": "none",
          "url": "",
          "target": "_blank",
          "positionText": "bottom",
          "isTextTitle": 1,
          "isTextDesc": 1,
          "shopId": 47,
          "albumId": 74,
          "size": 1.6895989999999999,
          "host": "https://secure-media.saranros.com/",
          "counter": 0,
          "lastUsed": null,
          "status": "show",
          "dimensions": {
            "width": 1920,
            "height": 342
          },
          "trashAt": null,
          "deleted": 0,
          "_id": "6538a8234e0ead00114cf7a6",
          "name": "Mcneto_website_SectionTutorial_01.png(1)",
          "type": "image",
          "path": "image/0c1c4f87-35cc-4d52-b0a8-10c63e64ed0f.png",
          "fileName": "0c1c4f87-35cc-4d52-b0a8-10c63e64ed0f.png",
          "systemPath": "/var/www/data/media-server/6344f9a4ef4db1fee297c4eb/image/1/6538a822f242bad0f762aaf4/0c1c4f87-35cc-4d52-b0a8-10c63e64ed0f.png",
          "createdBy": 83,
          "updatedBy": 83,
          "orgId": 29,
          "createdAt": "2023-10-25T05:31:15.113Z",
          "updatedAt": "2023-10-25T05:31:15.113Z",
          "id": 4000,
          "__v": 0
        },
        {
          "alt": " ",
          "title": "",
          "desc": "",
          "action": "none",
          "url": "",
          "target": "_blank",
          "positionText": "bottom",
          "isTextTitle": 1,
          "isTextDesc": 1,
          "shopId": null,
          "albumId": 83,
          "size": 0.113663,
          "host": "https://secure-media.saranros.com/",
          "counter": 0,
          "lastUsed": null,
          "status": "show",
          "dimensions": {
            "width": 1092,
            "height": 2160
          },
          "trashAt": null,
          "deleted": 0,
          "_id": "640aa61e46263c001145fb16",
          "name": "Mcneto_Website_BG_Package.jpg",
          "type": "image",
          "path": "image/7187aa80-5e8f-41a4-a2f4-cca07afb3e93.jpg",
          "fileName": "7187aa80-5e8f-41a4-a2f4-cca07afb3e93.jpg",
          "systemPath": "/var/www/data/media-server/6344f9a4ef4db1fee297c4eb/image/1/640aa61d150ebbb1ba6f96d5/7187aa80-5e8f-41a4-a2f4-cca07afb3e93.jpg",
          "createdBy": 83,
          "updatedBy": 83,
          "orgId": 29,
          "createdAt": "2023-03-10T03:38:06.389Z",
          "updatedAt": "2023-03-10T03:38:06.389Z",
          "id": 1446,
          "__v": 0
        }
      ],
      "repeat": 0,
      "display": "full",
      "isShowDot": 0,
      "grid": 1
    },
    "style": {
      "marginTop": 16,
      "marginBottom": 16,
      "marginLeft": 0,
      "marginRight": 0,
      "borderWidth": 1,
      "borderColor": "#000000",
      "borderStyle": "none",
      "borderRadius": 0,
      "align": "center",
      "activeTab": "color",
      "color": {},
      "isFullWidth": true,
      "isUseBackground": true
    }
  },
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};

export const DefaultCenterArrowGrid1Img1 = Template.bind({});
DefaultCenterArrowGrid1Img1.args = {
  data: {
    ...mockSmartImageSlide,
    metaData: {
      ...mockSmartImageSlide.metaData,
      grid:1,
      images: [
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        }
      ]
    }
  },
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};
export const DefaultCenterArrowGrid2Img1 = Template.bind({});
DefaultCenterArrowGrid2Img1.args = {
  data: {
    ...mockSmartImageSlide,
    metaData: {
      ...mockSmartImageSlide.metaData,
      grid:2,
      images: [
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/ecc8025b-6bb1-4af9-b584-94199c32465a.jpeg",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        }
      ]
    }
  },
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};
export const DefaultCenterArrowGrid3Img2 = Template.bind({});
DefaultCenterArrowGrid3Img2.args = {
  data: {
    ...mockSmartImageSlide,
    metaData: {
      ...mockSmartImageSlide.metaData,
      grid:3,
      images: [
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/ecc8025b-6bb1-4af9-b584-94199c32465a.jpeg",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        }
      ]
    }
  },
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};
export const DefaultCenterArrowGrid4Img2 = Template.bind({});
DefaultCenterArrowGrid4Img2.args = {
  data: {
    ...mockSmartImageSlide,
    metaData: {
      ...mockSmartImageSlide.metaData,
      grid:4,
      images: [
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/ecc8025b-6bb1-4af9-b584-94199c32465a.jpeg",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        }
      ]
    }
  },
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};
export const DefaultCenterArrowGrid1ImgDup = Template.bind({});
DefaultCenterArrowGrid1ImgDup.args = {
  data: {
    ...mockSmartImageSlide,
    metaData: {
      ...mockSmartImageSlide.metaData,
      grid:1,
      images: [
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        }
      ]
    }
  },
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};

export const DefaultCenterArrowGrid1ImgDupShowText = Template.bind({});
DefaultCenterArrowGrid1ImgDupShowText.args = {
  data: {
    ...mockSmartImageSlide,
    metaData: {
      ...mockSmartImageSlide.metaData,
      grid:1,
      images: [
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",
          'alt': "alt",
          'title': `title title`,
          'desc': 'desc desc desc',
          'action': "preview", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",
          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        }
      ]
    }
  },
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};

export const DefaultCenterArrowGrid1 = Template.bind({});
DefaultCenterArrowGrid1.args = {
  data: {
    ...mockSmartImageSlide,
    metaData: {
      ...mockSmartImageSlide.metaData,
      grid:1,
      images: [
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",

          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/ecc8025b-6bb1-4af9-b584-94199c32465a.jpeg",

          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        }
      ]
    }
  },
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};
export const DefaultCenterArrowGrid2 = Template.bind({});
DefaultCenterArrowGrid2.args = {
  data: {
    ...mockSmartImageSlide,
    metaData: {
      ...mockSmartImageSlide.metaData,
      grid:2,
      images: [
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",

          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/ecc8025b-6bb1-4af9-b584-94199c32465a.jpeg",

          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/c4a10ce4-836e-480b-919d-ca0f4b9c267d.png",

          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        },
        {
          "host": "https://secure-media.saranros.com/",
          "fileName": "a51c7c18-f8e1-4d7f-92a5-e89e830dd48c.png",
          "fileType": "image",
          "order": 1,
          'path': "image/ecc8025b-6bb1-4af9-b584-94199c32465a.jpeg",

          'alt': "alt",
          'title': ``,
          'desc': '',
          'action': "none", //"none" || preview || url
          'url': "#",
          'target': "_blank",//"_blank" || "self"
          'positionText': "under", //top || over|| under || none
          "isTextTitle": 0
        }
      ]
    }
  },
  isPreview: false,
  theme: { primary: "#000" },
  isDisableAction: true
};