From 88d44b4370ac94c7b465ab2e4c24f72899fdefee Mon Sep 17 00:00:00 2001
From: Artem Baskal <a.baskal@adguard.com>
Date: Tue, 8 Dec 2020 14:08:39 +0300
Subject: [PATCH] client: 2367 Show SSL Certificate Expire Banner in 5 Days

Squashed commit of the following:

commit 290b3fbc5e18a2cc8694fb2d5f777952d971dfd6
Merge: fe5c67e62 2313eda12
Author: Artem Baskal <a.baskal@adguard.com>
Date:   Tue Dec 8 13:57:38 2020 +0300

    Merge branch 'master' into fix/2367

commit fe5c67e624280d7fc08192ed3e953a09ca10a9ee
Author: Artem Baskal <a.baskal@adguard.com>
Date:   Mon Dec 7 16:44:41 2020 +0300

    - client: 2367 Show SSL Certificate Expire Banner in 5 Days
---
 client/src/components/ui/EncryptionTopline.js | 71 ++++++++++++++-----
 1 file changed, 53 insertions(+), 18 deletions(-)

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 (
-            <Topline type="danger">
-                <Trans components={[<a href="#encryption" key="0">link</a>]}>
-                    topline_expired_certificate
-                </Trans>
-            </Topline>
-        );
+    if (expirationStateKey === EXPIRATION_ENUM.VALID) {
+        return null;
     }
 
-    if (isAboutExpire) {
-        return (
-            <Topline type="warning">
+    const { toplineType, i18nKey } = EXPIRATION_STATE[expirationStateKey];
+
+    return (
+            <Topline type={toplineType}>
                 <Trans components={[<a href="#encryption" key="0">link</a>]}>
-                    topline_expiring_certificate
+                    {i18nKey}
                 </Trans>
             </Topline>
-        );
-    }
-
-    return false;
+    );
 };
 
 export default EncryptionTopline;