Connected CSV frontend to backend by njbizzle · Pull Request #25 · TritonSE/Home-Start

njbizzle · 2026-02-24T02:50:11Z

Tracking Info

Relates to #12
Resolves #18

Changes

Merged the CSV processing backend with the frontend display.

Testing

Tested with the following CSV files.

`one.csv`

First,Last,Email,Phone,New 
john,johnson,john@gmail.com,1231231234,N

`many.csv`

First,Last,Email,Phone,New
john,johnson,john_new_email@gmail.com,1231231234,N
johnithy,johnsonamy,johnthesecond@gmail.com,3213213211,R
jimmerson,jimarino,jimjim@jimjimmy.jim,9999999999, N
joel,johnjimmyjohn,joel.jimmy.john.john@yahoo.com,1431239999, R

`bad_formatting.csv`

First,Last,Email
john,johnson,john@gmail.com

`bad_phone.csv`

First,Last,Email,Phone,New
john,johnson,john@gmail.com,123123,N

`bad_email.csv`

First,Last,Email,Phone,New
john,johnson,john@@gmail.com,1231231234,N

Confirmation of Change

Tested with `one.csv` and `many.csv`

csv-merge-fullTest.webm

Tested fail cases with `bad_formatting.csv`, `bad_phone.csv`, and `bad_email.csv`

csv-merge-failTest.webm

Possible Improvements (either future or now, let me know)

More fail info when uploading file (rather than just "unsupported file upload").
The "Detailed Changes" screen could display added or removed tags. In this case that would only display if the "new"/"returning" tag was changed.
"new" / "returning" is currently stored as part of thestring[] tag member of a volunteer in the database. It should likely be stored as a boolean to prevent volunteers from being both "new" and "returning", but that goes out of the scope of this branch.

wmiq84

All changes worked, LGTM

navyaa31

When I upload the bad_phone and bad_email csvs, I get this error. However, this isn't there for the frontend only code so do you know what might be causing this?

Also, could you resolve merge conflicts with main? Since there have been some changes to the schema, the tags are rendering incorrectly on this branch so we should make sure that doesn't happen before merging this PR

navyaa31 · 2026-03-03T19:40:47Z

