import * as React from 'react'
import * as Styled from './index.style'

import {
  Props,
  State
} from './type'
import { TemplateActivityContext } from '../common/template-context'
import LiveList from './live-list'


export class TemplateActivityLiveList extends React.Component<Props, State> {
  static defaultProps = new Props()

  state = new State()

  static contextType = TemplateActivityContext
  context: React.ContextType<typeof TemplateActivityContext>

  public render() {
    const {
      isEdit,
      style: oriStyle,
      type,
      descriptionColor,
      titleColor,
      nickNameColor
    } = this.props
    const style = { ...oriStyle }
    return (
      <div style={style}>
        {
          this.context === null && isEdit
            ? (
              <Styled.EmptyContainer>
                请添加该组件至 [模板活动-容器]中
              </Styled.EmptyContainer>
            )
            : this.context?.activityInfo?.actEventInfo.livesConfig.length > 0 || !isEdit
              ? (
                <LiveList
                  data={this.context?.activityInfo?.actEventInfo?.livesConfig || []}
                  isEdit={isEdit}
                  loading={this.context?.isLoading}
                  status={this.context?.activityInfo?.lives || []}
                  type={type}
                  style={style}
                  descriptionColor={descriptionColor}
                  titleColor={titleColor}
                  nickNameColor={nickNameColor}
                />
              )
              : (
                <Styled.EmptyContainer>
                  该模板活动未配置作品展示模块
                </Styled.EmptyContainer>
              )
        }
      </div>
    )
  }
}