import { Icon } from 'features/Icon'

import { add } from 'date-fns'

import {
  ScBannerWrap,
  ScIconLogo,
  ScTitleWrap,
  ScTitle,
  ScNameOfCompany,
  ScDescribe,
  ScBtnDownload,
  ScIconWrap,
} from './styled'

type SmartBannerProps = {
  setIsOpenDownload: (open: boolean) => void,
}

export const SmartBanner = ({ setIsOpenDownload }: SmartBannerProps) => (
  <ScBannerWrap>
    <ScIconWrap>
      <Icon
        refIcon='Close'
        onClick={() => {
          localStorage.setItem(
            'dateLastOpenSmartBanner',
            JSON.stringify(add(new Date(), { days: 1 })),
          )
          setIsOpenDownload(false)
        }}
      />
    </ScIconWrap>
    <ScIconLogo src='/images/icon-instattv-smart-banner.svg' />
    <ScTitleWrap>
      <ScTitle>official InStat TV app</ScTitle>
      <ScNameOfCompany>InStat TV limited</ScNameOfCompany>
      <ScDescribe>InStat – the Home of Sports Streaming</ScDescribe>
    </ScTitleWrap>
    <a
      href='https://play.google.com/store/apps/details?id=instat.ott'
      target='_blank'
      rel='noreferrer'
      onClick={() => {
        localStorage.setItem(
          'dateLastOpenSmartBanner',
          JSON.stringify(add(new Date(), { days: 1 })),
        )
        setIsOpenDownload(false)
      }}
    >
      <ScBtnDownload>Download</ScBtnDownload>
    </a>
  </ScBannerWrap>
)