Merge branch 'feature/notify-via-SMS' of https://github.com/bigcapitalhq/client into feature/notify-via-SMS

src/containers/Dialogs/NotifyInvoiceViaSMSDialog/NotifyInvoiceViaSMSDialogContent.js

@@ -6,11 +6,11 @@ import NotifyInvoiceViaSMSForm from './NotifyInvoiceViaSMSForm';
 export default function NotifyInvoiceViaSMSDialogContent({
   // #ownProps
   dialogName,
-  invoice,
+  invoiceId,
 }) {
   return (
     <NotifyInvoiceViaSMSFormProvider
-      invoiceId={invoice}
+      invoiceId={invoiceId}
       dialogName={dialogName}
     >
       <NotifyInvoiceViaSMSForm />

src/containers/Dialogs/NotifyInvoiceViaSMSDialog/NotifyInvoiceViaSMSForm.js

@@ -33,6 +33,8 @@ function NotifyInvoiceViaSMSForm({
     setNotificationType,
   } = useNotifyInvoiceViaSMSContext();
 
+  const [calloutCode, setCalloutCode] = React.useState([]);
+
   // Handles the form submit.
   const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
     setSubmitting(true);
@@ -46,7 +48,6 @@ function NotifyInvoiceViaSMSForm({
       setSubmitting(false);
       closeDialog(dialogName);
     };
-
     // Handle request response errors.
     const onError = ({
       response: {
@@ -54,13 +55,14 @@ function NotifyInvoiceViaSMSForm({
       },
     }) => {
       if (errors) {
-        transformErrors(errors, { setErrors });
+        transformErrors(errors, { setErrors, setCalloutCode });
       }
       setSubmitting(false);
     };
     // Transformes the form values to request.
     const requestValues = transformFormValuesToRequest(values);
 
+    // Submits invoice SMS notification.
     createNotifyInvoiceBySMSMutate([invoiceId, requestValues])
       .then(onSuccess)
       .catch(onError);
@@ -74,7 +76,7 @@ function NotifyInvoiceViaSMSForm({
     notification_key: notificationType,
     ...invoiceSMSDetail,
   };
-
+  // Handle form values change.
   const handleValuesChange = (values) => {
     if (values.notification_key !== notificationType) {
       setNotificationType(values.notification_key);
@@ -88,7 +90,6 @@ function NotifyInvoiceViaSMSForm({
     ],
     [],
   );
-
   return (
     <NotifyViaSMSForm
       initialValues={initialValues}
@@ -96,6 +97,7 @@ function NotifyInvoiceViaSMSForm({
       onSubmit={handleFormSubmit}
       onCancel={handleFormCancel}
       onValuesChange={handleValuesChange}
+      calloutCodes={calloutCode}
     />
   );
 }

src/containers/Dialogs/NotifyInvoiceViaSMSDialog/NotifyInvoiceViaSMSFormProvider.js

@@ -4,6 +4,9 @@ import { useCreateNotifyInvoiceBySMS, useInvoiceSMSDetail } from 'hooks/query';
 
 const NotifyInvoiceViaSMSContext = React.createContext();
 
+/**
+ * Invoice SMS notification provider.
+ */
 function NotifyInvoiceViaSMSFormProvider({ invoiceId, dialogName, ...props }) {
   const [notificationType, setNotificationType] = React.useState('details');
 
@@ -16,6 +19,7 @@ function NotifyInvoiceViaSMSFormProvider({ invoiceId, dialogName, ...props }) {
       },
       {
         enabled: !!invoiceId,
+        keepPreviousData: true,
       },
     );
   // Create notfiy invoice by sms mutations.

src/containers/Dialogs/NotifyInvoiceViaSMSDialog/index.js

@@ -26,7 +26,7 @@ function NotifyInvoiceViaSMSDialog({
       <DialogSuspense>
         <NotifyInvoiceViaSMSDialogContent
           dialogName={dialogName}
-          invoice={invoiceId}
+          invoiceId={invoiceId}
         />
       </DialogSuspense>
     </Dialog>

src/containers/Dialogs/SMSMessageDialog/utils.js

@@ -1,15 +1,19 @@
 import { Intent } from '@blueprintjs/core';
-import { AppToaster } from 'components';
-import intl from 'react-intl-universal';
+import { castArray } from 'lodash';
 
 export const transformErrors = (errors, { setErrors }) => {
-  if (
-    errors.find((error) => error.type === 'UNSUPPORTED_SMS_MESSAGE_VARIABLES')
-  ) {
+  let unsupportedVariablesError = errors.find(
+    (error) => error.type === 'UNSUPPORTED_SMS_MESSAGE_VARIABLES',
+  );
+  if (unsupportedVariablesError) {
+    const variables = castArray(
+      unsupportedVariablesError.data.unsupported_args,
+    );
+    const stringifiedVariables = variables.join(', ');
+
     setErrors({
-      message_text: intl.get(
-        'sms_message.dialog.unsupported_variables_error_message',
-      ),
+      message_text: `The SMS message has unsupported variables - ${stringifiedVariables}`,
+      intent: Intent.DANGER,
     });
   }
 };