[Don't merge] spring-26-workspaces downstream

.github/workflows/main.yml

@@ -31,11 +31,8 @@ jobs:
       - name: Linting
         run: npm run lint
 
-      - name: Run server tests
-        run: npm run test:server
-
       - name: Install Playwright dependencies
         run: npx playwright install --with-deps chromium
 
-      - name: Run Playwright end-to-end tests
-        run: npm run test:frontend
+      - name: Run tests
+        run: npm run test

README.md

@@ -4,11 +4,14 @@ This is a template project for CS4530, Software Engineering at Northeastern.
 
 ## Vite+Express Full-stack React Application
 
-This project has two parts:
-
-1.  A minimal Express transcript API for a very simple transcript server
-2.  A Vite frontend with code that calls that server (this lives in the
-    `./frontend` directory)
+This project has three parts, which together form an
+[npm workspaces](https://docs.npmjs.com/cli/v8/using-npm/workspaces) project.
+
+1.  A minimal Express transcript API for a very simple transcript server (in
+    the `./server` directory)
+2.  A Vite frontend with code that calls that server (in the `./frontend`
+    directory)
+3.  Shared Zod validation and type definitions (in the `./shared` directory)
 
 The way this project runs in "production mode" versus "development mode" is
 very different.

frontend/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@cs4530-workspaces/frontend",
+  "version": "1.0.0",
+  "description": "CS4530 Template",
+  "type": "module",
+  "scripts": {
+    "check": "tsc",
+    "lint": "eslint .",
+    "prettier": "prettier --ignore-path ../.gitignore --check .",
+    "prettier:fix": "prettier --ignore-path ../.gitignore --write .",
+    "test": "playwright test",
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "playwright": "playwright test --ui"
+  },
+  "author": "Rob Simmons",
+  "dependencies": {
+    "@cs4530-workspaces/shared": "^1.0.0",
+    "express": "^5.2.1",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "zod": "^4.3.6"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.58.1",
+    "@types/react": "^19.2.13",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^6.0.1",
+    "vite": "^8.0.0",
+    "vitest": "^4.0.18"
+  }
+}

playwright.config.mjs → frontend/playwright.config.mjs

@@ -3,7 +3,7 @@ import { defineConfig, devices } from "@playwright/test";
 /* global process */ // TODO: is there a better way to avoid making ESLint angry?
 export default defineConfig({
   // Where the tests live, relative to this file
-  testDir: "./frontend/tests/e2e",
+  testDir: "./tests/e2e",
 
   // Fail the build on CI if you accidentally left test.only in the source code.
   forbidOnly: !!process.env.CI,
@@ -31,13 +31,15 @@ export default defineConfig({
   webServer: [
     {
       name: "Frontend",
-      command: "npm run dev:frontend",
+      cwd: "..",
+      command: "npm run dev -w=frontend",
       reuseExistingServer: !process.env.CI,
       url: "http://localhost:5173",
     },
     {
       name: "Server",
-      command: "npm run dev:server",
+      cwd: "..",
+      command: "npm run dev -w=server",
       reuseExistingServer: !process.env.CI,
       url: "http://localhost:3000",
     },

frontend/src/service.ts

@@ -1,14 +1,20 @@
 import { z } from "zod";
+import {
+  zAddGradeResponse,
+  zAddStudentResponse,
+  zError,
+  zGetTranscriptResponse,
+  type AddGradeResponse,
+  type AddStudentResponse,
+  type GetTranscriptResponse,
+} from "@cs4530-workspaces/shared";
 
 export class ServiceError extends Error {
   constructor(message: string) {
     super(message);
   }
 }
 
-const zError = z.object({ error: z.string() });
-
-const zAddStudentResponse = z.object({ studentID: z.int() });
 /**
  * Validate inputs and call the `addStudent` api
  *
@@ -20,7 +26,7 @@ const zAddStudentResponse = z.object({ studentID: z.int() });
 export async function addStudent(
   password: string,
   studentName: string,
-): Promise<z.infer<typeof zAddStudentResponse>> {
+): Promise<AddStudentResponse> {
   if (studentName === "") throw new ServiceError("Student name must be non-empty");
 
   const response = await fetch("/api/addStudent", {
@@ -36,7 +42,6 @@ export async function addStudent(
   return data;
 }
 
-const zAddGradeResponse = z.object({ success: z.literal(true) });
 /**
  * Validate inputs and call the `addGrade` api
  *
@@ -52,7 +57,7 @@ export async function addGrade(
   studentIDStr: string,
   courseName: string,
   courseGradeStr: string,
-): Promise<z.infer<typeof zAddGradeResponse>> {
+): Promise<AddGradeResponse> {
   const studentID = parseInt(studentIDStr);
   if (isNaN(studentID) || `${studentID}` !== studentIDStr || studentID < 0) {
     throw new ServiceError("Student ID is invalid");
@@ -87,17 +92,6 @@ export async function addGrade(
   return data;
 }
 
-const zGetTranscriptResponse = z.union([
-  z.object({ success: z.literal(false) }),
-  z.object({
-    success: z.literal(true),
-    transcript: z.object({
-      student: z.object({ studentID: z.int(), studentName: z.string() }),
-      grades: z.array(z.object({ course: z.string(), grade: z.number() })),
-    }),
-  }),
-]);
-
 /**
  * Validate inputs and call the `getTranscript` API
  *
@@ -109,7 +103,7 @@ const zGetTranscriptResponse = z.union([
 export async function getTranscript(
   password: string,
   studentIDStr: string,
-): Promise<z.infer<typeof zGetTranscriptResponse>> {
+): Promise<GetTranscriptResponse> {
   const studentID = parseInt(studentIDStr);
   if (isNaN(studentID) || `${studentID}` !== studentIDStr || studentID < 0) {
     throw new ServiceError("Student ID is invalid");

frontend/vite.config.mjs

@@ -1,9 +1,15 @@
 import { defineConfig } from "vitest/config";
 import react from "@vitejs/plugin-react";
 
+// Must match the port the server creates
+const DEV_BACKEND_PORT = 3000;
+
+// https://vite.dev/config/
 export default defineConfig({
   plugins: [react()],
   server: {
-    proxy: { "/api": `http://localhost:3000` },
+    proxy: {
+      "/api": `http://localhost:${DEV_BACKEND_PORT}`,
+    },
   },
 });