+    );
+
+    if (!result.ok) {
+      alert("Failed to upload volunteers: " + result.error);


We can delete the alerts!

njbizzle · 2026-03-04T16:56:59Z

When I upload the bad_phone and bad_email csvs, I get this error. However, this isn't there for the frontend only code so do you know what might be causing this?

Not sure if I fully understand the question, but if you're asking where the CSV headers being validated, everything should be in the backend. The one bit in the frontend to check the file extension was redundant and I just removed it.

Also I merged main back in and updated the api to use the new backend auth as well as update the csv parser to use the new tag backend. However, I wasn't able to reproduce the tag display error. I don't think I touched that section of the frontend, but maybe some of the other changes fixed it. Let me know if that error persists.

Also I'm curious how you're seeding the volunteers. If there's a new script that's compliant with the new volunteer and tag backend, let me know and I can do some more thorough testing.

siwenshao

I think this PR still includes the full backend CSV implementation in #20 PR which was merged already, and it did not reflect the most up-to-date changes that #20 made. Please split/rebase to avoid duplicating the earlier backend PR.

Overall, it looks great! I left a couple of comments about the details that we might want to look into/fix if needed.

siwenshao · 2026-03-04T19:37:41Z

+    const token = authHeader.split("Bearer ")[1];
    const token = authHeader.split("Bearer ")[1];


nit: why do we have a duplicated const token here of the same thing? Maybe remove one.

siwenshao · 2026-03-04T19:38:27Z

+  storage,
+  limits: { fileSize: 1024 * 1024 * 5 }, // 5MB limit
+  fileFilter: (req, file, cb) => {
+    if (file.mimetype !== "text/csv" || path.extname(file.originalname).toLowerCase() !== ".csv") {


As said in the review, I think this part is updated/fixed in the #20 PR but not reflected here

siwenshao · 2026-03-04T19:44:24Z

+  tags: string[];
+};


nit: this is not matching what is in frontend/src/app/api/volunteer.ts:tags?: string[]

navyaa31

Code looks mostly good to me, just left one comment. I also was not able to get the tags to be added to the new volunteers when I upload them, could you let me know if you have the same issue? Image shows no tags but I checked the database as well, and no tags were there either

navyaa31 · 2026-03-10T09:47:53Z

Could we have the frontend call the backend endpoints directly and remove these proxy routes? This would make the code easier to maintain. We're going to do this in the rest of the codebase as well soon

The csv only contained data about new/returning, which I thought that was no longer stored as a tag. If we should still have the volunteer status display as a tag I can do that.

ohh you are right about the new/returning, ignore my comment about that, thanks for the reminder

siwenshao

Thanks for all the fixes! It looks good to me!

github-actions · 2026-04-03T04:46:50Z

Visit the preview URL for this PR (updated for commit 73e05e9):

https://home-start-80e0a--pr25-feature-csv-merge-jm5hr1wk.web.app

_{(expires Fri, 10 Apr 2026 19:48:33 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 2d310071333235bae3893f27fc89786faff3470f}

navyaa31

Looks good to me, thanks for removing the extra proxy! I just left comments about some minor code quality changes

navyaa31 · 2026-04-03T18:52:29Z

          <p className={styles.title}>Are you sure you want to log out?</p>
          <button className={styles.close} onClick={onClose} aria-label="Close">
-            <Image src={icCloseLarge} alt="" />
+            <img src={icCloseLarge} alt="" />


Could you use use next’s Image component instead of img tags? (just undoing the changes in this file should be good)

navyaa31 · 2026-04-03T18:52:58Z

 );

-router.post("/upload-csv", upload.single("csv"), volunteer.createVolunteersCsv);
+// router.post("/upload-csv", upload.single("csv"), volunteer.createVolunteersCsv);


Can we delete this code instead of commenting it out

navyaa31 · 2026-04-03T18:53:14Z

    const headers = await getAuthHeaders();

    let response: Response;
+    console.log(headers);


Could we delete these logs

navyaa31 · 2026-04-03T18:54:11Z

-import { useState } from "react";
 import { Volunteer } from "../types/volunteer";
 import styles from "./VolunteerTable.module.css";
+import { useState, useEffect } from "react";


if useEffect is never used, can we delete its import

navyaa31

looks good

njbizzle added 4 commits February 23, 2026 10:36

merged in csv frontend

021fc9a

switched to using next/Image

7b29f3f

finally finished a basic merge

e75dcf3

connected everything with some error checking

d9992c9

njbizzle closed this Feb 24, 2026

njbizzle reopened this Feb 24, 2026

njbizzle changed the base branch from main to feature/volunteer-table-final February 24, 2026 22:56

njbizzle changed the base branch from feature/volunteer-table-final to main February 24, 2026 22:56

njbizzle added 2 commits February 25, 2026 12:59

fixed tags to display new/returning

3f523d5

merged main into branch

e1b0f24

njbizzle marked this pull request as ready for review February 25, 2026 21:04

njbizzle requested a review from navyaa31 as a code owner February 25, 2026 21:04

navyaa31 requested review from siwenshao and wmiq84 February 25, 2026 23:10

wmiq84 approved these changes Mar 3, 2026

View reviewed changes

navyaa31 requested changes Mar 3, 2026

View reviewed changes

njbizzle added 2 commits March 3, 2026 21:33

removed debug alerts

d5551b3

remerged main

138689d

siwenshao requested changes Mar 4, 2026

View reviewed changes

siwenshao reviewed Mar 4, 2026

View reviewed changes

Comment thread frontend/src/components/ImportVolunteerModal.tsx

siwenshao reviewed Mar 4, 2026

View reviewed changes

njbizzle force-pushed the feature/csv-merge branch from 9a4e7e0 to 138689d Compare March 4, 2026 20:00

njbizzle added 2 commits March 5, 2026 10:01

removed redundant check

0d038f2

resolving more comments

f2fe03b

njbizzle requested review from navyaa31 and siwenshao March 5, 2026 23:01

navyaa31 requested changes Mar 10, 2026

View reviewed changes

siwenshao approved these changes Mar 11, 2026

View reviewed changes

remerged main and removed proxies

86c5fdd

njbizzle requested a review from navyaa31 April 3, 2026 18:34

navyaa31 requested changes Apr 3, 2026

View reviewed changes

njbizzle added 2 commits April 3, 2026 12:45

resolved comments

40c0b97

remerged main

73e05e9

njbizzle requested a review from navyaa31 April 3, 2026 19:47

navyaa31 approved these changes Apr 4, 2026

View reviewed changes

njbizzle merged commit 5badea1 into main Apr 4, 2026
3 checks passed

njbizzle deleted the feature/csv-merge branch April 4, 2026 02:57

		const token = authHeader.split("Bearer ")[1];
		const token = authHeader.split("Bearer ")[1];

Conversation

njbizzle commented Feb 24, 2026 • edited by navyaa31 Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Tracking Info

Changes

Testing

Confirmation of Change

Tested with one.csv and many.csv

Tested fail cases with bad_formatting.csv, bad_phone.csv, and bad_email.csv

Possible Improvements (either future or now, let me know)

Uh oh!

wmiq84 left a comment

Choose a reason for hiding this comment

Uh oh!

navyaa31 left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

njbizzle commented Mar 4, 2026

Uh oh!

siwenshao left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

navyaa31 left a comment

Choose a reason for hiding this comment

Uh oh!

navyaa31 Mar 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

njbizzle Mar 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

siwenshao left a comment

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented Apr 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

navyaa31 left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

navyaa31 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

njbizzle commented Feb 24, 2026 •

edited by navyaa31

Loading

Tested with `one.csv` and `many.csv`

Tested fail cases with `bad_formatting.csv`, `bad_phone.csv`, and `bad_email.csv`

navyaa31 Mar 10, 2026 •

edited

Loading

njbizzle Mar 10, 2026 •

edited

Loading

github-actions Bot commented Apr 3, 2026 •

edited

Loading