Skip to content

Use pnpm for the UI workflow #110

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
amirgholipour wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

Use pnpm for the UI workflow #110

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ Use cases: research acceleration, compliance automation, content management, acc

## 📸 Screenshots

A single React + Express app is both the testing workbench and the deployment/ops console — the same code runs locally via `npm run dev` or on ECS behind Cognito OIDC. Tabs are role-gated: the **Testing** row below is visible to all users, while an admin-only **Deploy** row (Stacks, Specialists, S3 Configs, Deploy Tags) is not pictured here. See the [UI README](ui/UI_README.md) for the full tab and role breakdown.
A single React + Express app is both the testing workbench and the deployment/ops console — the same code runs locally via `pnpm run dev` or on ECS behind Cognito OIDC. Tabs are role-gated: the **Testing** row below is visible to all users, while an admin-only **Deploy** row (Stacks, Specialists, S3 Configs, Deploy Tags) is not pictured here. See the [UI README](ui/UI_README.md) for the full tab and role breakdown.

### Testing tabs

Expand Down Expand Up @@ -487,8 +487,8 @@ Model ID to environment variable mapping:
**Option 1: Use the Wizard (Recommended)**

```bash
cd local_testing
npm run dev
cd ui
pnpm run dev
```

The Specialist Creation Wizard is available as the 🧙 Create Specialist tab in the [UI](ui/UI_README.md).
Expand Down
2 changes: 1 addition & 1 deletion deploy.sh
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -271,7 +271,7 @@ step_ui_build() {
bash "${DEPLOYMENT_DIR}/scripts/generate_ui_env.sh"

log_info "Building React app..."
(cd "${REPO_ROOT}/ui" && npm install --silent && npm run build) \
(cd "${REPO_ROOT}/ui" && pnpm install --frozen-lockfile --prod=false --silent && pnpm run build) \
|| { log_error "UI bundle build failed."; return 1; }

log_info "Building UI container image (linux/amd64)..."
Expand Down
4 changes: 2 additions & 2 deletions ui/Dockerfile
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
FROM node:20-slim
WORKDIR /app

COPY package.json package-lock.json ./
RUN npm ci --production
COPY package.json pnpm-lock.yaml ./
RUN corepack enable && pnpm install --frozen-lockfile --prod

COPY server/ ./server/
COPY dist/ ./dist/
Expand Down
11 changes: 6 additions & 5 deletions ui/UI_README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,13 @@

# 🦡 BADGERS UI

Single React + Express application that serves as both the developer testing workbench and the deployment/ops console. Runs locally via `npm run dev`, or on AWS as a container on an ECS Express Gateway service authenticated with Cognito OIDC.
Single React + Express application that serves as both the developer testing workbench and the deployment/ops console. Runs locally via `pnpm run dev`, or on AWS as a container on an ECS Express Gateway service authenticated with Cognito OIDC.

## Two Modes, One Codebase

| | Local Development | Deployed on AWS |
| ----------------- | ------------------------------------------------------ | -------------------------------------------------- |
| **Start** | `npm run dev` | Container on an ECS Express Gateway service |
| **Start** | `pnpm run dev` | Container on an ECS Express Gateway service |
| **Auth** | Bypassed — defaults to `admin` role (all tabs visible) | Cognito OIDC authorization code + PKCE |
| **Role override** | `BADGERS_UI_ROLE=tester` env var | Cognito group membership (`admin` / `tester`) |
| **Ports** | Vite 5175 / Express 7860 | Container exposes 7860 |
Expand All @@ -32,8 +32,9 @@ shortcut, so requests fail rather than silently running unauthenticated.

```bash
cd ui
npm install # first time only
npm run dev # starts Express API (7860) + Vite (5175)
corepack enable
pnpm install # first time only
pnpm run dev # starts Express API (7860) + Vite (5175)
```

| Service | URL |
Expand Down Expand Up @@ -66,7 +67,7 @@ A bundle built without them falls through to the server's local-dev bypass.
## Docker Deployment

```bash
npm run build # build static assets into dist/
pnpm run build # build static assets into dist/
docker build -t badgers-ui . # build container
docker run -p 7860:7860 badgers-ui
```
Expand Down
Loading