Skip to content

Rajasrivatsan Srivatsan taking over Aswin - Add Rental Tracking dropdown section to Total Construction Dashboard #4569

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Aswin20010 wants to merge 2 commits into
base: development
Choose a base branch
from
Open

Rajasrivatsan Srivatsan taking over Aswin - Add Rental Tracking dropdown section to Total Construction Dashboard #4569

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
622a2e4
Add Rental Tracking dropdown section to Total Construction Dashboard
Dec 16, 2025
6a15e6d
Fix dark mode dropdown and input text visibility in Returned Late chart
Dec 17, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/components/BMDashboard/RentalChart/ReturnedLateChart.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -249,18 +249,18 @@ export default function ReturnedLateChart() {
className={styles['returned-late-date-picker']}
/>
</div>
<div className={styles['returned-late-filter-group']}>
<div className={`${styles['returned-late-filter-group']}`}>
<label
htmlFor="end-date-picker"
className={`${styles['returned-late-filter-label']} ${darkMode ? 'text-white' : ''}`}
className={`${styles['returned-late-filter-label']}${darkMode ? 'text-white' : ''}`}
>
To:
</label>
<DatePicker
id="end-date-picker"
selected={dateRange.endDate}
onChange={handleEndDateChange}
className={styles['returned-late-date-picker']}
className={`${styles['returned-late-date-picker']}${darkMode ? 'text-white' : ''}`}
/>
</div>
</div>
Expand Down
53 changes: 47 additions & 6 deletions src/components/BMDashboard/RentalChart/ReturnedLateChart.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,11 @@
font-weight: bold;
}

/* Dark mode title */
.bg-oxford-blue .returned-late-chart h1 {
color: #ffffff;
}

.returned-late-filters {
display: flex;
gap: 20px;
Expand All @@ -28,6 +33,11 @@
color: #333;
}

/* Dark mode labels */
.bg-oxford-blue .returned-late-filter-label {
color: #ffffff;
}

.returned-late-project-select {
padding: 8px;
min-width: 180px;
Expand All @@ -52,6 +62,7 @@
position: relative;
}

/* Loading state */
.returned-late-loading {
display: flex;
justify-content: center;
Expand All @@ -61,15 +72,22 @@
color: #666;
}

.bg-oxford-blue .returned-late-loading {
color: #ffffff;
}

/* ✅ FINAL ERROR STYLE — SAME FOR LIGHT & DARK */
.returned-late-error {
color: #d32f2f;
padding: 16px;
background-color: #ffebee;
border: 1px solid #ffcdd2;
border-radius: 4px;
color: #ffffff !important;
background-color: #b3261e; /* consistent error red */
padding: 14px 16px;
border-radius: 6px;
margin: 20px 0;
font-weight: 500;
text-align: center;
}

/* No data state */
.returned-late-no-data {
display: flex;
justify-content: center;
Expand All @@ -78,4 +96,27 @@
font-size: 16px;
color: #666;
font-style: italic;
}
}

.bg-oxford-blue .returned-late-no-data {
color: #ffffff;
}

/* Fix select dropdown readability in dark mode */
.bg-oxford-blue select {
background-color: #ffffff;
color: #333333;
border: 1px solid #cccccc;
}

/* Ensure option text is readable */
.bg-oxford-blue select option {
color: #333333;
background-color: #ffffff;
}

/* Disabled / default-looking state fix */
.bg-oxford-blue select:disabled {
color: #333333;
background-color: #f5f5f5;
}
24 changes: 24 additions & 0 deletions src/components/BMDashboard/WeeklyProjectSummary/WeeklyProjectSummary.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@ import IssueCharts from '../Issues/openIssueCharts';
import SupplierPerformanceGraph from './SupplierPerformanceGraph.jsx';
import MostFrequentKeywords from './MostFrequentKeywords/MostFrequentKeywords';
import DistributionLaborHours from './DistributionLaborHours/DistributionLaborHours';
import RentalChart from '../RentalChart/RentalChart';
import ReturnedLateChart from '../RentalChart/ReturnedLateChart';

const projectStatusButtons = [
{
Expand Down Expand Up @@ -365,6 +367,28 @@ function WeeklyProjectSummary() {
);
}),
},
{
title: 'Rental Tracking',
key: 'Rental Tracking',
className: 'full',
content: (
<div
style={{
display: 'grid',
gridTemplateColumns: '1fr',
gap: '12px',
}}
>
<div className={`${styles.weeklyProjectSummaryCard} ${styles.normalCard}`}>
<RentalChart />
</div>

<div className={`${styles.weeklyProjectSummaryCard} ${styles.normalCard}`}>
<ReturnedLateChart />
</div>
</div>
),
},
{
title: 'Financials Tracking',
key: 'Financials Tracking',
Expand Down
Loading