Code cleanup and version update

package.json

@@ -1,6 +1,6 @@
 {
   "name": "glific-frontend",
-  "version": "1.5.1",
+  "version": "1.6.0",
   "private": true,
   "dependencies": {
     "@absinthe/socket": "^0.2.1",

src/components/floweditor/FlowEditor.tsx

@@ -18,10 +18,11 @@ import { PUBLISH_FLOW } from '../../graphql/mutations/Flow';
 import { GET_FLOW_DETAILS } from '../../graphql/queries/Flow';
 import { setAuthHeaders } from '../../services/AuthService';
 import { GET_ORGANIZATION_SERVICES } from '../../graphql/queries/Organization';
+import { Loading } from '../UI/Layout/Loading/Loading';
 
 declare function showFlowEditor(node: any, config: any): void;
 
-const loadfiles = () => {
+const loadfiles = (startFlowEditor: any) => {
   const files: Array<HTMLScriptElement | HTMLLinkElement> = [];
   const filesToLoad: any = Manifest.files;
   let index = 0;
@@ -30,6 +31,11 @@ const loadfiles = () => {
       if (filesToLoad[fileName].endsWith('.js')) {
         index += 1;
         const script = document.createElement('script');
+        if (index === 2) {
+          script.onload = () => {
+            startFlowEditor();
+          };
+        }
         script.src = filesToLoad[fileName];
         script.id = `flowEditorScript${index}`;
         script.async = false;
@@ -150,6 +156,7 @@ export const FlowEditor = (props: FlowEditorProps) => {
   const { uuid } = match.params;
   const [publishDialog, setPublishDialog] = useState(false);
   const [simulatorId, setSimulatorId] = useState(0);
+  const [loading, setLoading] = useState(true);
 
   const config = setConfig(uuid);
   const [published, setPublished] = useState(false);
@@ -163,7 +170,20 @@ export const FlowEditor = (props: FlowEditorProps) => {
   let modal = null;
   let dialog = null;
 
-  const [getOrganizationServices, { data: services }] = useLazyQuery(GET_ORGANIZATION_SERVICES);
+  const [getOrganizationServices] = useLazyQuery(GET_ORGANIZATION_SERVICES, {
+    onCompleted: (services) => {
+      const { dialogflow, googleCloudStorage } = services.organizationServices;
+
+      if (googleCloudStorage) {
+        config.attachmentsEnabled = true;
+      }
+      if (!dialogflow) {
+        config.excludeTypes.push('split_by_intent');
+      }
+      showFlowEditor(document.getElementById('flow'), config);
+      setLoading(false);
+    },
+  });
 
   const [publishFlow] = useMutation(PUBLISH_FLOW, {
     onCompleted: (data) => {
@@ -236,8 +256,9 @@ export const FlowEditor = (props: FlowEditorProps) => {
 
   useEffect(() => {
     const { fetch, xmlSend } = setAuthHeaders();
-    const files = loadfiles();
-    getOrganizationServices();
+    const files = loadfiles(() => {
+      getOrganizationServices();
+    });
 
     return () => {
       Object.keys(files).forEach((node: any) => {
@@ -255,25 +276,6 @@ export const FlowEditor = (props: FlowEditorProps) => {
     };
   }, []);
 
-  useEffect(() => {
-    if (services) {
-      // check if runtime main file is present and then load
-      const lastFile: HTMLScriptElement | null = document.body.querySelector('#flowEditorScript2');
-      if (lastFile) {
-        const { dialogflow, googleCloudStorage } = services.organizationServices;
-
-        if (googleCloudStorage) {
-          config.attachmentsEnabled = true;
-        }
-        if (!dialogflow) {
-          config.excludeTypes.push('split_by_intent');
-        }
-
-        showFlowEditor(document.getElementById('flow'), config);
-      }
-    }
-  }, [config, services]);
-
   const handlePublishFlow = () => {
     publishFlow({ variables: { uuid: props.match.params.uuid } });
   };
@@ -429,6 +431,7 @@ export const FlowEditor = (props: FlowEditorProps) => {
           ) : null}
         </div>
         <div id="flow" />
+        {loading && <Loading />}
       </div>
     </>
   );

src/containers/Consulting/ConsultingList/ConsultingList.tsx

@@ -11,7 +11,6 @@ import {
   GET_CONSULTING_HOURS,
   GET_CONSULTING_HOURS_COUNT,
 } from '../../../graphql/queries/Consulting';
-import { DELETE_CONSULTING_HOURS } from '../../../graphql/mutations/Consulting';
 import { ReactComponent as ConsultingIcon } from '../../../assets/images/icons/icon-consulting.svg';
 
 interface ConsultingListProps {
@@ -25,7 +24,7 @@ const ConsultingList: React.SFC<ConsultingListProps> = ({ match, openDialog }: a
   const queries = {
     countQuery: GET_CONSULTING_HOURS_COUNT,
     filterItemsQuery: GET_CONSULTING_HOURS,
-    deleteItemQuery: DELETE_CONSULTING_HOURS,
+    deleteItemQuery: null,
   };
 
   const columnNames = ['NAME', 'DATE', 'MINUTES', 'TYPE', 'ACTIONS'];
@@ -71,6 +70,8 @@ const ConsultingList: React.SFC<ConsultingListProps> = ({ match, openDialog }: a
   const dialogMessage = 'This action cannot be undone.';
   const dialogTitle = 'Are you sure you want to delete this consulting record?';
 
+  const restrictedAction = () => ({ delete: false, edit: true });
+
   return (
     <>
       <List
@@ -83,6 +84,7 @@ const ConsultingList: React.SFC<ConsultingListProps> = ({ match, openDialog }: a
           query: GET_CONSULTING_HOURS,
           variables: setVariables(),
         }}
+        restrictedAction={restrictedAction}
         searchParameter="organizationName"
         dialogMessage={dialogMessage}
         dialogTitle={dialogTitle}