Skip to content

Neeraj Add Organizer Dropdown Participation Page #5267

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
Neeraj-Kondaveeti wants to merge 2 commits into
base: development
Choose a base branch
from
+65 −21
Open

Neeraj Add Organizer Dropdown Participation Page #5267

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
15a4657
chore: initialize organizer dropdown participation page task
Neeraj-Kondaveeti May 13, 2026
9ecaed7
Add organizer dropdown to participation page
Neeraj-Kondaveeti May 22, 2026
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
50 changes: 33 additions & 17 deletions src/components/CommunityPortal/Reports/Participation/EventParticipation.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ function EventParticipation() {
const darkMode = useSelector(state => state.theme.darkMode);
const exportRef = useRef(null);
const [exporting, setExporting] = useState(false);
const [selectedOrganizer, setSelectedOrganizer] = useState('All Organizers');

const handleSaveAsPDF = useCallback(() => {
if (globalThis.window === undefined || globalThis.document === undefined) return;
Expand Down Expand Up @@ -57,23 +58,38 @@ function EventParticipation() {
>
Social And Recreational Management
</h1>
<button
className={`${styles.savePdfBtn} ${
darkMode ? styles.savePdfBtnDark : styles.savePdfBtnLight
} ${styles.noPrint}`}
onClick={handleSaveAsPDF}
disabled={exporting}
aria-busy={exporting}
>
{exporting ? (
'Preparing…'
) : (
<>
<FontAwesomeIcon icon={faFilePdf} style={{ marginRight: '6px' }} />
Save as PDF
</>
)}
</button>
<div className={styles.headerActions}>
<button
className={`${styles.savePdfBtn} ${
darkMode ? styles.savePdfBtnDark : styles.savePdfBtnLight
} ${styles.noPrint}`}
onClick={handleSaveAsPDF}
disabled={exporting}
aria-busy={exporting}
>
{exporting ? (
'Preparing…'
) : (
<>
<FontAwesomeIcon icon={faFilePdf} style={{ marginRight: '6px' }} />
Save as PDF
</>
)}
</button>

<select
className={`${styles.organizerDropdown} ${
darkMode ? styles.organizerDropdownDark : ''
}`}
value={selectedOrganizer}
onChange={e => setSelectedOrganizer(e.target.value)}
>
<option value="All Organizers">All Organizers</option>
<option value="Organizer 1">Organizer 1</option>
<option value="Organizer 2">Organizer 2</option>
<option value="Organizer 3">Organizer 3</option>
</select>
</div>
</header>

<MyCases />
Expand Down
2 changes: 1 addition & 1 deletion src/components/CommunityPortal/Reports/Participation/MyCases.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ function MyCases() {
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);

const isExporting =
typeof document !== 'undefined' && document.documentElement?.dataset?.exporting === 'true'; // Sonar: prefer .dataset
typeof document !== 'undefined' && document.documentElement?.dataset?.exporting === 'true';

const filterEvents = events => {
const now = new Date();
Expand Down
34 changes: 31 additions & 3 deletions src/components/CommunityPortal/Reports/Participation/Participation.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,34 @@
letter-spacing: 0.5px;
}

.headerActions {
display: flex;
align-items: center;
gap: 12px;
}

.organizerDropdown {
padding: 8px 14px;
border-radius: 6px;
border: 1px solid #d1d5db;
background-color: #fff;
color: #333;
font-size: 14px;
min-width: 180px;
cursor: pointer;
}

.organizerDropdown:focus {
outline: none;
border-color: #3b82f6;
}

.organizerDropdownDark {
background-color: #1e293b;
color: #fff;
border: 1px solid #475569;
}

/* ---------- Save as PDF button ---------- */
.savePdfBtn {
font-size: 14px;
Expand Down Expand Up @@ -1113,7 +1141,7 @@

.insightsDark .insightsTab.activeTab {
background-color: #007bff;
color: #ffffff;
color: #fff;

Check warning on line 1144 in src/components/CommunityPortal/Reports/Participation/Participation.module.css

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Text does not meet the minimal contrast requirement with its background. 


See more on https://sonarcloud.io/project/issues?id=OneCommunityGlobal_HighestGoodNetworkApp&issues=AZ5RVy4pXSDqH0AcqTvA&open=AZ5RVy4pXSDqH0AcqTvA&pullRequest=5267
}

/* ---------- Info Tooltip Icons ---------- */
Expand All @@ -1130,9 +1158,9 @@
}

.trackingTableDark .infoIcon {
color: #cccccc;
color: #ccc;
}

.trackingTableDark .infoIcon:hover {
color: #ffffff;
color: #fff;
}
Loading