import React from 'react';
// eslint-disable-next-line import/no-extraneous-dependencies
import {
  Title,
  Description,
  Primary,
  PRIMARY_STORY,
  ArgsTable,
} from '@storybook/addon-docs/blocks';
import MainProvider from 'gatsby-core-theme/src/context/MainProvider';
import logoImg from '../../../../storybook-images/logo.svg';
import CookieModal from '.';

export default {
  title: 'Theme/Layout/Cookie/Settings/Template One',
  component: CookieModal,
  args: {
    translations: {
      privacy_preference_title: 'Privacy Preference Center',
      privacy_preference_text:
        "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged",
      neccesary_cookie_title: 'Necessary',
      neccesary_cookie_text: 'Lorem Ipsum',
      analytical_cookie_title: 'Analytical And Stadistical',
      analytical_cookie_text: 'Lorem Ipsum',
      marketing_cookie_title: 'Marketing',
      marketing_cookie_text: 'Lorem Ipsum',
    },
    cookieLink: {
      title: 'Cookie Consent Text',
      path: '/cookie',
    },
  },
  argTypes: {},
  parameters: {
    docs: {
      description: {
        component: 'A component that displays Cookie Modal',
      },
      page: () => (
        <>
          <Title />
          <Description />
          <Primary />
          <ArgsTable story={PRIMARY_STORY} />
        </>
      ),
    },
  },
};

const Template = (args) => (
  <MainProvider
    value={{
      translations: args?.translations,
    }}
  >
    <CookieModal {...args} />
  </MainProvider>
);
export const Default = Template.bind({});
Default.args = {
  logo: logoImg,
};
