diff --git a/client/src/components/ui/EncryptionTopline.js b/client/src/components/ui/EncryptionTopline.js index b013130c..6ff18136 100644 --- a/client/src/components/ui/EncryptionTopline.js +++ b/client/src/components/ui/EncryptionTopline.js @@ -6,6 +6,50 @@ import { useSelector } from 'react-redux'; import Topline from './Topline'; import { EMPTY_DATE } from '../../helpers/constants'; +const EXPIRATION_ENUM = { + VALID: 'VALID', + EXPIRED: 'EXPIRED', + EXPIRING: 'EXPIRING', +}; + +const EXPIRATION_STATE = { + [EXPIRATION_ENUM.EXPIRED]: { + toplineType: 'danger', + i18nKey: 'topline_expired_certificate', + }, + [EXPIRATION_ENUM.EXPIRING]: { + toplineType: 'warning', + i18nKey: 'topline_expiring_certificate', + }, +}; + +const getExpirationFlags = (not_after) => { + const DAYS_BEFORE_EXPIRATION = 5; + + const now = Date.now(); + const isExpiring = isAfter(addDays(now, DAYS_BEFORE_EXPIRATION), not_after); + const isExpired = isAfter(now, not_after); + + return { + isExpiring, + isExpired, + }; +}; + +const getExpirationEnumKey = (not_after) => { + const { isExpiring, isExpired } = getExpirationFlags(not_after); + + if (isExpired) { + return EXPIRATION_ENUM.EXPIRED; + } + + if (isExpiring) { + return EXPIRATION_ENUM.EXPIRING; + } + + return EXPIRATION_ENUM.VALID; +}; + const EncryptionTopline = () => { const not_after = useSelector((state) => state.encryption.not_after); @@ -13,30 +57,21 @@ const EncryptionTopline = () => { return null; } - const isAboutExpire = isAfter(addDays(Date.now(), 30), not_after); - const isExpired = isAfter(Date.now(), not_after); + const expirationStateKey = getExpirationEnumKey(not_after); - if (isExpired) { - return ( - - link]}> - topline_expired_certificate - - - ); + if (expirationStateKey === EXPIRATION_ENUM.VALID) { + return null; } - if (isAboutExpire) { - return ( - + const { toplineType, i18nKey } = EXPIRATION_STATE[expirationStateKey]; + + return ( + link]}> - topline_expiring_certificate + {i18nKey} - ); - } - - return false; + ); }; export default EncryptionTopline;