Skip to content
Snippets Groups Projects
GrdfBill.tsx 1.26 KiB
Newer Older
  • Learn to ignore specific revisions
  • import Button from '@material-ui/core/Button'
    import GasBillIcon from 'assets/icons/visu/onboarding/gas_bill.svg'
    import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
    import { useI18n } from 'cozy-ui/transpiled/react/I18n'
    import React from 'react'
    import { decoreText } from 'utils/decoreText'
    import '../connection.scss'
    
    interface GrdfBillProps {
      togglePartnerConnectionModal: () => void
    }
    
    const GrdfBill = ({ togglePartnerConnectionModal }: GrdfBillProps) => {
      const { t } = useI18n()
    
      return (
        <div className="connection-form">
          <p className={'connection-form-title grdfgrandlyon text-20-bold'}>
            {t('auth.grdfgrandlyon.no_account.title')}
          </p>
          <StyledIcon icon={GasBillIcon} size={180} />
          <p className={'connection-form-subtitle grdfgrandlyon text-16-regular'}>
            {decoreText(t('auth.grdfgrandlyon.bill'))}
          </p>
    
          <div className="connection-form-button">
            <Button
              aria-label={t('auth.grdfgrandlyon.accessibility.connect')}
              onClick={togglePartnerConnectionModal}
              classes={{
                root: 'btn-highlight',
                label: 'text-16-bold',
              }}
            >
              {t('auth.grdfgrandlyon.connect')}
            </Button>
          </div>
        </div>
      )
    }
    
    export default GrdfBill