Merge pull request #62 from nirupama-dev/bug-extract-error-message

Showed only message field in error toast for creating vertex schedule

Author: risha-vijayvargiya-22

src/services/Vertex.tsx

@@ -17,7 +17,11 @@
 import { toast } from 'react-toastify';
 import { requestAPI } from '../handler/Handler';
 import { SchedulerLoggingService, LOG_LEVEL } from './LoggingService';
-import { showToast, toastifyCustomStyle } from '../utils/Config';
+import {
+  showToast,
+  toastifyCustomStyle,
+  toastifyCustomWidth
+} from '../utils/Config';
 import {
   ICreatePayload,
   IVertexScheduleList,
@@ -98,10 +102,28 @@ export class VertexServices {
         method: 'POST'
       });
       if (data.error) {
-        toast.error(
-          <ExpandToastMessage message={data.error} />,
-          toastifyCustomStyle
+        const jsonstr = data?.error.slice(
+          data?.error.indexOf('{'),
+          data?.error.lastIndexOf('}') + 1
         );
+        if (jsonstr) {
+          const errorObject = JSON.parse(jsonstr);
+          if (errorObject.error.message) {
+            toast.error(
+              `Error in creating schedule : ${errorObject.error.message}`,
+              {
+                ...toastifyCustomStyle
+              }
+            );
+          } else {
+            toast.error(
+              <ExpandToastMessage message={data.error} />,
+              data.error.length > 500
+                ? toastifyCustomWidth
+                : toastifyCustomStyle
+            );
+          }
+        }
         setCreatingVertexScheduler(false);
       } else {
         toast.success(

src/utils/Config.ts

@@ -76,6 +76,16 @@ export const toastifyCustomStyle: ToastOptions<Record<string, never>> = {
   position: toast.POSITION.BOTTOM_CENTER
 };
 
+export const toastifyCustomWidth: ToastOptions<Record<string, never>> = {
+  hideProgressBar: true,
+  autoClose: 600000,
+  theme: 'dark',
+  position: toast.POSITION.BOTTOM_CENTER,
+  style: {
+    width: '150%'
+  }
+};
+
 export const handleDebounce = (func: any, delay: number) => {
   let timeoutId: any;
   return function (...args: any) {