Skip to content

Commit 6ae12f4

Browse files
Adez017sanjay-kv
Adez017
and
sanjay-kv
committed
Fix the Spells on the dashboard
Co-Authored-By: Sanjay Viswanathan <[email protected]>
1 parent 472c366 commit 6ae12f4

File tree

2 files changed

+134
-134
lines changed

2 files changed

+134
-134
lines changed

‎src/components/dashboard/LeaderBoard/leaderboard.tsx‎

Lines changed: 63 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import PRListModal from "./PRListModal";
1616
import { mockContributors } from "./mockData";
1717
import "./leaderboard.css";
1818

19-
const GITHUB_ORG = "recodehive";
19+
const GITHUB_ORG = "recodehive";
2020

2121
// Users to exclude from the leaderboard
2222
const EXCLUDED_USERS = ["sanjay-kv", "allcontributors", "allcontributors[bot]"];
@@ -44,15 +44,15 @@ interface Stats {
4444
flooredTotalPoints: number;
4545
}
4646

47-
function Badge({
48-
count,
49-
label,
50-
color,
47+
function Badge({
48+
count,
49+
label,
50+
color,
5151
onClick,
52-
clickable = false
53-
}: {
54-
count: number;
55-
label: string;
52+
clickable = false
53+
}: {
54+
count: number;
55+
label: string;
5656
color: { background: string; color: string };
5757
onClick?: () => void;
5858
clickable?: boolean;
@@ -77,7 +77,7 @@ function Badge({
7777
};
7878

7979
return (
80-
<span
80+
<span
8181
className={`badge ${clickable ? 'clickable' : ''}`}
8282
style={badgeStyle}
8383
onClick={handleClick}
@@ -91,19 +91,19 @@ function Badge({
9191
);
9292
}
9393

94-
function TopPerformerCard({
95-
contributor,
96-
rank,
97-
onPRClick
98-
}: {
99-
contributor: Contributor;
94+
function TopPerformerCard({
95+
contributor,
96+
rank,
97+
onPRClick
98+
}: {
99+
contributor: Contributor;
100100
rank: number;
101101
onPRClick: (contributor: Contributor) => void;
102102
}) {
103103
const { colorMode } = useColorMode();
104104
const isDark = colorMode === "dark";
105105
const rankClass = rank === 1 ? "top-1" : rank === 2 ? "top-2" : "top-3";
106-
106+
107107
return (
108108
<div className={`top-performer-card ${isDark ? "dark" : "light"}`}>
109109
<img src={contributor.avatar} alt={contributor.username} className="avatar large" />
@@ -115,9 +115,9 @@ function TopPerformerCard({
115115
{contributor.username}
116116
</a>
117117
<div className="badges-container">
118-
<Badge
119-
count={contributor.prs}
120-
label="PRs"
118+
<Badge
119+
count={contributor.prs}
120+
label="PRs"
121121
color={{ background: "#dbeafe", color: "#2563eb" }}
122122
onClick={() => onPRClick(contributor)}
123123
clickable={true}
@@ -131,15 +131,15 @@ function TopPerformerCard({
131131

132132
export default function LeaderBoard(): JSX.Element {
133133
// Get time filter functions from context
134-
const {
135-
contributors,
136-
stats,
137-
loading,
138-
error,
139-
currentTimeFilter,
140-
setTimeFilter
134+
const {
135+
contributors,
136+
stats,
137+
loading,
138+
error,
139+
currentTimeFilter,
140+
setTimeFilter
141141
} = useCommunityStatsContext();
142-
142+
143143
const { colorMode } = useColorMode();
144144
const isDark = colorMode === "dark";
145145

@@ -165,15 +165,15 @@ export default function LeaderBoard(): JSX.Element {
165165
const displayContributors =
166166
(error || contributors.length === 0)
167167
? (typeof process !== "undefined" && process.env.NODE_ENV === "development"
168-
? mockContributors
169-
: [])
168+
? mockContributors
169+
: [])
170170
: contributors;
171171

172172

173173
// Filter out excluded users and apply search filter
174174
const filteredContributors = contributors
175-
.filter((contributor) =>
176-
!EXCLUDED_USERS.some(excludedUser =>
175+
.filter((contributor) =>
176+
!EXCLUDED_USERS.some(excludedUser =>
177177
contributor.username.toLowerCase() === excludedUser.toLowerCase()
178178
)
179179
)
@@ -191,7 +191,7 @@ export default function LeaderBoard(): JSX.Element {
191191
const renderPaginationButtons = () => {
192192
const pages = [];
193193
const maxVisibleButtons = 5; // Maximum number of page buttons to show directly
194-
194+
195195
// Special case: if we have 7 or fewer pages, show all of them without ellipsis
196196
if (totalPages <= 7) {
197197
for (let i = 1; i <= totalPages; i++) {
@@ -207,9 +207,9 @@ export default function LeaderBoard(): JSX.Element {
207207
}
208208
return pages;
209209
}
210-
210+
211211
// For more than 7 pages, use the ellipsis approach
212-
212+
213213
// Always show first page
214214
pages.push(
215215
<button
@@ -220,12 +220,12 @@ export default function LeaderBoard(): JSX.Element {
220220
1
221221
</button>
222222
);
223-
223+
224224
// Calculate the range of pages to show (middle section)
225225
// We want to show current page and 1-2 pages before and after when possible
226226
let startPage = Math.max(2, currentPage - 1);
227227
let endPage = Math.min(totalPages - 1, currentPage + 1);
228-
228+
229229
// Adjust start and end page if we're near the beginning or end
230230
if (currentPage <= 3) {
231231
// Near the beginning, show pages 2, 3, 4
@@ -236,14 +236,14 @@ export default function LeaderBoard(): JSX.Element {
236236
endPage = totalPages - 1;
237237
startPage = Math.max(2, totalPages - 3);
238238
}
239-
239+
240240
// Show ellipsis if needed before the middle range
241241
if (startPage > 2) {
242242
pages.push(
243243
<span key="ellipsis-1" className="pagination-ellipsis">...</span>
244244
);
245245
}
246-
246+
247247
// Show pages in the middle range
248248
for (let i = startPage; i <= endPage; i++) {
249249
pages.push(
@@ -256,14 +256,14 @@ export default function LeaderBoard(): JSX.Element {
256256
</button>
257257
);
258258
}
259-
259+
260260
// Show ellipsis if needed after the middle range
261261
if (endPage < totalPages - 1) {
262262
pages.push(
263263
<span key="ellipsis-2" className="pagination-ellipsis">...</span>
264264
);
265265
}
266-
266+
267267
// Always show last page
268268
pages.push(
269269
<button
@@ -274,7 +274,7 @@ export default function LeaderBoard(): JSX.Element {
274274
{totalPages}
275275
</button>
276276
);
277-
277+
278278
return pages;
279279
};
280280

@@ -289,7 +289,7 @@ export default function LeaderBoard(): JSX.Element {
289289
const getTimeFilterLabel = (filter: string) => {
290290
switch (filter) {
291291
case 'week': return '📊 This Week';
292-
case 'month': return '📆 This Month';
292+
case 'month': return '📆 This Month';
293293
case 'year': return '📅 This Year';
294294
case 'all': return '🏆 All Time';
295295
default: return '🏆 All Time';
@@ -306,17 +306,17 @@ export default function LeaderBoard(): JSX.Element {
306306
animate={{ opacity: 1, y: 0 }}
307307
transition={{ duration: 0.5 }}
308308
>
309-
<h1 className="title">recode hive Leaderboard</h1>
309+
<h1 className="title">Recode Hive Leaderboard</h1>
310310
<p className={`subtitle ${isDark ? "dark" : "light"}`}>
311-
Top contributors across the <strong>{GITHUB_ORG}</strong> organization
311+
Top contributors across the <strong>Recode Hive</strong> organization
312312
</p>
313313
</motion.div>
314314

315315
{/* Top 3 Performers Section */}
316316
{!loading && filteredContributors.length > 2 && (
317317
<div className="top-performers-container">
318318
<div className="title-filter-container">
319-
<h2 className={`top-performers-title ${isDark ? "dark" : "light"}`}>recode hive Top Performers</h2>
319+
<h2 className={`top-performers-title ${isDark ? "dark" : "light"}`}>Recode Hive Top Performers</h2>
320320
<div className="time-filter-wrapper top-title-filter">
321321
<label htmlFor="time-period-filter" className="filter-label">Time Period:</label>
322322
<select
@@ -440,11 +440,11 @@ export default function LeaderBoard(): JSX.Element {
440440
{!loading && filteredContributors.length > 0 && (
441441
<div className={`contributors-container ${isDark ? "dark" : "light"}`}>
442442
{error && (
443-
<div className="error-banner" style={{
444-
padding: '12px',
445-
backgroundColor: isDark ? '#fee8e7' : '#fee8e7',
446-
color: '#dc2626',
447-
borderRadius: '8px',
443+
<div className="error-banner" style={{
444+
padding: '12px',
445+
backgroundColor: isDark ? '#fee8e7' : '#fee8e7',
446+
color: '#dc2626',
447+
borderRadius: '8px',
448448
marginBottom: '16px',
449449
fontSize: '14px',
450450
textAlign: 'center'
@@ -453,11 +453,11 @@ export default function LeaderBoard(): JSX.Element {
453453
</div>
454454
)}
455455
<div className="contributors-header">
456-
<div className="contributor-cell rank">Rank</div>
457-
<div className="contributor-cell avatar-cell">Avatar</div>
458-
<div className="contributor-cell username-cell">User</div>
459-
<div className="contributor-cell prs-cell">PRs</div>
460-
<div className="contributor-cell points-cell">Points</div>
456+
<div className="contributor-cell rank">Rank</div>
457+
<div className="contributor-cell avatar-cell">Avatar</div>
458+
<div className="contributor-cell username-cell">User</div>
459+
<div className="contributor-cell prs-cell">PRs</div>
460+
<div className="contributor-cell points-cell">Points</div>
461461
</div>
462462
{currentItems.map((contributor, index) => (
463463
<motion.div
@@ -480,14 +480,14 @@ export default function LeaderBoard(): JSX.Element {
480480
/>
481481
</div>
482482
<div className="contributor-cell username-cell">
483-
<a href={contributor.profile} target="_blank" rel="noreferrer" className={`username-link ${isDark ? "dark" : "light"}`}>
484-
{contributor.username}
485-
</a>
483+
<a href={contributor.profile} target="_blank" rel="noreferrer" className={`username-link ${isDark ? "dark" : "light"}`}>
484+
{contributor.username}
485+
</a>
486486
</div>
487487
<div className="contributor-cell prs-cell">
488-
<Badge
489-
count={contributor.prs}
490-
label="PRs"
488+
<Badge
489+
count={contributor.prs}
490+
label="PRs"
491491
color={{ background: "#dbeafe", color: "#2563eb" }}
492492
onClick={() => handlePRClick(contributor)}
493493
clickable={true}
@@ -523,7 +523,7 @@ export default function LeaderBoard(): JSX.Element {
523523
</button>
524524
</div>
525525
)}
526-
526+
527527
{/* CTA Footer */}
528528
<div className={`cta-footer ${isDark ? "dark" : "light"}`}>
529529
<p className={`cta-text ${isDark ? "dark" : "light"}`}>Want to get on this leaderboard?</p>

0 commit comments

Comments
 (0)