import { Meta, Story } from '@storybook/react';
import React from 'react';

import {
  CircularController,
  CircularControllerProps,
} from '../../../components/CircularController/CircularController';
import { RPGUIRoot } from '../../../components/RPGUI/RPGUIRoot';
import atlasJSON from '../../../mocks/atlas/items/items.json';
import atlasIMG from '../../../mocks/atlas/items/items.png';
import { itemContainerMock } from '../../../mocks/itemContainer.mocks';
import { shortcutMock } from '../../../mocks/shortcut.mocks';

const meta: Meta = {
  title: 'Features/Controllers/Circular Controller',
  component: CircularController,
};

export default meta;

const Template: Story<CircularControllerProps> = args => (
  <RPGUIRoot>
    <CircularController {...args} />
  </RPGUIRoot>
);

export const Default = Template.bind({});

Default.args = {
  shortcuts: shortcutMock,
  onShortcutClick: index => console.log(index),
  onActionClick: () => console.log('action'),
  onCancelClick: () => console.log('cancel attack'),
  mana: 100,
  inventory: itemContainerMock(),
  atlasJSON,
  atlasIMG,
};
