github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-28 22:03:16 -05:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #15917 from overleaf/msm-new-notification-common

Browse source 
[web] new notification style for dashboard common.tsx

GitOrigin-RevId: e80d1c754d850ad3e8a48cc6871c2d98bcaba452
This commit is contained in:
Miguel Serrano 2023-12-04 11:38:26 +01:00 committed by Copybot
parent b61f34c740
commit db5500cbe8
1 changed files with 144 additions and 126 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

270
services/web/frontend/js/features/project-list/components/notifications/groups/common.tsx
View file

@ -62,9 +62,11 @@ function CommonNotification({ notification }: CommonNotificationProps) {
return ( return (
<> <>
{templateKey === 'notification_project_invite' ? ( {templateKey === 'notification_project_invite' ? (
<Notification bsStyle="info" onDismiss={() => id && handleDismiss(id)}> <Notification
<Notification.Body> bsStyle="info"
{accepted ? ( onDismiss={() => id && handleDismiss(id)}
body={
accepted ? (
<Trans <Trans
i18nKey="notification_project_invite_accepted_message" i18nKey="notification_project_invite_accepted_message"
components={{ b: <b /> }} components={{ b: <b /> }}
@ -83,10 +85,10 @@ function CommonNotification({ notification }: CommonNotificationProps) {
shouldUnescape shouldUnescape
tOptions={{ interpolation: { escapeValue: true } }} tOptions={{ interpolation: { escapeValue: true } }}
/> />
)} )
</Notification.Body> }
<Notification.Action> action={
{accepted ? ( accepted ? (
<Button <Button
bsStyle="info" bsStyle="info"
bsSize="sm" bsSize="sm"
@ -110,17 +112,21 @@ function CommonNotification({ notification }: CommonNotificationProps) {
t('join_project') t('join_project')
)} )}
</Button> </Button>
)} )
</Notification.Action> }
</Notification> />
) : templateKey === 'wfh_2020_upgrade_offer' ? ( ) : templateKey === 'wfh_2020_upgrade_offer' ? (
<Notification bsStyle="info" onDismiss={() => id && handleDismiss(id)}> <Notification
<Notification.Body> bsStyle="info"
Important notice: Your free WFH2020 upgrade came to an end on June onDismiss={() => id && handleDismiss(id)}
30th 2020. We're still providing a number of special initiatives to body={
help you continue collaborating throughout 2020. <>
</Notification.Body> Important notice: Your free WFH2020 upgrade came to an end on June
<Notification.Action> 30th 2020. We're still providing a number of special initiatives
to help you continue collaborating throughout 2020.
</>
}
action={
<Button <Button
bsStyle="info" bsStyle="info"
bsSize="sm" bsSize="sm"
@ -129,55 +135,59 @@ function CommonNotification({ notification }: CommonNotificationProps) {
> >
View View
</Button> </Button>
</Notification.Action> }
</Notification> />
) : templateKey === 'notification_ip_matched_affiliation' ? ( ) : templateKey === 'notification_ip_matched_affiliation' ? (
<Notification bsStyle="info" onDismiss={() => id && handleDismiss(id)}> <Notification
<Notification.Body> bsStyle="info"
<Trans onDismiss={() => id && handleDismiss(id)}
i18nKey="looks_like_youre_at" body={
components={[<b />]} // eslint-disable-line react/jsx-key <>
values={{ <Trans
institutionName: notification.messageOpts.university_name, i18nKey="looks_like_youre_at"
}} components={[<b />]} // eslint-disable-line react/jsx-key
shouldUnescape values={{
tOptions={{ interpolation: { escapeValue: true } }} institutionName: notification.messageOpts.university_name,
/> }}
<br /> shouldUnescape
{notification.messageOpts.ssoEnabled ? ( tOptions={{ interpolation: { escapeValue: true } }}
<> />
<Trans <br />
i18nKey="you_can_now_log_in_sso" {notification.messageOpts.ssoEnabled ? (
components={[<b />]} // eslint-disable-line react/jsx-key <>
/> <Trans
<br /> i18nKey="you_can_now_log_in_sso"
{t('link_institutional_email_get_started')}{' '} components={[<b />]} // eslint-disable-line react/jsx-key
<a />
href={ <br />
notification.messageOpts.portalPath || {t('link_institutional_email_get_started')}{' '}
'https://www.overleaf.com/learn/how-to/Institutional_Login' <a
} href={
> notification.messageOpts.portalPath ||
{t('find_out_more_nt')} 'https://www.overleaf.com/learn/how-to/Institutional_Login'
</a> }
</> >
) : ( {t('find_out_more_nt')}
<> </a>
<Trans </>
i18nKey="did_you_know_institution_providing_professional" ) : (
components={[<b />]} // eslint-disable-line react/jsx-key <>
values={{ <Trans
institutionName: notification.messageOpts.university_name, i18nKey="did_you_know_institution_providing_professional"
}} components={[<b />]} // eslint-disable-line react/jsx-key
shouldUnescape values={{
tOptions={{ interpolation: { escapeValue: true } }} institutionName: notification.messageOpts.university_name,
/> }}
<br /> shouldUnescape
{t('add_email_to_claim_features')} tOptions={{ interpolation: { escapeValue: true } }}
</> />
)} <br />
</Notification.Body> {t('add_email_to_claim_features')}
<Notification.Action> </>
)}
</>
}
action={
<Button <Button
bsStyle="info" bsStyle="info"
bsSize="sm" bsSize="sm"
@ -192,20 +202,22 @@ function CommonNotification({ notification }: CommonNotificationProps) {
? t('link_account') ? t('link_account')
: t('add_affiliation')} : t('add_affiliation')}
</Button> </Button>
</Notification.Action> }
</Notification> />
) : templateKey === 'notification_tpds_file_limit' ? ( ) : templateKey === 'notification_tpds_file_limit' ? (
<Notification <Notification
bsStyle="danger" bsStyle="danger"
onDismiss={() => id && handleDismiss(id)} onDismiss={() => id && handleDismiss(id)}
> body={
<Notification.Body> <>
Error: Your project {notification.messageOpts.projectName} has gone Error: Your project {notification.messageOpts.projectName} has
over the 2000 file limit using an integration (e.g. Dropbox or gone over the 2000 file limit using an integration (e.g. Dropbox
GitHub) <br /> or GitHub) <br />
Please decrease the size of your project to prevent further errors. Please decrease the size of your project to prevent further
</Notification.Body> errors.
<Notification.Action> </>
}
action={
<Button <Button
bsStyle="danger" bsStyle="danger"
bsSize="sm" bsSize="sm"
@ -214,76 +226,82 @@ function CommonNotification({ notification }: CommonNotificationProps) {
> >
Account Settings Account Settings
</Button> </Button>
</Notification.Action> }
</Notification> />
) : templateKey === 'notification_dropbox_duplicate_project_names' ? ( ) : templateKey === 'notification_dropbox_duplicate_project_names' ? (
<Notification <Notification
bsStyle="warning" bsStyle="warning"
onDismiss={() => id && handleDismiss(id)} onDismiss={() => id && handleDismiss(id)}
> body={
<Notification.Body> <>
<p> <p>
<Trans <Trans
i18nKey="dropbox_duplicate_project_names" i18nKey="dropbox_duplicate_project_names"
components={[<b />]} // eslint-disable-line react/jsx-key components={[<b />]} // eslint-disable-line react/jsx-key
values={{ projectName: notification.messageOpts.projectName }} values={{ projectName: notification.messageOpts.projectName }}
shouldUnescape shouldUnescape
tOptions={{ interpolation: { escapeValue: true } }} tOptions={{ interpolation: { escapeValue: true } }}
/> />
</p> </p>
<p> <p>
<Trans <Trans
i18nKey="dropbox_duplicate_project_names_suggestion" i18nKey="dropbox_duplicate_project_names_suggestion"
components={[<b />]} // eslint-disable-line react/jsx-key components={[<b />]} // eslint-disable-line react/jsx-key
/>{' '} />{' '}
<a href="/learn/how-to/Dropbox_Synchronization#Troubleshooting"> <a href="/learn/how-to/Dropbox_Synchronization#Troubleshooting">
{t('learn_more')} {t('learn_more')}
</a> </a>
. .
</p> </p>
</Notification.Body> </>
</Notification> }
/>
) : templateKey === ) : templateKey ===
'notification_dropbox_unlinked_due_to_lapsed_reconfirmation' ? ( 'notification_dropbox_unlinked_due_to_lapsed_reconfirmation' ? (
<Notification bsStyle="info" onDismiss={() => id && handleDismiss(id)}> <Notification
<Notification.Body> bsStyle="info"
<Trans onDismiss={() => id && handleDismiss(id)}
i18nKey="dropbox_unlinked_premium_feature" body={
components={[<b />]} // eslint-disable-line react/jsx-key <>
/>{' '}
{user.features?.dropbox ? (
<Trans <Trans
i18nKey="can_now_relink_dropbox" i18nKey="dropbox_unlinked_premium_feature"
/* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */ components={[<b />]} // eslint-disable-line react/jsx-key
components={[<a href="/user/settings#project-sync" />]} />{' '}
/> {user.features?.dropbox ? (
) : ( <Trans
t('confirm_affiliation_to_relink_dropbox') i18nKey="can_now_relink_dropbox"
)}{' '} /* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */
<a href="/learn/how-to/Institutional_Email_Reconfirmation"> components={[<a href="/user/settings#project-sync" />]}
{t('learn_more')} />
</a> ) : (
</Notification.Body> t('confirm_affiliation_to_relink_dropbox')
</Notification> )}{' '}
<a href="/learn/how-to/Institutional_Email_Reconfirmation">
{t('learn_more')}
</a>
</>
}
/>
) : templateKey === 'notification_group_invitation' ? ( ) : templateKey === 'notification_group_invitation' ? (
<GroupInvitationNotification notification={notification} /> <GroupInvitationNotification notification={notification} />
) : templateKey === 'notification_personal_and_group_subscriptions' ? ( ) : templateKey === 'notification_personal_and_group_subscriptions' ? (
<Notification <Notification
bsStyle="warning" bsStyle="warning"
onDismiss={() => id && handleDismiss(id)} onDismiss={() => id && handleDismiss(id)}
> body={
<Notification.Body>
<Trans <Trans
i18nKey="notification_personal_and_group_subscriptions" i18nKey="notification_personal_and_group_subscriptions"
/* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */ /* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */
components={[<strong />, <a href="/user/subscription" />]} components={[<strong />, <a href="/user/subscription" />]}
/> />
</Notification.Body> }
</Notification> />
) : ( ) : (
<Notification bsStyle="info" onDismiss={() => id && handleDismiss(id)}> <Notification
<Notification.Body>{html}</Notification.Body> bsStyle="info"
</Notification> onDismiss={() => id && handleDismiss(id)}
body={html}
/>
)} )}
</> </>
) )