From d86bbf9aa705693b90b034b804bb4a88ca0aa4f7 Mon Sep 17 00:00:00 2001
From: Lache Melvin <lache.melvin@gmail.com>
Date: Mon, 27 Nov 2023 16:22:48 +1300
Subject: [PATCH 1/2] only disable save for invalid configs when notification
 enabled

---
 .../common/src/intl/locales/en/system.json      |  1 +
 .../Pages/Base/BaseNotificationEditPage.tsx     | 17 ++++++++++++++++-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/frontend/packages/common/src/intl/locales/en/system.json b/frontend/packages/common/src/intl/locales/en/system.json
index 25da402a..32041d3b 100644
--- a/frontend/packages/common/src/intl/locales/en/system.json
+++ b/frontend/packages/common/src/intl/locales/en/system.json
@@ -81,6 +81,7 @@
   "messages.recipients-added_one": "{{count}} recipient added to list",
   "messages.query-result-count_other": "Result: {{count}} rows",
   "messages.query-result-count_one": "Result: {{count}} row",
+  "messages.saving-enabled-invalid-notification": "To save an enabled notification, it must have valid configuration",
   "messages.cold-chain-no-data-information": "Alert will be triggered if no temperature data is received by the server within the specified timeframe",
   "messages.cold-chain-temperature-information": "Default Temperature thresholds are 2°C and 8°C",
   "not-logged-in": "Not logged in",
diff --git a/frontend/packages/system/src/Notifications/Pages/Base/BaseNotificationEditPage.tsx b/frontend/packages/system/src/Notifications/Pages/Base/BaseNotificationEditPage.tsx
index 1bb0cd14..fd272485 100644
--- a/frontend/packages/system/src/Notifications/Pages/Base/BaseNotificationEditPage.tsx
+++ b/frontend/packages/system/src/Notifications/Pages/Base/BaseNotificationEditPage.tsx
@@ -27,6 +27,7 @@ import {
   RouteBuilder,
   BaseButton,
   ListIcon,
+  Tooltip,
 } from '@notify-frontend/common';
 
 import { BaseNotificationConfig } from '../../types';
@@ -296,8 +297,20 @@ export const BaseNotificationEditPage = <T extends BaseNotificationConfig>({
                     </LoadingButton>
                   )}
 
+                  <Tooltip
+                    title={
+                      isEnabled(draft.status) && isInvalid
+                        ? t('messages.saving-enabled-invalid-notification')
+                        : ''
+                    }
+                  >
+                    <span>
                   <LoadingButton
-                    disabled={isSaved || isInvalid || !allParamsSet}
+                        disabled={
+                          isSaved ||
+                          (isEnabled(draft.status) && isInvalid) ||
+                          !allParamsSet
+                        }
                     isLoading={isLoading}
                     onClick={() => {
                       onSave(draft);
@@ -308,6 +321,8 @@ export const BaseNotificationEditPage = <T extends BaseNotificationConfig>({
                   >
                     {t('button.save')}
                   </LoadingButton>
+                    </span>
+                  </Tooltip>
                 </Box>
               </Box>
             }

From 0d7047f4eec6bc2ae63f1e8eadf23682e2ed1af6 Mon Sep 17 00:00:00 2001
From: Lache Melvin <lache.melvin@gmail.com>
Date: Mon, 27 Nov 2023 16:59:55 +1300
Subject: [PATCH 2/2] use confirmation modal if saving valid disabled config

---
 .../common/src/intl/locales/en/system.json    |  2 +
 .../Pages/Base/BaseNotificationEditPage.tsx   | 40 +++++++++++++------
 2 files changed, 29 insertions(+), 13 deletions(-)

diff --git a/frontend/packages/common/src/intl/locales/en/system.json b/frontend/packages/common/src/intl/locales/en/system.json
index 32041d3b..0c021610 100644
--- a/frontend/packages/common/src/intl/locales/en/system.json
+++ b/frontend/packages/common/src/intl/locales/en/system.json
@@ -48,6 +48,7 @@
   "label.new-query": "New Query",
   "label.new-user": "New User",
   "label.new-notification": "New Notification",
+  "label.notification-is-disabled": "Notification is disabled",
   "label.notification-title": "Notification Title",
   "label.notification-type-EMAIL": "Email",
   "label.notification-type-TELEGRAM": "Telegram",
@@ -81,6 +82,7 @@
   "messages.recipients-added_one": "{{count}} recipient added to list",
   "messages.query-result-count_other": "Result: {{count}} rows",
   "messages.query-result-count_one": "Result: {{count}} row",
+  "messages.saving-disabled-valid-notification": "Did you mean to enable this notification before you saved it?",
   "messages.saving-enabled-invalid-notification": "To save an enabled notification, it must have valid configuration",
   "messages.cold-chain-no-data-information": "Alert will be triggered if no temperature data is received by the server within the specified timeframe",
   "messages.cold-chain-temperature-information": "Default Temperature thresholds are 2°C and 8°C",
diff --git a/frontend/packages/system/src/Notifications/Pages/Base/BaseNotificationEditPage.tsx b/frontend/packages/system/src/Notifications/Pages/Base/BaseNotificationEditPage.tsx
index fd272485..0a1f7e4c 100644
--- a/frontend/packages/system/src/Notifications/Pages/Base/BaseNotificationEditPage.tsx
+++ b/frontend/packages/system/src/Notifications/Pages/Base/BaseNotificationEditPage.tsx
@@ -161,6 +161,17 @@ export const BaseNotificationEditPage = <T extends BaseNotificationConfig>({
     }
   });
 
+  const saveConfig = () => {
+    onSave(draft);
+    setIsSaved(true);
+  };
+
+  const confirmBeforeSaving = useConfirmationModal({
+    title: t('label.notification-is-disabled'),
+    message: t('messages.saving-disabled-valid-notification'),
+    onConfirm: saveConfig,
+  });
+
   return (
     <>
       {isLoading ? (
@@ -287,8 +298,7 @@ export const BaseNotificationEditPage = <T extends BaseNotificationConfig>({
                       onClick={() => {
                         // Note, this doesn't update state, but that's good we don't want to save the nextDueDatetime again if the save button is used next.
                         draft.nextDueDatetime = new Date().toISOString();
-                        onSave(draft);
-                        setIsSaved(true);
+                        saveConfig();
                       }}
                       startIcon={<RunIcon />}
                       sx={{ fontSize: '12px' }}
@@ -305,22 +315,26 @@ export const BaseNotificationEditPage = <T extends BaseNotificationConfig>({
                     }
                   >
                     <span>
-                  <LoadingButton
+                      <LoadingButton
                         disabled={
                           isSaved ||
                           (isEnabled(draft.status) && isInvalid) ||
                           !allParamsSet
                         }
-                    isLoading={isLoading}
-                    onClick={() => {
-                      onSave(draft);
-                      setIsSaved(true);
-                    }}
-                    startIcon={<SaveIcon />}
-                    sx={{ fontSize: '12px' }}
-                  >
-                    {t('button.save')}
-                  </LoadingButton>
+                        isLoading={isLoading}
+                        onClick={() => {
+                          // prompt user if saving a valid config with disabled status - they may have forgotten to enable
+                          if (!isInvalid && !isEnabled(draft.status)) {
+                            confirmBeforeSaving();
+                          } else {
+                            saveConfig();
+                          }
+                        }}
+                        startIcon={<SaveIcon />}
+                        sx={{ fontSize: '12px' }}
+                      >
+                        {t('button.save')}
+                      </LoadingButton>
                     </span>
                   </Tooltip>
                 </Box>