Skip to content

Sphurthy fix: scrolling in all events page #5030

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

Merged
one-community merged 3 commits into from
Jun 25, 2026
Merged

Sphurthy fix: scrolling in all events page #5030

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
decc9cb
fix: scrolling in all events page
sphurthy Mar 20, 2026
7268657
Merge branch 'development' into sphurthy-fix-scrolling-in-all-events-…
sphurthy Jun 23, 2026
823cb8a
resolved merge conflicts
sphurthy Jun 23, 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
147 changes: 142 additions & 5 deletions src/components/CommunityPortal/CPDashboard.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,19 @@
import { useState, useEffect, useMemo } from 'react';
import PropTypes from 'prop-types';
import { useSelector } from 'react-redux';
import { Container, Row, Col, Card, CardBody, Button, Input, Label } from 'reactstrap';
import {
Container,
Row,
Alert,

Check warning on line 8 in src/components/CommunityPortal/CPDashboard.jsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Remove this unused import of 'Alert'. 


See more on https://sonarcloud.io/project/issues?id=OneCommunityGlobal_HighestGoodNetworkApp&issues=AZ72YVa6KoyPQ8JFWzpD&open=AZ72YVa6KoyPQ8JFWzpD&pullRequest=5030
Col,
Card,
CardBody,
Button,
Input,
FormGroup,
Label,
} from 'reactstrap';
import Select from 'react-select';
import { FaCalendarAlt, FaMapMarkerAlt, FaUserAlt, FaSearch, FaTimes } from 'react-icons/fa';
import styles from './CPDashboard.module.css';
import { ENDPOINTS } from '../../utils/URL';
Expand Down Expand Up @@ -324,7 +336,16 @@
const [searchQuery, setSearchQuery] = useState('');
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState(null);
const [pagination, setPagination] = useState({ currentPage: 1, total: 0, limit: 6 });
const [failedLogos, setFailedLogos] = useState(new Set());

Check warning on line 339 in src/components/CommunityPortal/CPDashboard.jsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Remove this useless assignment to variable "setFailedLogos". 


See more on https://sonarcloud.io/project/issues?id=OneCommunityGlobal_HighestGoodNetworkApp&issues=AZ72YVa6KoyPQ8JFWzpI&open=AZ72YVa6KoyPQ8JFWzpI&pullRequest=5030

Check warning on line 339 in src/components/CommunityPortal/CPDashboard.jsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Remove this useless assignment to variable "failedLogos". 


See more on https://sonarcloud.io/project/issues?id=OneCommunityGlobal_HighestGoodNetworkApp&issues=AZ72YVa6KoyPQ8JFWzpG&open=AZ72YVa6KoyPQ8JFWzpG&pullRequest=5030

Check warning on line 339 in src/components/CommunityPortal/CPDashboard.jsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Remove the declaration of the unused 'setFailedLogos' variable. 


See more on https://sonarcloud.io/project/issues?id=OneCommunityGlobal_HighestGoodNetworkApp&issues=AZ72YVa6KoyPQ8JFWzpH&open=AZ72YVa6KoyPQ8JFWzpH&pullRequest=5030

Check warning on line 339 in src/components/CommunityPortal/CPDashboard.jsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Remove the declaration of the unused 'failedLogos' variable. 


See more on https://sonarcloud.io/project/issues?id=OneCommunityGlobal_HighestGoodNetworkApp&issues=AZ72YVa6KoyPQ8JFWzpF&open=AZ72YVa6KoyPQ8JFWzpF&pullRequest=5030
const branchOptions = [{ value: '', label: 'Select branches', isDisabled: true }];
const themeOptions = [{ value: '', label: 'Select themes', isDisabled: true }];
const categoryOptions = [{ value: '', label: 'Select categories', isDisabled: true }];
const [pagination, setPagination] = useState({
currentPage: 1,
totalPages: 5,
total: 0,
limit: 6,
});

const FALLBACK_IMG =
'https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=600&q=60';
Expand Down Expand Up @@ -408,9 +429,125 @@
/>
</header>

<Row className={styles['dashboard-row']}>
<Col md={3} className={styles['dashboard-sidebar']}>
<FiltersSidebar darkMode={darkMode} />
<Row>
<Col md={3} className={`${styles.dashboardSidebar} ${darkMode ? styles.darkSidebar : ''}`}>
<div className={styles.filterSection}>
<h4>Search Filters</h4>
<div className={styles.filterSectionDivider}>
<div className={styles.filterItem}>
<label htmlFor="date-tomorrow"> Dates</label>
<div className={styles.radioRow}>
<FormGroup check className={styles.radioGroup + ' d-flex align-items-center'}>
<Input
id="date-tomorrow"
type="radio"
name="dates"
checked={dateFilter === 'tomorrow'}
onChange={() => setDateFilter('tomorrow')}
className={styles.radioInput}
/>
<Label
htmlFor="date-tomorrow"
check
className={styles.radioLabel + ' ms-2 mb-0'}
>
Tomorrow
</Label>
</FormGroup>
<FormGroup check className={styles.radioGroup + ' d-flex align-items-center'}>
<Input
id="date-weekend"
type="radio"
name="dates"
checked={dateFilter === 'weekend'}
onChange={() => setDateFilter('weekend')}
className={styles.radioInput}
/>
<Label
htmlFor="date-weekend"
check
className={styles.radioLabel + ' ms-2 mb-0'}
>
This Weekend
</Label>
</FormGroup>
</div>
<Button
color="primary"
size="sm"
onClick={() => {
setDateFilter('');
setSelectedDate('');
}}
>
Clear date filter
</Button>
<Input
type="date"
placeholder="Select Date"
className={styles.dateFilter}
value={selectedDate}
onChange={e => setSelectedDate(e.target.value)}
style={{ marginTop: '10px' }}
/>
</div>

<div className={styles.filterItem}>
<label htmlFor="online-only">Online</label>
<div>
<Input
type="checkbox"
id="online-only"
checked={onlineOnly}
onChange={e => {
setOnlineOnly(e.target.checked);
setPagination(prev => ({ ...prev, currentPage: 1 }));
}}
/>{' '}
Online Only
</div>
</div>

<div className={styles.filterItem}>
<label htmlFor="branches">Branches</label>
<Select
inputId="branches"
classNamePrefix="cp-dashboard-filter"
options={branchOptions}
placeholder="Select branches"
isSearchable={false}
menuShouldBlockScroll={false}
menuPlacement="auto"
/>
</div>

<div className={styles.filterItem}>
<label htmlFor="themes">Themes</label>
<Select
inputId="themes"
classNamePrefix="cp-dashboard-filter"
options={themeOptions}
placeholder="Select themes"
isSearchable={false}
menuShouldBlockScroll={false}
menuPlacement="auto"
/>
</div>

<div className={styles.filterItem}>
<label htmlFor="categories">Categories</label>
<Select
inputId="categories"
classNamePrefix="cp-dashboard-filter"
options={categoryOptions}
placeholder="Select categories"
isSearchable={false}
menuShouldBlockScroll={false}
menuPlacement="auto"
/>
</div>
</div>
</div>
</Col>

<Col md={9} className={styles['dashboard-main']}>
Expand Down
Loading