import React from 'react';
import { showcaseConverter } from '@times-components/storybook';

import { ArticleHarness } from '../../../../fixtures/article-harness/ArticleHarness';
import { OptaFootballStatsPageView } from './OptaFootballStatsPageView';

const showcase = {
  children: [
    {
      decorator: (storyFn: () => React.ReactNode) => (
        <ArticleHarness>{storyFn()}</ArticleHarness>
      ),
      type: 'decorator'
    },
    {
      component: () => (
        <OptaFootballStatsPageView competition="8" season="2025" isApp={true} />
      ),
      name: 'Player Stats Page View',
      type: 'story'
    },
    {
      component: () => (
        <OptaFootballStatsPageView
          competition="8"
          season="2025"
          widget="team_ranking"
          visible_categories="goals,shots,passing_accuracy,goals_conceded,fouls,cards_yellow,cards_red"
          isApp={true}
        />
      ),
      name: 'Team Stats Page View',
      type: 'story'
    }
  ],
  name: 'Typescript Component/In Article/Football/Player Stats Page View'
};

// @ts-ignore
showcaseConverter(module, showcase);