import {
  // handleSchemaLayout,
  parseSchemaFromBackend
} from '@graphpolaris/schema/schema-usecases';
import {
  store
} from '@graphpolaris/shared/data-access/store';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';
import { Provider } from 'react-redux';
import Schema from './schema';

export default {
  /* 👇 The title prop is optional.
   * See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
   * to learn how to generate automatic titles
   */
  title: 'Schema',
  component: Schema,
  decorators: [
    (story) => (
      <div style={{ padding: '3rem' }}>
        <Provider store={store}>{story()}</Provider>
      </div>
    ),
  ],
} as ComponentMeta<typeof Schema>;

const Template: ComponentStory<typeof Schema> = (args) => <Schema {...args} />;

// // A super-simple mock of a redux store
// const Mockstore = configureStore({
//   reducer: {
//     schema: schemaSlice,
//   },
// });

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

TestWithSchema.play = async () => {
  const dispatch = store.dispatch;

  const schema = parseSchemaFromBackend({
    nodes: [
      {
        name: 'Thijs',
        attributes: [],
      },
      {
        name: 'Airport',
        attributes: [
          { name: 'city', type: 'string' },
          { name: 'vip', type: 'bool' },
          { name: 'state', type: 'string' },
        ],
      },
      {
        name: 'Airport2',
        attributes: [
          { name: 'city', type: 'string' },
          { name: 'vip', type: 'bool' },
          { name: 'state', type: 'string' },
        ],
      },
      {
        name: 'Plane',
        attributes: [
          { name: 'type', type: 'string' },
          { name: 'maxFuelCapacity', type: 'int' },
        ],
      },
      { name: 'Staff', attributes: [] },
    ],
    edges: [
      {
        name: 'Airport2:Airport',
        from: 'Airport2',
        to: 'Airport',
        collection: 'flights',
        attributes: [
          { name: 'arrivalTime', type: 'int' },
          { name: 'departureTime', type: 'int' },
        ],
      },
      {
        name: 'Airport:Staff',
        from: 'Airport',
        to: 'Staff',
        collection: 'flights',
        attributes: [{ name: 'salary', type: 'int' }],
      },
      {
        name: 'Plane:Airport',
        from: 'Plane',
        to: 'Airport',
        collection: 'flights',
        attributes: [],
      },
      {
        name: 'Airport:Thijs',
        from: 'Airport',
        to: 'Thijs',
        collection: 'flights',
        attributes: [{ name: 'hallo', type: 'string' }],
      },
      {
        name: 'Thijs:Airport',
        from: 'Thijs',
        to: 'Airport',
        collection: 'flights',
        attributes: [{ name: 'hallo', type: 'string' }],
      },
      {
        name: 'Staff:Plane',
        from: 'Staff',
        to: 'Plane',
        collection: 'flights',
        attributes: [{ name: 'hallo', type: 'string' }],
      },
      {
        name: 'Staff:Airport2',
        from: 'Staff',
        to: 'Airport2',
        collection: 'flights',
        attributes: [{ name: 'hallo', type: 'string' }],
      },
      {
        name: 'Airport2:Plane',
        from: 'Airport2',
        to: 'Plane',
        collection: 'flights',
        attributes: [{ name: 'hallo', type: 'string' }],
      },

      {
        name: 'Airport:Airport',
        from: 'Airport',
        to: 'Airport',
        collection: 'flights',
        attributes: [{ name: 'test', type: 'string' }],
      },
    ],
  });

  //dispatch(setSchema(schema));
  // handleSchemaLayout(schema);
};