import { Meta, Story } from '@storybook/react';
import React from 'react';
import { RPGUIRoot } from '../../../components/RPGUI/RPGUIRoot';
import {
  ISkillContainerProps,
  SkillsContainer,
} from '../../../components/SkillsContainer';
import atlasJSON from '../../../mocks/atlas/items/items.json';
import atlasIMG from '../../../mocks/atlas/items/items.png';
import { skillMock } from '../../../mocks/skills.mocks';

const meta: Meta = {
  title: 'Character/Skills/Skills Container',
  component: SkillsContainer,
};

export default meta;

const Template: Story<ISkillContainerProps> = args => (
  <RPGUIRoot>
    <SkillsContainer
      {...args}
      skill={skillMock}
      onCloseButton={() => console.log('close skill container')}
      atlasIMG={atlasIMG}
      atlasJSON={atlasJSON}
    />
  </RPGUIRoot>
);

export const Default = Template.bind([]);

Default.args = {
  skill: skillMock,
};
