Skip to content
Snippets Groups Projects
NewsletterReminder.tsx 1.78 KiB
Newer Older
  • Learn to ignore specific revisions
  • import { Button } from '@material-ui/core'
    import CloseIcon from 'assets/icons/ico/close.svg'
    import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
    import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n'
    import React from 'react'
    import { setHaveSeenNewsletterReminder } from 'store/analysis/analysis.slice'
    import { useAppDispatch } from 'store/hooks'
    import { updateProfile } from 'store/profile/profile.slice'
    import './newsletterReminder.scss'
    
    const NewsletterReminder = () => {
      const { t } = useI18n()
      const dispatch = useAppDispatch()
    
      return (
        <div className="newsletter-reminder">
          <StyledIconButton
            icon={CloseIcon}
            sized={18}
            onClick={() => dispatch(setHaveSeenNewsletterReminder(true))}
            aria-label={t('analysis.newsletter_reminder.close')}
            className="close-button"
          />
          <div className="text-container">
            <h2 className="title text-20-bold">
              {t('analysis.newsletter_reminder.title')}
            </h2>
            <p className="text-18-normal">
              {t('analysis.newsletter_reminder.text')}
            </p>
          </div>
          <div className="buttons">
            <Button
              className="btnPrimary"
              onClick={() =>
                dispatch(updateProfile({ sendAnalysisNotification: true }))
              }
            >
              {t('analysis.newsletter_reminder.button')}
            </Button>
            <Button
              classes={{
                root: 'btnText',
                label: 'text-16-normal stop-show',
              }}
              size="small"
              onClick={() =>
                dispatch(updateProfile({ isAnalysisReminderEnabled: false }))
              }
            >
              {t('analysis.newsletter_reminder.stop_showing')}
            </Button>
          </div>
        </div>
      )
    }
    
    export default NewsletterReminder