import React from 'react'
import { LogoIcon } from 'atoms/Icons/LogoIcon'
import { FooterProps } from './typings'
import {
  StyledCopyRight,
  StyledMultipleLinkList,
  StyledLabel,
  StyledSocialIconList,
} from './styled'

function defaultRenderLogo(props: FooterProps) {
  const {logoType, logoColor} = props

  if ( logoType !== '' && logoColor !== '') {
    return <LogoIcon type={logoType} fill={logoColor} />
  }
  else {
    return <LogoIcon type={'tgiant'} fill={'#ffffff'} />
  }
}

function defaultRenderCopyright(props: FooterProps) {
  const { copyrightData } = props
  return <StyledCopyRight {...copyrightData} />
}

function defaultRenderSocialIconLabel(props: FooterProps) {
  const { connectText } = props
  return <StyledLabel content={connectText} />
}

function defaultRenderSocialIcons(props: FooterProps) {
  const { listOfSocialIcons } = props
  return <StyledSocialIconList iconsList={listOfSocialIcons} />
}

function defaultRenderLinkList(props: FooterProps) {
  const { ListOfLinks } = props
  return <StyledMultipleLinkList list={ListOfLinks} />
}

export {
  defaultRenderLogo,
  defaultRenderCopyright,
  defaultRenderSocialIcons,
  defaultRenderLinkList,
  defaultRenderSocialIconLabel,
}