import React from 'react'
import { Empty } from 'atoms/Empty'
import { CopyrightSection, Logo, SeperatorElement, Text } from './styled'
import { CopyrightProps } from './typings'

function renderWrap(props: CopyrightProps) {
  const { className, clientInfo, seperator, reservedContent } = props
  return (
    <CopyrightSection className={className}>
      {clientInfo}
      {seperator}
      {reservedContent}
    </CopyrightSection>
  )
}
function renderClientInfo(props: CopyrightProps) {
  const { copyrightLogo, color } = props
  return <Logo color={color}>{copyrightLogo}</Logo>
}
function renderSeperator(props: CopyrightProps) {
  const { color } = props
  return <SeperatorElement color={color}>|</SeperatorElement>
}
function renderReservedText(props: CopyrightProps) {
  const { copyrightText, color } = props
  return <Text color={color}>{copyrightText}</Text>
}

export { renderWrap, renderClientInfo, renderSeperator, renderReservedText }