import React from 'react';
{{#if typescript}}import { Story, Meta } from '@storybook/react/types-6-0';{{/if}}
import {{#if export~}} { {{ name }} } {{else~}} {{ name }} {{~/if}} from './index';
{{#if hasApollo}}
{{#if typescript}}
import { {{#if notest}}GET_{{nameUppercase}}_QUERY, {{/if}}{{name}}ApolloProps } from './{{ name }}.apollo';
{{else}}
{{#if notest}}import { GET_{{nameUppercase}}_QUERY } from './{{ name }}.apollo';{{/if}}
{{/if}}
import { {{ name }}ErrorMocks, {{ name }}SuccessMocks } from './{{ name }}.mocks';
{{/if}}
{{#unless hasApollo}}
{{#if typescript}}import { {{ name }}{{patternName}}Props } from './{{name}}{{patternFile}}';{{/if}}
{{/unless}}
{{#if apolloLink}}
import { {{ apolloLinkName }} } from '{{ apolloLinkPath }}';
{{/if}}

export default {
  component: {{ name }},
  title: '{{contextPath}}'
}{{#if typescript}} as Meta{{/if}};

const Template{{#if typescript}}: Story<{{~name}}{{patternName}}Props>{{/if}} = {{#if typescript~}} (args: {{name}}{{patternName}}Props){{~else~}} args{{/if}} => <{{name}} {...args} />;

export const DefaultState = Template.bind({});
{{#if hasApollo}}
export const LoadingState = Template.bind({});
export const ErrorState = Template.bind({});
{{/if}}

DefaultState.args {{~#if hasApollo}} = LoadingState.args = ErrorState.args {{~/if}} = {
{{~#if hasApollo}}
  id: '1'
{{~/if~}}
};

{{#if hasApollo}}
DefaultState.parameters = {
  apolloClient: {
    mocks: {{ name }}SuccessMocks
  }
};

LoadingState.parameters = {
  apolloClient: {
    mocks: {{#if apolloLink}}new {{ apolloLinkName }}(){{else}}[]{{/if}}
  }
};

ErrorState.parameters = {
  apolloClient: {
    mocks: {{ name }}ErrorMocks
  }
};
{{~/if~}}