organisations settings

glific · Jan 11, 2024 · d7e0035 · d7e0035
1 parent b4d8668
commit d7e0035
Show file tree

Hide file tree

Showing 7 changed files with 134 additions and 4 deletions.
diff --git a/src/containers/SettingList/Organisation/Organisation.test.tsx b/src/containers/SettingList/Organisation/Organisation.test.tsx
@@ -16,12 +16,30 @@ const wrapper = (
   </MockedProvider>
 );
 
+test('it should render the placeholders correctly', async () => {
+  const { getByTestId, getByText } = render(wrapper);
+
+  expect(getByText('Loading...')).toBeInTheDocument();
+
+  await waitFor(() => {
+    expect(getByTestId('formLayout')).toHaveTextContent('Organisation name');
+    expect(getByTestId('formLayout')).toHaveTextContent('Supported languages');
+    expect(getByTestId('formLayout')).toHaveTextContent('Default language');
+    expect(getByTestId('formLayout')).toHaveTextContent('Organisation phone number');
+    expect(getByTestId('formLayout')).toHaveTextContent('Low balance threshold for warning emails');
+    expect(getByTestId('formLayout')).toHaveTextContent(
+      'Critical balance threshold for warning emails'
+    );
+    expect(getByTestId('formLayout')).toHaveTextContent('Recieve warning mails?');
+  });
+});
+
 test('it renders component properly', async () => {
-  const { getByText } = render(wrapper);
+  const { getByText, getByTestId } = render(wrapper);
   // loading is show initially
   expect(getByText('Loading...')).toBeInTheDocument();
   await waitFor(() => {
-    expect(getByText('Back to settings')).toBeInTheDocument();
+    expect(getByTestId('add-container')).toHaveTextContent('Organisation name');
   });
 });
 
