codeflash-internal/js
Kevin Turcios 996c82ac4c
feat: add internal /report page for optimization results (#2576)
## Summary
- Adds `/report` page showing results of the 20-PR webapp optimization
sprint
- Team-member only access (guarded in `proxy.ts` + server component
`isTeamMember()` check)
- Full-width layout (no sidebar), matching `/roadmap` and
`/observability` patterns
- Dual-view toggle: Executive Summary / Engineering Details
- chart.js charts with datalabels matching the original Plotly Dash
report
- Full light/dark theme support via Tailwind `dark:` variants

## Files
- **New**: `src/app/report/page.tsx`,
`src/components/report/report-charts.tsx`,
`src/components/report/report-toggle.tsx`
- **Modified**: `proxy.ts` (added `/report` + `/roadmap` to team-member
guard), `conditional-layout.tsx` (hide sidebar for `/report`)
- **Dep**: `chartjs-plugin-datalabels` for bar/pie chart value labels

## Test plan
- [ ] Visit `/report` as a CF team member — page renders with all
sections
- [ ] Toggle between Executive Summary and Engineering Details
- [ ] Charts display with value labels and correct colors
- [ ] Visit `/report` as a non-team-member — redirected to `/`
- [ ] Light and dark mode both render correctly
2026-04-04 23:55:12 -05:00
..
cf-api make healthcheck public in cfapi 2026-03-29 09:09:48 +02:00
cf-webapp feat: add internal /report page for optimization results (#2576) 2026-04-04 23:55:12 -05:00
common fix: display instrumented perf tests in observability timeline (#2381) 2026-02-08 03:21:57 -05:00
VSC-Extension feat: Add Line Profiler visualization to webapp (#2268) 2026-01-28 08:36:54 -08:00
CLAUDE.md docs: restructure CLAUDE.md files into modular rules 2026-02-14 19:36:21 -05:00
README.md fix for ignoring test files from deployment (#1521) 2025-05-09 14:53:28 -04:00

CodeFlash AI

Overview

CodeFlash AI is a JavaScript/TypeScript monorepo that provides a scalable and modular architecture for web applications, focusing on efficient code sharing and robust development practices.

Project Structure

js/
├── common/           # Shared code and database schema
├── cf-api/           # Backend API service
└── cf-webapp/        # Next.js web application

Prerequisites

  • Node.js (v18+ recommended)
  • npm (v9+)
  • Prisma CLI

Setup

1. Clone the Repository

git clone https://github.com/your-org/codeflash-ai.git
cd codeflash-ai/js

2. Install Dependencies

# Install root and project dependencies
npm install
cd common && npm install
cd ../cf-api && npm install
cd ../cf-webapp && npm install

3. Database Configuration

# Generate Prisma client and run migrations
cd common
npx prisma generate
npx prisma migrate dev

Development Workflow

Start Development Servers

# Start API server
cd cf-api
For local development, developers would use `npm run dev`
For production (Azure), the system would use `npm run start`

# Start web application
cd cf-webapp
npm run dev

Build Common Package

cd common
npm run build

Key Components

Common Package (@codeflash-ai/common)

  • Shared TypeScript utilities
  • Prisma database schema
  • Reusable functions across projects

Installation in Other Projects

npm install @codeflash-ai/common

Usage Example

import { createOrUpdateUser } from "@codeflash-ai/common"

Best Practices

  1. Always build the common package after making changes
  2. Keep shared logic in the common package
  3. Use TypeScript for type safety
  4. Follow existing code structure
  5. Never commit sensitive data or build artifacts

Publishing common Package

# Publish common package to npm
cd common
npm run build
npm publish