Jaden taking over for Carlos/Shravan fix conflicts 4351 (DONE Jaden)

src/actions/bmdashboard/issueChartActions.js

@@ -53,10 +53,8 @@ const formatFilters = ({ projectIds, startDate, endDate } = {}) => {
   ) {
     formatted.projectIds = Array.isArray(projectIds) ? projectIds.join(',') : projectIds.trim();
   }
-  if (startDate !== undefined && startDate !== '') {
+  if (startDate !== undefined && startDate !== '' && endDate !== undefined && endDate !== '') {
     formatted.startDate = startDate;
-  }
-  if (endDate !== undefined && endDate !== '') {
     formatted.endDate = endDate;
   }
   return formatted;
@@ -69,7 +67,7 @@ export const fetchLongestOpenIssues = filters => async dispatch => {
     const response = await axios.get(ENDPOINTS.BM_LONGEST_OPEN_ISSUES, {
       params: formattedFilters,
     });
-    dispatch({ type: FETCH_LONGEST_OPEN_ISSUES_SUCCESS, payload: response.data });
+    dispatch({ type: FETCH_LONGEST_OPEN_ISSUES_SUCCESS, payload: response.data.data });
   } catch (error) {
     dispatch({
       type: FETCH_LONGEST_OPEN_ISSUES_FAILURE,
@@ -85,7 +83,7 @@ export const fetchMostExpensiveIssues = filters => async dispatch => {
     const response = await axios.get(ENDPOINTS.BM_MOST_EXPENSIVE_ISSUES, {
       params: formattedFilters,
     });
-    dispatch({ type: FETCH_MOST_EXPENSIVE_ISSUES_SUCCESS, payload: response.data });
+    dispatch({ type: FETCH_MOST_EXPENSIVE_ISSUES_SUCCESS, payload: response.data.data });
   } catch (error) {
     dispatch({
       type: FETCH_MOST_EXPENSIVE_ISSUES_FAILURE,

src/components/BMDashboard/InteractiveMap/InteractiveMap.jsx

@@ -541,17 +541,17 @@ export default function InteractiveMap() {
                         <div style={{ marginBottom: '8px' }}>
                           <strong>Status:</strong>{' '}
                           <span
-                            style={{
-                              color:
-                                org.status === 'active'
-                                  ? '#DE6A6A'
-                                  : org.status === 'delayed'
-                                  ? '#E3D270'
-                                  : org.status === 'completed'
-                                  ? '#6ACFDE'
-                                  : '#AAAAAA',
-                              fontWeight: 'bold',
-                            }}
+                            className={
+                              // eslint-disable-next-line no-nested-ternary
+                              org.status === 'active'
+                                ? styles.statusActive
+                                : // eslint-disable-next-line no-nested-ternary
+                                org.status === 'delayed'
+                                ? styles.statusDelayed
+                                : org.status === 'completed'
+                                ? styles.statusCompleted
+                                : styles.statusDefault
+                            }
                           >
                             {org.status}
                           </span>

src/components/BMDashboard/InteractiveMap/InteractiveMap.module.css

@@ -376,6 +376,10 @@
   filter: invert(1) hue-rotate(180deg) brightness(0.95) contrast(0.9) saturate(0.6);
 }
 
+.darkMap :global(.leaflet-tile-pane) {
+  filter: invert(1) hue-rotate(180deg) brightness(0.9) contrast(0.9);
+}
+
 /* ----------------------------------
    POPUPS
 ---------------------------------- */
@@ -487,6 +491,48 @@
   margin-right: 8px;
 }
 
+/* ----------------------------------
+   POPUP STATUS TEXT
+---------------------------------- */
+.statusActive,
+.statusDelayed,
+.statusCompleted,
+.statusDefault {
+  font-weight: 700;
+}
+
+.statusActive {
+  color: #b84040;
+}
+
+.statusDelayed {
+  color: #8a6d00;
+}
+
+.statusCompleted {
+  color: #1a8fa0;
+}
+
+.statusDefault {
+  color: #666;
+}
+
+.darkPage .statusActive {
+  color: #ff8a80;
+}
+
+.darkPage .statusDelayed {
+  color: #ffd166;
+}
+
+.darkPage .statusCompleted {
+  color: #5ee2f0;
+}
+
+.darkPage .statusDefault {
+  color: #ccc;
+}
+
 /* ----------------------------------
    POPUP BUTTON
 ---------------------------------- */

src/components/BMDashboard/Issues/LongestOpenIssuesChart.jsx

@@ -22,9 +22,7 @@ function IssuesCharts({ bmProjects = [] }) {
   const [selectedProjects, setSelectedProjects] = useState([]);
   const [dateRange, setDateRange] = useState({ start: null, end: null });
 
-  const { longestOpenIssues = [], mostExpensiveIssues = [] } = useSelector(
-    state => state.issue || {},
-  );
+  const { longestOpenIssues, mostExpensiveIssues } = useSelector(state => state.issue || {});
   const darkMode = useSelector(state => state.theme.darkMode);
 
   useEffect(() => {
@@ -41,7 +39,8 @@ function IssuesCharts({ bmProjects = [] }) {
     }
   }, [graphType, selectedProjects, dateRange.start, dateRange.end, dispatch]);
 
-  const chartData = graphType === 'Longest Open' ? longestOpenIssues : mostExpensiveIssues;
+  const rawChartData = graphType === 'Longest Open' ? longestOpenIssues : mostExpensiveIssues;
+  const chartData = Array.isArray(rawChartData) ? rawChartData : [];
 
   const data = {
     labels: chartData.map(issue => truncateLabel(issue.title || String(issue.issueId))),

src/components/BMDashboard/WeeklyProjectSummary/ActualVsPlannedCost/ActualVsPlannedCost.module.css

@@ -28,14 +28,26 @@
   width: 100%;
   max-height: 200px;
   overflow-y: auto;
-  background-color: var(--card-bg);
-  color: var(--text-color);
+  background-color: #fff;
+  color: #000;
   border: 1px solid var(--button-hover);
   border-radius: 4px;
   padding: 4px 8px;
   box-sizing: border-box;
 }
 
+.darkMode .selectorGroup select {
+  background-color: #253342;
+  color: #fff;
+  border-color: #4a5a77;
+  color-scheme: dark;
+}
+
+.darkMode .selectorGroup select option {
+  background-color: #253342;
+  color: #fff;
+}
+
 .chartCaption {
   text-align: center;
   font-size: medium;

src/components/BMDashboard/WeeklyProjectSummary/DistributionLaborHours/DistributionLaborHours.jsx

@@ -6,20 +6,22 @@ import styles from './DistributionLaborHours.module.css';
 
 const COLORS = ['#4f8fa8', '#3fa4b8', '#ffab91', '#ffccbb', '#c7c7c7', '#f9f3e3'];
 
+const SWATCH_CLASSES = [
+  styles.swatch0,
+  styles.swatch1,
+  styles.swatch2,
+  styles.swatch3,
+  styles.swatch4,
+  styles.swatch5,
+];
+
 const CustomTooltip = ({ active, payload, total, darkMode }) => {
   if (active && payload && payload.length) {
     const { name, value } = payload[0];
     const percent = total > 0 ? ((value / total) * 100).toFixed(1) : '0.0';
 
     return (
-      <div
-        className={styles.tooltip}
-        style={{
-          backgroundColor: darkMode ? '#2e3e5a' : '#fff',
-          color: darkMode ? '#fff' : '#000',
-          border: darkMode ? '1px solid #64748b' : '1px solid #ccc',
-        }}
-      >
+      <div className={`${styles.tooltip} ${darkMode ? styles.tooltipDark : styles.tooltipLight}`}>
         <p>{name}</p>
         <p>{`Hours: ${value} hrs`}</p>
         <p>{`Percentage: ${percent}%`}</p>
@@ -298,17 +300,13 @@ export default function DistributionLaborHours() {
                 {filteredData.map((entry, index) => (
                   <div key={entry.name} className={styles.legendItem}>
                     <span
-                      className={styles.colorBox}
-                      style={{
-                        backgroundColor: COLORS[index % COLORS.length],
-                      }}
+                      className={`${styles.colorBox} ${
+                        SWATCH_CLASSES[index % SWATCH_CLASSES.length]
+                      }`}
                     />
 
                     <span
-                      className={styles.legendText}
-                      style={{
-                        color: darkMode ? '#f5f5f5' : '#000',
-                      }}
+                      className={`${styles.legendText} ${darkMode ? styles.legendTextDark : ''}`}
                     >
                       {entry.name}: {entry.value} hrs
                     </span>

src/components/BMDashboard/WeeklyProjectSummary/DistributionLaborHours/DistributionLaborHours.module.css

@@ -381,6 +381,11 @@
   min-width: 0;
   overflow-wrap: anywhere;
   line-height: 1.3;
+  color: #000;
+}
+
+.legendTextDark {
+  color: #f5f5f5;
 }
 
 .colorBox {
@@ -394,6 +399,30 @@
   flex-shrink: 0;
 }
 
+.swatch0 {
+  background-color: #4f8fa8;
+}
+
+.swatch1 {
+  background-color: #3fa4b8;
+}
+
+.swatch2 {
+  background-color: #ffab91;
+}
+
+.swatch3 {
+  background-color: #ffccbb;
+}
+
+.swatch4 {
+  background-color: #c7c7c7;
+}
+
+.swatch5 {
+  background-color: #f9f3e3;
+}
+
 /* =========================
    PIE
    ========================= */
@@ -428,6 +457,20 @@
   margin: 2px 0;
 }
 
+.tooltipLight {
+  border: 1px solid #ccc;
+
+  background-color: #fff;
+  color: #000;
+}
+
+.tooltipDark {
+  border: 1px solid #64748b;
+
+  background-color: #2e3e5a;
+  color: #fff;
+}
+
 :global(.dark) .tooltip,
 :global(.dark-mode) .tooltip,
 :global(.bm-dashboard-dark) .tooltip,

src/components/BMDashboard/WeeklyProjectSummary/Financials/CostBreakDown/CostBreakDown.module.css

@@ -344,6 +344,14 @@
 .wrapperDark .filterSelect,
 .wrapperDark .filterInput {
   color-scheme: dark;
+  background: #2b3e59;
+  color: #fff;
+  border-color: #4a5a77;
+}
+
+.wrapperDark .filterInput[type='date']::-webkit-datetime-edit,
+.wrapperDark .filterInput[type='date']::-webkit-datetime-edit-fields-wrapper {
+  color: #fff;
 }
 
 .wrapperDark .filterInput[type='date']::-webkit-calendar-picker-indicator {

src/components/BMDashboard/WeeklyProjectSummary/Financials/CostVarianceTrendGraph.jsx

@@ -253,7 +253,7 @@ export default function CostVarianceTrendGraph() {
 
   const containerClass = `${styles.varianceContainer} ${darkMode ? styles.darkMode : ''}`;
   const dateInputClass = `${styles.dateInput} ${darkMode ? styles.darkDateInput : ''}`;
-  const calendarClass = darkMode ? 'paid-labor-cost-dark-calendar' : '';
+  const calendarClass = darkMode ? 'cost-variance-dark-calendar' : '';
   const tooltipCursorFill = darkMode ? 'rgba(255,255,255,0.05)' : 'rgba(0,0,0,0.05)';
 
   if (initialLoading) {