@@ -45,7 +63,7 @@ test('it renders component in edit mode', async () => {
       </Router>
     </MockedProvider>
   );
-  // loading is show initially
+  // loading is show initiallyiokk
   expect(getByText('Loading...')).toBeInTheDocument();
 
   await waitFor(() => {
@@ -59,3 +77,29 @@ test('it renders component in edit mode', async () => {
     fireEvent.click(submit);
   });
 });
+
+test('it submits form correctly', async () => {
+  const { getByText, getByTestId } = render(wrapper);
+
+  expect(getByText('Loading...')).toBeInTheDocument();
+
+  await waitFor(() => {
+    const inputElements = screen.getAllByRole('textbox');
+    const numberInputElements = screen.getAllByRole('spinbutton');
+
+    fireEvent.change(inputElements[0], { target: { value: 'Glificc' } });
+    fireEvent.change(inputElements[1], { target: { value: 'Please change me, NOW!' } });
+    fireEvent.change(numberInputElements[0], { target: { value: '10' } });
+    fireEvent.change(numberInputElements[1], { target: { value: '5' } });
+  });
+
+  await waitFor(() => {
+    const submitButton = screen.getByText('Save');
+    expect(submitButton).toBeInTheDocument();
+    fireEvent.click(submitButton);
+  });
+
+  await waitFor(() => {
+    expect(getByTestId('formLayout')).toHaveTextContent('Organisation name');
+  });
+});
diff --git a/src/containers/SettingList/Organisation/Organisation.tsx b/src/containers/SettingList/Organisation/Organisation.tsx
@@ -19,6 +19,7 @@ import Settingicon from 'assets/images/icons/Settings/Settings.svg?react';
 import CopyIcon from 'assets/images/icons/Settings/Copy.svg?react';
 import { copyToClipboard } from 'common/utils';
 import styles from './Organisation.module.css';
+import { Checkbox } from 'components/UI/Form/Checkbox/Checkbox';
 
 const SettingIcon = <Settingicon />;
 
@@ -38,6 +39,9 @@ export const Organisation = () => {
   const [signaturePhrase, setSignaturePhrase] = useState('');
   const [phone, setPhone] = useState<string>('');
   const [tier, setTier] = useState();
+  const [lowBalanceThreshold, setLowBalanceThreshold] = useState('');
+  const [criticalBalanceThreshold, setCriticalBalanceThreshold] = useState('');
+  const [sendWarningMail, setSendWarningMail] = useState<boolean>(false);
 
   const { t } = useTranslation();
 
@@ -48,6 +52,9 @@ export const Organisation = () => {
     signaturePhrase,
     phone,
     tier,
+    lowBalanceThreshold,
+    criticalBalanceThreshold,
+    sendWarningMail,
   };
 
   const { data: languages } = useQuery(GET_LANGUAGES, {
@@ -62,18 +69,26 @@ export const Organisation = () => {
 
   const [getOrg, { data: orgData }] = useLazyQuery<any>(GET_ORGANIZATION);
 
+  const setSettings = (data: any) => {
+    setLowBalanceThreshold(data.lowBalanceThreshold);
+    setCriticalBalanceThreshold(data.criticalBalanceThreshold);
+    setSendWarningMail(data.sendWarningMail);
+  };
+
   const setStates = ({
     name: nameValue,
     activeLanguages: activeLanguagesValue,
     defaultLanguage: defaultLanguageValue,
     signaturePhrase: signaturePhraseValue,
     contact: contactValue,
+    setting: settingValue,
   }: any) => {
     setName(nameValue);
     setSignaturePhrase(signaturePhraseValue);
     if (activeLanguagesValue) setActiveLanguages(activeLanguagesValue);
     if (defaultLanguageValue) setDefaultLanguage(defaultLanguageValue);
     setPhone(contactValue.phone);
+    setSettings(settingValue);
   };
 
   useEffect(() => {
@@ -111,6 +126,14 @@ export const Organisation = () => {
     return error;
   };
 
+  const validateThresholdFieds = (value: any) => {
+    let error;
+    if (value < 0) {      
+      error = t('Threshold value should not be negative!');
+    }
+    return error;
+  };
+
   const validation = {
     name: Yup.string().required(t('Organisation name is required.')),
     activeLanguages: Yup.array().required(t('Supported Languages is required.')),
@@ -184,6 +207,25 @@ export const Organisation = () => {
       skip: !tier,
       disabled: true,
     },
+    {
+      component: Input,
+      name: 'lowBalanceThreshold',
+      type: 'number',
+      placeholder: t('Low balance threshold for warning emails'),
+      validate: validateThresholdFieds
+    },
+    {
+      component: Input,
+      name: 'criticalBalanceThreshold',
+      type: 'number',
+      placeholder: t('Critical balance threshold for warning emails'),
+      validate: validateThresholdFieds
+    },
+    {
+      component: Checkbox,
+      name: 'sendWarningMail',
+      title: t('Recieve warning mails?'),
+    },
   ];
 
   const saveHandler = (data: any) => {
@@ -204,6 +246,11 @@ export const Organisation = () => {
       activeLanguageIds,
       signaturePhrase: payload.signaturePhrase,
       defaultLanguageId: payload.defaultLanguage.id,
+      setting: {
+        lowBalanceThreshold: payload.lowBalanceThreshold.toString(),
+        criticalBalanceThreshold: payload.criticalBalanceThreshold.toString(),
+        sendWarningMail: payload.sendWarningMail,
+      },
     };
     return object;
   };

diff --git a/src/containers/SettingList/SettingList.test.helper.ts b/src/containers/SettingList/SettingList.test.helper.ts
@@ -122,6 +122,11 @@ const updateOrganisationMock = {
             flowId: null,
             startTime: '09:00:00',
           },
+          setting: {
+            lowBalanceThreshold: '10',
+            criticalBalanceThreshold: '5',
+            sendWarningMail: false,
+          },
           shortcode: 'glific',
         },
       },

diff --git a/src/graphql/mutations/Organization.ts b/src/graphql/mutations/Organization.ts
@@ -26,6 +26,11 @@ export const UPDATE_ORGANIZATION = gql`
           id
           label
         }
+        setting {
+          lowBalanceThreshold
+          criticalBalanceThreshold
+          sendWarningMail
+        }
       }
       errors {
         key

diff --git a/src/graphql/queries/Organization.ts b/src/graphql/queries/Organization.ts
@@ -28,6 +28,11 @@ export const GET_ORGANIZATION = gql`
           id
           label
         }
+        setting {
+          lowBalanceThreshold
+          criticalBalanceThreshold
+          sendWarningMail
+        }
         signaturePhrase
         newcontactFlowId
         optinFlowId

diff --git a/src/i18n/en/en.json b/src/i18n/en/en.json
@@ -441,5 +441,9 @@
   "Request JSON": "Request JSON",
   "Response JSON": "Response JSON",
   "Webhook Logs": "Webhook Logs",
-  "Translate": "Translate"
+  "Translate": "Translate",
+  "Recieve warning mails?": "Recieve warning mails?",
+  "Critical balance threshold for warning emails": "Critical balance threshold for warning emails",
+  "Low balance threshold for warning emails": "Low balance threshold for warning emails",
+  "Threshold value should not be negative!": "Threshold value should not be negative!"
 }
diff --git a/src/mocks/Organization.tsx b/src/mocks/Organization.tsx
@@ -47,6 +47,11 @@ export const getOrganizationQuery = [
               flowId: 2,
               startTime: '12:31:27',
             },
+            setting: {
+              lowBalanceThreshold: '10',
+              criticalBalanceThreshold: '5',
+              sendWarningMail: false,
+            },
             name: 'Glific',
             signaturePhrase: 'Sample text',
             contact: {
@@ -91,6 +96,11 @@ export const getOrganizationQuery = [
               flowId: 2,
               startTime: '12:31:27',
             },
+            setting: {
+              lowBalanceThreshold: '10',
+              criticalBalanceThreshold: '5',
+              sendWarningMail: false,
+            },
             name: 'Glific',
             signaturePhrase: 'Sample text',
             contact: {
@@ -136,6 +146,11 @@ export const getOrganizationQuery = [
               flowId: '1',
               startTime: '09:00:00',
             },
+            setting: {
+              lowBalanceThreshold: '10',
+              criticalBalanceThreshold: '5',
+              sendWarningMail: false,
+            },
             signaturePhrase: 'Please change me, NOW!',
           },
         },
@@ -177,6 +192,11 @@ export const getOrganisationSettings = {
             flowId: 2,
             startTime: '12:31:27',
           },
+          setting: {
+            lowBalanceThreshold: '10',
+            criticalBalanceThreshold: '5',
+            sendWarningMail: false,
+          },
           name: 'Glific',
           signaturePhrase: 'Sample text',
           contact: {