Update review comments

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

@@ -2,7 +2,8 @@ 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 { ToggleButton } from 'primereact/togglebutton';
+import {InputSwitch} from 'primereact/inputswitch';
+import AuthStore from '../authenticate/auth.store';
 
 export default class DynamicScheduler extends Component {
     constructor(props) {
@@ -11,6 +12,7 @@ export default class DynamicScheduler extends Component {
         this.state= {
             dsStatus: false, // Dynamic Scheduler Status
             showDialog: false,
+            userrole: AuthStore.getState(),
         }
         this.currentStatus = null;
         this.updateDSStatus = this.updateDSStatus.bind(this);
@@ -59,19 +61,23 @@ 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"
         return (
             <>
             <Growl ref={(el) => this.growl = el} />
             <div className="p-field p-grid">
-                <label htmlFor="autodeletion" style={{marginRight: '10px', marginLeft: '50px'}}>Dynamic Scheduling : </label>
-                <ToggleButton onLabel="On" offLabel="Off" onIcon="pi pi-check" offIcon="pi pi-times" style={{top: '-4px'}}
+                <label htmlFor="autodeletion" style={{marginRight: '10px', marginLeft: '1em'}}>Dynamic Scheduling :</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={`Click to ${this.state.dsStatus? "'Switch Off'" : "'Switch On'"} the Dynamic Scheduling`}
+                    tooltip={tooltip}
                     tooltipOptions={this.tooltipOptions}/>
+                <label htmlFor="onLabel" style={{marginLeft: '0.25em', color: 'black'}}>ON</label>
             </div>
 
             <CustomDialog type="confirmation" visible={this.state.showDialog} width={'35vw'}
-                    header={'Confirmation'} message={`Are you sure want to switch ${this.currentStatus === true ? 'On' : 'Off'} the Dynamic Scheduling?` } 
+                    header={'Confirmation'} message={`Do you want to turn ${this.currentStatus === true ? 'On' : 'Off'} Dynamic Scheduling?` } 
                     content={''} showIcon={true}
                     onClose={this.closeDialog} onCancel={this.closeDialog} onSubmit={this.updateDSStatus}
                      />