Add CSV and resume export

Author: IAmThe2ndHuman

package-lock.json

@@ -31,6 +31,7 @@
     "date-fns": "^4.1.0",
     "firebase": "^12.4.0",
     "jotai": "^2.15.0",
+    "jszip": "^3.10.1",
     "lucide-react": "^0.546.0",
     "motion": "^12.29.2",
     "react": "^19.1.1",

package.json

@@ -0,0 +1,77 @@
+import type { Team } from "@/types/team";
+import type { UserData } from "@/types/user";
+import { firestoreService } from "@/services/firestore.service";
+
+function escapeCsvField(value: string): string {
+	if (value.includes(",") || value.includes('"') || value.includes("\n")) {
+		return `"${value.replace(/"/g, '""')}"`;
+	}
+	return value;
+}
+
+function toCsvRow(fields: string[]): string {
+	return fields.map(escapeCsvField).join(",");
+}
+
+export async function exportTeamsCsv(teams: Team[]): Promise<void> {
+	const allMemberIds = [...new Set(teams.flatMap((t) => t.memberIds))];
+	const memberMap = new Map<string, UserData>();
+
+	const users = await Promise.all(
+		allMemberIds.map((id) => firestoreService.fetchUser(id)),
+	);
+	for (const user of users) {
+		if (user) memberMap.set(user.id, user);
+	}
+
+	const header = toCsvRow([
+		"Team Name",
+		"Track",
+		"Challenges",
+		"Members",
+		"Member Emails",
+		"Mentoring Help",
+		"Status",
+	]);
+
+	const rows = teams.map((team) => {
+		const members = team.memberIds
+			.map((id) => memberMap.get(id))
+			.filter((m): m is UserData => m !== undefined);
+
+		const memberNames = members
+			.map((m) => {
+				const name =
+					m.role === "participant"
+						? `${m.firstName} ${m.lastName}`
+						: m.username;
+				return m.id === team.creatorId ? `${name} (creator)` : name;
+			})
+			.join("; ");
+
+		const memberEmails = members
+			.map((m) => ("email" in m && m.email ? m.email : m.username))
+			.join("; ");
+
+		return toCsvRow([
+			team.name,
+			team.track,
+			team.challenges.join("; "),
+			memberNames,
+			memberEmails,
+			team.mentoringHelp,
+			team.status,
+		]);
+	});
+
+	const csv = [header, ...rows].join("\n");
+	const blob = new Blob([csv], { type: "text/csv;charset=utf-8;" });
+	const url = URL.createObjectURL(blob);
+
+	const link = document.createElement("a");
+	link.href = url;
+	link.download = `teams-${new Date().toISOString().slice(0, 10)}.csv`;
+	link.click();
+
+	URL.revokeObjectURL(url);
+}

src/lib/export-csv.ts

@@ -0,0 +1,49 @@
+import JSZip from "jszip";
+import type { Participant } from "@/types/user";
+
+export async function exportResumesZip(
+	participants: Participant[],
+): Promise<void> {
+	const withResumes = participants.filter(
+		(p): p is Participant & { resumeURL: string } => !!p.resumeURL,
+	);
+
+	if (withResumes.length === 0) {
+		alert("No participants have uploaded resumes.");
+		return;
+	}
+
+	const zip = new JSZip();
+	let added = 0;
+
+	await Promise.all(
+		withResumes.map(async (p) => {
+			try {
+				const response = await fetch(p.resumeURL);
+				if (!response.ok) return;
+
+				const blob = await response.blob();
+				const filename = `${p.firstName}_${p.lastName}_${p.username}.pdf`;
+				zip.file(filename, blob);
+				added++;
+			} catch (err) {
+				console.warn(`Failed to fetch resume for ${p.username}`, err);
+			}
+		}),
+	);
+
+	if (added === 0) {
+		alert("Could not download any resumes. Check the console for errors.");
+		return;
+	}
+
+	const content = await zip.generateAsync({ type: "blob" });
+	const url = URL.createObjectURL(content);
+
+	const link = document.createElement("a");
+	link.href = url;
+	link.download = `resumes-${new Date().toISOString().slice(0, 10)}.zip`;
+	link.click();
+
+	URL.revokeObjectURL(url);
+}

src/lib/export-resumes.ts

@@ -11,6 +11,7 @@ import { firestoreService } from "@/services/firestore.service";
 import type { Participant, UserData } from "@/types/user";
 import { useEffect, useState, useCallback } from "react";
 import { useNavigate } from "react-router-dom";
+import { exportResumesZip } from "@/lib/export-resumes";
 
 export default function ParticipantManager() {
 	const navigate = useNavigate();
@@ -71,6 +72,16 @@ export default function ParticipantManager() {
 				<Button variant="outline" onClick={() => fetchUsers()}>
 					<p>refresh table</p>
 				</Button>
+				<Button
+					variant="outline"
+					onClick={() =>
+						exportResumesZip(
+							users.filter((u): u is Participant => u.role === "participant"),
+						)
+					}
+				>
+					<p>download resumes in zip (may take a bit)</p>
+				</Button>
 			</header>
 
 			<main>

src/pages/ParticipantManager.tsx

@@ -25,6 +25,7 @@ import { TooltipTrigger } from "@radix-ui/react-tooltip";
 import { useEffect, useState, useCallback } from "react";
 import { useNavigate } from "react-router-dom";
 import { useAtomValue } from "jotai";
+import { exportTeamsCsv } from "@/lib/export-csv";
 
 function TeamMembersList({ team }: { team: Team }) {
 	const [members, setMembers] = useState<UserData[]>([]);
@@ -261,6 +262,9 @@ export default function TeamManager() {
 				<Button variant="outline" onClick={() => fetchTeams()}>
 					<p>refresh table</p>
 				</Button>
+				<Button variant="outline" onClick={() => exportTeamsCsv(teams)}>
+					<p>export CSV</p>
+				</Button>
 			</header>
 
 			<main>