TMSS-936: Updated, growl message and tooltip. Modified few async functions.

SAS/TMSS/frontend/tmss_webapp/src/components/DynamicScheduler.js

 import React, { Component } from 'react';
 import UtilService from '../services/util.service';
 import { CustomDialog } from '../layout/components/CustomDialog';
-import { Growl } from 'primereact/components/growl/Growl';
+import { appGrowl } from '../layout/components/AppGrowl';
 import {InputSwitch} from 'primereact/inputswitch';
 import AuthStore from '../authenticate/auth.store';
 
@@ -12,7 +12,7 @@ export default class DynamicScheduler extends Component {
         this.state= {
             dsStatus: false, // Dynamic Scheduler Status
             showDialog: false,
-            userrole: AuthStore.getState(),
+            permissions: AuthStore.getState(),
         }
         this.currentStatus = null;
         this.updateDSStatus = this.updateDSStatus.bind(this);
@@ -20,13 +20,15 @@ export default class DynamicScheduler extends Component {
         this.showConfirmDialog = this.showConfirmDialog.bind(this);
     }
 
-    async componentDidMount(){
-        let response  = await UtilService.getDynamicSchedulerStatus();
-        var status = false;
-        if(response) {
-            status = response.value;
-        }
-        this.setState({dynamicScheduler: response, dsStatus: status});        
+    componentDidMount() {
+        UtilService.getDynamicSchedulerStatus()
+        .then(response => {
+            var status = false;
+            if(response) {
+                status = response.value;
+            }
+            this.setState({dynamicScheduler: response, dsStatus: status});
+        });
     } 
 
     /**
@@ -37,9 +39,9 @@ export default class DynamicScheduler extends Component {
         dynamicScheduler.value = this.currentStatus;
         let response = await UtilService.updateDynamicSchedulerStatus(dynamicScheduler);
         if(response) {
-            this.growl.show({severity: 'success', summary: 'Success', detail: 'Dynamic Scheduling Switched '+((this.currentStatus === true)?'On' : 'Off')+' successfully!'}); 
+            appGrowl.show({severity: 'success', summary: 'Success', detail: 'Dynamic Scheduling is turned '+((this.currentStatus === true)?'On' : 'Off')+' successfully!'}); 
         }   else {
-            this.growl.show({severity: 'error', summary: 'Error', detail: 'Dynamic Scheduling is not updated successfully.'});
+            appGrowl.show({severity: 'error', summary: 'Error', detail: 'Dynamic Scheduling is not updated successfully.'});
         }
         this.setState({dsStatus: this.currentStatus, showDialog: false}); 
     }
@@ -48,9 +50,9 @@ export default class DynamicScheduler extends Component {
      * Show confirmation dialog to enable/disable Dynamic Scheduling
      * @param {*} e 
      */
-    async showConfirmDialog(e) {
+    showConfirmDialog(e) {
         this.currentStatus = e.value;
-        await this.setState({showDialog: true})
+        this.setState({showDialog: true})
     }
 
     /**
@@ -61,19 +63,19 @@ export default class DynamicScheduler extends Component {
     }
     
     render() {
-        const  {dynamicScheduler}  = this.state.userrole.userRolePermission;
-        const tooltip = dynamicScheduler.setting?`Turn ${this.state.dsStatus? "'Off'" : "'On'"} Dynamic Scheduling`: "Don't have permission to Trun On/Off Dynamic Scheduling"
+        const  {dynamicScheduler}  = this.state.permissions.userRolePermission;
+        let tooltip = `Dynamic Scheduling is turned ${this.state.dsStatus?'On':'Off'}. `;
+        tooltip = `${tooltip} ${dynamicScheduler.setting?'Click':"Don't have permission"} to turn it ${this.state.dsStatus? "'Off'" : "'On'"}`;
         return (
             <>
-            <Growl ref={(el) => this.growl = el} />
             <div className="p-field p-grid">
                 <label htmlFor="autodeletion" style={{marginRight: '10px', marginLeft: '1em'}}>Dynamic Scheduling :</label>
-                <label htmlFor="onLabel" style={{ marginRight: '0.25em', color: 'black'}}>OFF</label>
+                {/* <label htmlFor="onLabel" style={{ marginRight: '0.25em', color: 'black'}}>OFF</label> */}
                 <InputSwitch disabled={dynamicScheduler.setting?!dynamicScheduler.setting:true}
                     checked={this.state.dsStatus} onChange={(e) => this.showConfirmDialog(e)} 
                     tooltip={tooltip}
                     tooltipOptions={this.tooltipOptions}/>
-                <label htmlFor="onLabel" style={{marginLeft: '0.25em', color: 'black'}}>ON</label>
+                {/* <label htmlFor="onLabel" style={{marginLeft: '0.25em', color: 'black'}}>ON</label> */}
             </div>
 
             <CustomDialog type="confirmation" visible={this.state.showDialog} width={'35vw'}