import { LiveBlogPost } from '../components/LiveBlogPost'
import type { LiveBlogPostProps } from '../components/LiveBlogPost'
import React from 'react'
import './LiveBlogPost.stories.scss'

export default {
  title: 'LiveBlogPost',
  component: LiveBlogPost,
  content: {},
  argTypes: {
    'indicators.isOpinion': {
      control: 'boolean',
      name: 'Is Opinion',
    },
  },
}

const args: Omit<LiveBlogPostProps, 'byline'> = {
  id: '',
  postId: '', // Remove once wordpress is no longer in use
  title: 'Ukraine hails new security architecture after German accord',
  content: '', // Remove once wordpress is no longer in use
  bodyHTML: '', //ElasticSearch
  body: '', // cp-content-pipeline
  publishedTimestamp: '', // Remove once wordpress is no longer in use
  publishedDate: '2024-02-16T14:24:00',
  articleUrl: '',
  showShareButtons: true,
  showShareLinkButton: true,
  ad: '',
  indicators: {
    isOpinion: true,
  },
  isPinned: false,
  authors: [],
}

const bylineWithoutAuthor = {
  byline: {
    tree: {
      type: 'root',
      children: [
        {
          type: 'text',
          value: 'James Politi in Nashua, New Hampshire',
        },
      ],
    },
  },
}

export const Default = () => <LiveBlogPost {...args} {...bylineWithoutAuthor} />

const bylineWithAuthor = {
  byline: {
    tree: {
      type: 'root',
      children: [
        {
          type: 'author-link',
          href: 'https://www.ft.com/stream/d24990d1-2aec-4d72-8330-cb1c73532f49',
          children: [
            {
              type: 'text',
              value: 'Rana Foroohar',
            },
          ],
        },
        {
          type: 'text',
          value: ' in New York',
        },
      ],
    },
  },
}

export const WithAuthorLink = () => (
  <LiveBlogPost {...args} {...bylineWithAuthor} />
)

const bylineWithMoreAuthors = {
  byline: {
    tree: {
      type: 'root',
      children: [
        {
          type: 'author-link',
          href: 'https://www.ft.com/stream/5b0d2689-dc84-44fb-a190-da04230953bf',
          children: [
            {
              type: 'text',
              value: 'Oliver Ralph',
            },
          ],
        },
        {
          type: 'text',
          value: ', ',
        },
        {
          type: 'author-link',
          href: 'https://www.ft.com/stream/a4fb521e-f3cc-45e1-a6a1-2c3fe0921e73',
          children: [
            {
              type: 'text',
              value: 'Jaren Kerr',
            },
          ],
        },
        {
          type: 'text',
          value: ', ',
        },
        {
          type: 'author-link',
          href: 'https://www.ft.com/stream/0a9c402e-69c0-44d7-8ac5-721bc6653ab1',
          children: [
            {
              type: 'text',
              value: 'Peter Wells',
            },
          ],
        },
        {
          type: 'text',
          value: ' and ',
        },
        {
          type: 'author-link',
          href: 'https://www.ft.com/stream/c9655dda-8206-492b-b553-a09d0dadb60f',
          children: [
            {
              type: 'text',
              value: 'Alexandra White',
            },
          ],
        },
        {
          type: 'text',
          value: ' in New York and ',
        },
        {
          type: 'author-link',
          href: 'https://www.ft.com/stream/33377752-5f82-43b8-b786-0a7c63569b4a',
          children: [
            {
              type: 'text',
              value: 'Steff Chávez',
            },
          ],
        },
        {
          type: 'text',
          value: ' in Chicago',
        },
      ],
    },
  },
}

export const WithMoreAuthorLinks = () => (
  <LiveBlogPost {...args} {...bylineWithMoreAuthors} />
)