fix

client/src/components/trans-routes/RoutesDashboard.js

@@ -90,6 +90,7 @@ const RoutesDashboard = () => {
   const [customerTypeFixing, setCustomerTypeFixing] = useState({});
   const [customerSpecialNeedsFixing, setCustomerSpecialNeedsFixing] = useState({});
   const [customerNoteFixing, setCustomerNoteFixing] = useState({});
+  const [isFutureScheduleEditMode, setIsFutureScheduleEditMode] = useState(false);
   const scheduleImportProgressTimerRef = useRef(null);
 
 
@@ -705,6 +706,12 @@ const RoutesDashboard = () => {
   const yesterday = new Date();
   const tomorrow = new Date();
   const isFutureScheduleSelected = moment(dateSelected).startOf('day').isAfter(moment().startOf('day'));
+  const shouldShowFutureEditView = isFutureScheduleSelected && isFutureScheduleEditMode;
+  const shouldShowReadOnlyOverview = !isFutureScheduleSelected || !isFutureScheduleEditMode;
+
+  useEffect(() => {
+    setIsFutureScheduleEditMode(false);
+  }, [dateSelected]);
 
   const startScheduleImportProgress = (label) => {
     if (scheduleImportProgressTimerRef.current) {
@@ -1761,10 +1768,10 @@ const RoutesDashboard = () => {
                 <button className="btn btn-primary me-2" onClick={() => copyYesterdayRoutes()}><Copy size={16} className="me-2"></Copy>{showCopyDateLoading? <Spinner size={12}></Spinner> : `Copy Yesterday Routes`}</button>
                 <button className="btn btn-primary" onClick={() => generateRouteReport()}><Download size={16} className="me-2"></Download>Export Route Report</button>
               </div>}
-              {(dateSelected && dateSelected > new Date()) && <div className="app-main-content-fields-section with-function">
+              {isFutureScheduleSelected && <div className="app-main-content-fields-section with-function">
                 {/* <button type="button" className="btn btn-primary btn-sm me-2" onClick={()=> validateSchedule()}><Check  size={16} className="me-2"></Check> Validate and Finish Planning</button> */}
               </div>}
-              { (dateSelected <= new Date() || !dateSelected) && <div className="list row">
+              {shouldShowReadOnlyOverview && <div className="list row">
                 {
                   showCopyDateTargetLoading ? <><Spinner></Spinner></> : <>
                     <div className="col-md-12 mb-4">
@@ -1774,7 +1781,7 @@ const RoutesDashboard = () => {
                             View and Update Daily Route Templates
                           </button> */}
                         </div>
-                      ) : (
+                      ) : (!isFutureScheduleSelected && (
                         <div style={{display: 'flex', alignItems: 'center', gap: '10px'}}>
                           <select 
                             className="form-select" 
@@ -1801,7 +1808,7 @@ const RoutesDashboard = () => {
                             View and Update Daily Route Templates
                           </button> */}
                         </div>
-                      )}
+                      ))}
                     </div>
                     <div className="col-md-12 mb-4">
                       <RoutesSection transRoutes={routesInboundForShowing} drivers={drivers} vehicles={vehicles} sectionName="Inbound Routes"/>
@@ -1814,7 +1821,7 @@ const RoutesDashboard = () => {
                 
               </div>}
               {
-                dateSelected > new Date() && <>
+                shouldShowFutureEditView && <>
                   {errorMessage && <div className="alert alert-danger alert-dismissible fade show" role="alert">
                   {errorMessage}
                     <button onClick={() => setErrorMessage(undefined)} type="button" className="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
@@ -1933,7 +1940,7 @@ const RoutesDashboard = () => {
                     </Dropdown.Toggle>
                     <Dropdown.Menu as={customMenuOriginDate}/> 
                   </Dropdown>
-                  {isFutureScheduleSelected && <>
+                  {isFutureScheduleSelected && isFutureScheduleEditMode && <>
                     <Dropdown
                       key={'import-from-date'}
                       id="import-from-date"
@@ -1969,6 +1976,11 @@ const RoutesDashboard = () => {
                   </>}
                   </>
                 }
+                {isFutureScheduleSelected && !isFutureScheduleEditMode && AuthService.canAddOrEditRoutes() && (
+                  <button className="btn btn-primary me-2" onClick={() => setIsFutureScheduleEditMode(true)}>
+                    Edit Schedule
+                  </button>
+                )}
                 {!isFutureScheduleSelected && <button className="btn btn-primary me-2" onClick={() => goToCreateRoute()}><Plus size={16}></Plus>Add New Route</button>}
               </>
             }