fix

client/src/components/events/EventsCalendar.js

@@ -30,7 +30,6 @@ const EventsCalendar = () => {
 	const [currentTotalTranslate1, setCurrentTotalTranslate1] = useState(0);
 	const [currentTotalTranslate2, setCurrentTotalTranslate2] = useState(0);
 	const [currentTotalResource, setCurrentTotalResource] = useState(0);
-	const [showDeletedItems, setShowDeletedItems] = useState(false);
 	const [selectedColorFilters, setSelectedColorFilters] = useState([]);
 	const [timeData, setTimeData] = useState([]);
 	const [showFilterDropdown, setShowFilterDropdown] = useState(false);
@@ -213,16 +212,23 @@ const EventsCalendar = () => {
 				item.totalResource = totalResource;
 				setCurrentTotalResource(item.totalResource);
 				return item;
-			})?.filter(item => (!showDeletedItems && item.status === 'active') || showDeletedItems)
+			})?.filter(item => {
+				const includeDeleted = selectedColorFilters.includes('gray');
+				if (item.status === 'active') return true;
+				return includeDeleted;
+			})
 			?.filter(item => {
 				if (selectedColorFilters.length === 0) return true;
+				if (item.status !== 'active') {
+					return selectedColorFilters.includes('gray');
+				}
 				if (selectedColorFilters.includes(item.color)) return true;
 				// When "Drop-Off Only" (purple) is selected, also show events with no label
 				if (selectedColorFilters.includes('purple') && !item.color) return true;
 				return false;
 			}));
 		}
-	}, [customers, resources, timeData, allEvents, showDeletedItems, selectedColorFilters])
+	}, [customers, resources, timeData, allEvents, selectedColorFilters])
 
 
 
@@ -308,7 +314,6 @@ const EventsCalendar = () => {
 
 	const cleanFilterAndClose = () => {
     setShowFilterDropdown(false);
-    setShowDeletedItems(false);
 		setSelectedColorFilters([]);
   }
 
@@ -346,12 +351,6 @@ const EventsCalendar = () => {
           aria-labelledby={labeledBy}
         >
           <h6>Filter By</h6>
-          <div className="app-main-content-fields-section margin-sm dropdown-container">
-            <div className="me-4">
-              <div className="field-label">Show Deleted Events</div>
-							<input type="checkbox" value={showDeletedItems} checked={showDeletedItems === true} onClick={() => setShowDeletedItems(!showDeletedItems)} />
-            </div>
-          </div>
 					<hr style={{ margin: '8px 0' }} />
 					<div style={{ display: 'flex', flexDirection: 'column' }}>
 						<div className="field-label" style={{ marginBottom: '8px' }}>Filter by Type</div>