diff --git a/SAS/TMSS/frontend/tmss_webapp/src/authenticate/permission.stack.handler.js b/SAS/TMSS/frontend/tmss_webapp/src/authenticate/permission.stack.handler.js
index 709589985c0be13878f5a21a91adcc19be862904..14a8bdddfd9a3526662a003c79ae4817b2577c75 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/authenticate/permission.stack.handler.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/authenticate/permission.stack.handler.js
@@ -142,7 +142,8 @@ const PermissionStackUtil = {
             permissionStack[module][id] ={ 
                 view : allowedPermission?(_.includes(allowedPermission, 'GET')):false,
                 edit : allowedPermission?(_.includes(allowedPermission, 'PUT')):false,
-                delete : allowedPermission?(_.includes(allowedPermission, 'DELETE')):false
+                delete : allowedPermission?(_.includes(allowedPermission, 'DELETE')):false,
+                cancel : allowedPermission?(_.includes(allowedPermission, 'POST')):false
             }
         }
         AuthStore.dispatch({ type: 'loadpermissionbyid', payload: permissionStack, id: id, module: module});
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js b/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js
index ddd82a563391a545833564a870b7a5107a05ed78..6cb399c3a25f4490eccbfb512c60259dc5537a71 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js
@@ -809,7 +809,6 @@ function FlatpickrRangeColumnFilter({
             title={(tableToolTipsState[Header])?tableToolTipsState[Header]:"Enter the date & time range to search and press ‘Ok’ button"}
             value={filterValue}
             onClose={value => {
-              if(value.length === 2) {
                   setValue(value);
                   setFilter(value);
                   if(storeFilter) {
@@ -819,7 +818,6 @@ function FlatpickrRangeColumnFilter({
                     setFiltered(true);
                     callServerFilter(value);
                   }
-              }
             }}
           >
               <input type="text" data-input className={`p-inputtext p-component calendar-input`}  />
@@ -1113,11 +1111,16 @@ function dateFilterFn(rows, id, filterValue) {
     let rowValue = moment.utc(row.values[id].split('.')[0]);
     if (!rowValue.isValid()) {
       // For cell data in format 'YYYY-MMM-DD'
-      rowValue = moment.utc(moment(row.values[id], 'YYYY-MM-DD').format("YYYY-MM-DDT00:00:00"));
+      rowValue = moment.utc(moment(row.values[id], 'YYYY-MM-DDTHH:mm:SS').format("YYYY-MM-DDTHH:mm:SS"));
+    }
+    const start = moment.utc(moment(filterValue[0], 'YYYY-MM-DDTHH:mm:SS').format("YYYY-MM-DDTHH:mm:SS"));
+    const end = moment.utc(moment(filterValue[1], 'YYYY-MM-DDTHH:mm:SS').format("YYYY-MM-DDTHH:mm:SS"));
+    if(filterValue.length === 1) {
+      return (start.isSameOrBefore(rowValue));
+    }
+    else {
+      return (start.isSameOrBefore(rowValue) && end.isSameOrAfter(rowValue));
     }
-    const start = moment.utc(moment(filterValue[0], 'YYYY-MM-DD').format("YYYY-MM-DDT00:00:00"));
-    const end = moment.utc(moment(filterValue[1], 'YYYY-MM-DD').format("YYYY-MM-DDT23:59:59"));
-    return (start.isSameOrBefore(rowValue) && end.isSameOrAfter(rowValue));
   });
   return filteredRows;
 }
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/routes/Task/view.js b/SAS/TMSS/frontend/tmss_webapp/src/routes/Task/view.js
index e04a0900540981ad8fbbc0c61334cb37635c71a1..5561ff784893e9f251b5dcb579adb94f0ba5ae92 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/routes/Task/view.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/routes/Task/view.js
@@ -65,6 +65,7 @@ export class TaskView extends Component {
                 duration:{
                     name:"Duration (HH:mm:ss)",
                     filter: "durationMinMax",
+                    format:UIConstants.CALENDAR_TIME_FORMAT
                 },
                 parset: {
                     name: "Link to Parset",
@@ -329,7 +330,7 @@ export class TaskView extends Component {
             this.setState({ confirmDialogVisible: false, task: task, actions: actions});
         }
     }
-    
+
     async getStatusList(type) {
         const taskFilters = await TaskService.getTaskFilterDefinition(type);
         if (taskFilters.data.filters['status']) {
@@ -386,15 +387,17 @@ export class TaskView extends Component {
                             title: 'Cannot edit blueprint'}];
             if (this.state.task) {
                 actions.push({icon: 'fa-ban', type: 'button', actOn: 'click', 
-                                    title: this.TASK_END_STATUSES.indexOf(this.state.task.status.toLowerCase())>=0?'Cannot Cancel Task':'Cancel Task', 
-                                    disabled:this.TASK_END_STATUSES.indexOf(this.state.task.status.toLowerCase())>=0, 
+                                    title: this.TASK_END_STATUSES.indexOf(this.state.task.status.toLowerCase())>=0?'Cannot Cancel Task':
+                                    this.state.permissionById && this.state.permissionById[this.state.taskId].cancel? 'Cancel Task': `${this.access_denied_message} to cancel`,
+                                    disabled:this.TASK_END_STATUSES.indexOf(this.state.task.status.toLowerCase())>=0? true:
+                                    this.state.permissionById && this.state.permissionById[this.state.taskId].cancel? false: true, 
                                     props: { callback: this.showCancelConfirmation }
                                 });
             }
         }
         actions.push({icon: 'fa fa-trash',title:this.state.hasBlueprint ? 'Cannot delete Draft when Blueprint exists':
                         this.state.permissionById && this.state.permissionById[this.state.taskId].delete? 'Delete Task': `${this.access_denied_message} to delete`,  
-                        type: 'button',  disabled: this.state.hasBlueprint ? false:
+                        type: 'button',  disabled: this.state.hasBlueprint ? true:
                         this.state.permissionById && this.state.permissionById[this.state.taskId].delete? false: true, actOn: 'click', props:{ callback: this.showDeleteConfirmation}});
         actions.push({  icon: 'fa-window-close', link: this.props.history.goBack,
                         title:'Click to Close Task', props : { pathname:'/schedulingunit' }});
@@ -544,6 +547,7 @@ export class TaskView extends Component {
                                                     showFilterOption={this.getFilterOptions}
                                                     paths={this.state.paths}
                                                     lsKeySortColumn={this.lsKeySortColumn}
+                                                    storeFilter={true}
                                                     toggleBySorting={(sortData) => this.toggleBySorting(sortData)}
                                                     tablename="subtask_list"
                                                 />