Add UI for Card Management by adarshm11 · Pull Request #1731 · SCE-Development/Clark

adarshm11 · 2025-06-28T23:28:11Z

Add UI to manage/delete cards, move CardReader API functions to separate file, fix Messaging bug

…e, fix Messaging bug

evanugarte · 2025-06-29T00:30:01Z

+        , (error, result) => {
+          if (error) {
+            logger.error('getAllCards got an error querying mongodb');
+            return resolve(null);


maybe we should resolve an empty array, so this function returns some sort of array no matter what

evanugarte · 2025-06-29T00:31:48Z

+  let getCards = await getAllCards();
+  if (!getCards) {
+    logger.info('Error retrieving cards');
+    return res.sendStatus(SERVER_ERROR);
+  }
+
+  logger.info('Retrieved all cards successfully!');
+  res.json(getCards).status(OK);


this is a silly nitpick, the less we add not in our if statements the easier debugging becomes later

also we already log errors, so we can skip logging it again, plus logging nothing on success is ok

Suggested change

let getCards = await getAllCards();

if (!getCards) {

logger.info('Error retrieving cards');

return res.sendStatus(SERVER_ERROR);

}

logger.info('Retrieved all cards successfully!');

res.json(getCards).status(OK);

const getCards = await getAllCards();

if (getCards) {

return res.json(getCards).status(OK);

}

return res.sendStatus(SERVER_ERROR);

evanugarte · 2025-06-29T00:33:19Z

+    const url = new URL('/api/OfficeAccessCard/delete', BASE_API_URL);
+    url.searchParams.append('cardBytes', cardBytes);
+    const res = await fetch(url.href, {


we didnt do this earlier but can we change the delete endpoint to be a post request? then we can send the bytes as a json body

evanugarte · 2025-06-29T01:14:06Z

+        >
+          Card Registry
+        </button>
+        <div>&nbsp;|&nbsp;</div>


add a comment above this line on what this is rendering

evanugarte

also can we get screenshots of the new ui, with how both tabs look

evanugarte · 2025-06-29T01:45:46Z

+      body: JSON.stringify({ cardBytes, }),
+    });
+    if (res.ok) {
+      const result = await res.json();


is there a json response from the delete endpoint?

i believe its a boolean of success/failure

double check if this res.json() returns an error

evanugarte · 2025-06-29T01:47:01Z

+            headerText: `Delete card: ${cardToDelete.cardBytes}?`,
+            bodyText: `Are you sure you want to delete 
+              card: ${cardToDelete.cardBytes}? It'll be gone forever if you do.`,
+            confirmText: `Yes, delete card: ${cardToDelete.cardBytes}`,


Suggested change

confirmText: `Yes, delete card: ${cardToDelete.cardBytes}`,

confirmText: `Yes, delete ${cardToDelete.cardBytes}`,

i think the original is still there

I haven't committed yet, still working on the useMemo thing below

adarshm11 · 2025-06-29T01:52:50Z

also can we get screenshots of the new ui, with how both tabs look

… verifiedCount to 1

evanugarte · 2025-07-04T17:52:35Z

      endpoint: '/delete',
-      message: 'cardBytes missing from request'
+      message: 'cardBytes missing from request',
+      requestType: 'HTTP POST',


is there a way to get the method from the request object?

evanugarte · 2025-07-04T17:53:58Z

+    eventSource.onerror = (error) => {
+      setLogs(
+        (currLogs) => [
+          '...crickets...',


instead can we show the error in the console

I can log the error in the browser console but it'll not pass lint and also won't actually say what happened, it's a very vague Event object

evanugarte · 2025-07-04T17:54:32Z


+  useEffect(() => {
+    if (connected) {
+      setConnectionStatusText('Listening for card reader activity...');


Suggested change

setConnectionStatusText('Listening for card reader activity...');

setConnectionStatusText('Listening for card reader activity...');

return;

then you can remove the else block

…darsh/06252025_card_management_ui

weslayer

big

Co-authored-by: Evan Ugarte <36345325+evanugarte@users.noreply.github.com>

* Add UI to manage cards, move CardReader API functions to separate file, fix Messaging bug * Addressed previous comments * Addressed comments * addressed more comments * added light mode compatibility, adjusted log format, set default card verifiedCount to 1 * Add pagination to card registry * Removed search and sort logic for now * Add pagination to card registry * Removed search and sort logic for now * fix crickets msg * Apply suggestions from code review Co-authored-by: Evan Ugarte <36345325+evanugarte@users.noreply.github.com> --------- Co-authored-by: Evan Ugarte <36345325+evanugarte@users.noreply.github.com>

adarshm11 force-pushed the Adarsh/06252025_card_management_ui branch 2 times, most recently from e6c91f6 to 6099b92 Compare June 28, 2025 23:59

Add UI to manage cards, move CardReader API functions to separate fil…

a5003d9

…e, fix Messaging bug

adarshm11 force-pushed the Adarsh/06252025_card_management_ui branch from 6099b92 to a5003d9 Compare June 29, 2025 00:01

evanugarte reviewed Jun 29, 2025

View reviewed changes

Addressed previous comments

2dc18dd

evanugarte reviewed Jun 29, 2025

View reviewed changes

Addressed comments

5e324b1

evanugarte reviewed Jun 29, 2025

View reviewed changes

adarshm11 force-pushed the Adarsh/06252025_card_management_ui branch 4 times, most recently from edb258c to eb05d9a Compare June 29, 2025 19:47

addressed more comments

91a097c

adarshm11 force-pushed the Adarsh/06252025_card_management_ui branch from eb05d9a to 91a097c Compare June 29, 2025 19:48

added light mode compatibility, adjusted log format, set default card…

0935119

… verifiedCount to 1

adarshm11 force-pushed the Adarsh/06252025_card_management_ui branch from 6f83717 to 0935119 Compare July 4, 2025 16:43

Merge branch 'dev' into Adarsh/06252025_card_management_ui

7e0e19c

adarshm11 force-pushed the Adarsh/06252025_card_management_ui branch from a636313 to 7e0e19c Compare July 4, 2025 16:46

evanugarte reviewed Jul 4, 2025

View reviewed changes

Add pagination to card registry

a03cd58

adarshm11 force-pushed the Adarsh/06252025_card_management_ui branch from c455f42 to a03cd58 Compare July 6, 2025 20:18

Removed search and sort logic for now

8d74c78

adarshm11 force-pushed the Adarsh/06252025_card_management_ui branch from 4cbaeb8 to 8d74c78 Compare July 7, 2025 05:09

adarshm11 added 3 commits July 6, 2025 22:15

Add pagination to card registry

8ed7338

Removed search and sort logic for now

4bb39fc

Merge branch 'dev' of https://github.com/SCE-Development/Clark into A…

8e6857b

…darsh/06252025_card_management_ui

weslayer approved these changes Jul 7, 2025

View reviewed changes

fix crickets msg

a7a5b61

adarshm11 force-pushed the Adarsh/06252025_card_management_ui branch from eb5e9e5 to a7a5b61 Compare July 7, 2025 05:35

evanugarte approved these changes Jul 7, 2025

View reviewed changes

Comment thread api/main_endpoints/routes/OfficeAccessCard.js Outdated

Comment thread api/main_endpoints/routes/OfficeAccessCard.js Outdated

Comment thread api/main_endpoints/routes/OfficeAccessCard.js Outdated

Apply suggestions from code review

692d760

Co-authored-by: Evan Ugarte <36345325+evanugarte@users.noreply.github.com>

adarshm11 merged commit e90333d into dev Jul 7, 2025
4 checks passed

adarshm11 deleted the Adarsh/06252025_card_management_ui branch July 7, 2025 05:45

	confirmText: `Yes, delete card: ${cardToDelete.cardBytes}`,
	confirmText: `Yes, delete ${cardToDelete.cardBytes}`,

	setConnectionStatusText('Listening for card reader activity...');
	setConnectionStatusText('Listening for card reader activity...');
	return;

Uh oh!

Conversation

adarshm11 commented Jun 28, 2025

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!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

evanugarte 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!

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!

Uh oh!

Uh oh!

Uh oh!

adarshm11 commented Jun 29, 2025

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!

Choose a reason for hiding this comment

Uh oh!

weslayer left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants