Skip to content

Tier-1 - #8

Merged
Hum2a merged 29 commits into
enhancingfrom
tier-1
Jul 3, 2026
Merged

Tier-1#8
Hum2a merged 29 commits into
enhancingfrom
tier-1

Conversation

@Hum2a

@Hum2a Hum2a commented Jul 3, 2026

Copy link
Copy Markdown
Owner

Summary by cubic

Adds JWT + API key auth, per‑IP rate limiting with KV caching, R2 media uploads, and a motion‑polished SPA with create session, virtualised history, offline/PWA, and scorecard export.

  • New Features

    • API: /auth/token (JWT from API key), API key list/create/revoke, JWT or x-oche-owner support, structured JSON logs with X-Trace-Id, deep GET /health?deep=1, OpenAPI updates + /openapi.json, per‑IP RateLimiter Durable Object, KV‑cached GET /sessions (60s TTL, X-Cache), and media upload to R2 with stricter MIME/size policy.
    • Web: page‑load motion (AnimatedOutlet, skeletons, TabStrip), Create Session (/sessions/new) with required tooltips, MediaUpload with progress/cancel, game guides and field tooltips single‑sourced, virtualised History list with responsive posters, animated score display, owner switcher + API key UI (/settings/keys), PWA read‑only offline with query persistence and OfflineBanner, i18n (en), scorecard export, theme toggle, and an API docs page.
  • Migration

    • Migrate Durable Objects to add RateLimiter and create/bind a KV namespace to CACHE in wrangler.toml.
    • Set secrets and envs: OCHE_JWT_SECRET, MEDIA_SIGNING_SECRET, VITE_API_BASE_STAGING, VITE_API_BASE_PROD (update .dev.vars and CI).
    • Use new build/deploy scripts: build:web:staging / build:web:prod; staging full pipeline via npm run deploy:staging:full.
    • Local dev: npm run setup, npm run setup:dev-vars:sync, npm run db:prepare, then npm run dev.

Written for commit 47414b0. Summary will update on new commits.

Review in cubic

Hum2a and others added 29 commits July 3, 2026 12:49
- Added new build commands for staging and production environments in `package.json`.
- Updated deployment scripts to include the new build commands for both staging and production deployments.
- Added new environment variables for API base URLs in both `deploy-production.yml` and `deploy-staging.yml`.
- Updated build commands to use specific build scripts for web applications in both workflows.
- Revised quick start commands to streamline setup process with `npm run setup` and `npm run setup:dev-vars:sync`.
- Enhanced performance section to clarify virtualization of history lists and improved image handling with responsive `srcset` for player avatars.
- Introduced a new route for creating sessions at `/sessions/new`, including a form for session title and player names.
- Updated the Overview and SessionDetail components to display the session ID with a copy button for easy access.
- Enhanced PlayerAvatar component to support responsive image loading with `srcset`.
- Added a new SessionId component for displaying and copying session IDs.
- Updated API to include a method for creating sessions, ensuring full functionality from the UI to the backend.
- Added MediaUpload component for handling video and photo uploads with progress tracking and cancellation.
- Introduced SessionMediaSection for attaching media to sessions, including video and poster uploads.
- Enhanced CreateSession route to support optional player photo uploads during session creation.
- Updated SessionDetail to display video and media upload options.
- Improved media handling in the API, allowing for video URLs, posters, and player photos to be updated in sessions.
- Added support for new video MIME types and updated OpenAPI specifications accordingly.
- Implemented responsive image handling for session posters using PosterThumb component.
- Introduced a motion system with new utility classes for smooth transitions and animations.
- Updated various components (e.g., App, MediaUpload, SessionDetail) to utilize the new motion classes for improved user experience.
- Added AnimatedScore component for odometer-style score display using @number-flow/react.
- Implemented AnimatedOutlet and AnimatedPanel for route transitions with horizontal sliding effects.
- Enhanced accessibility by ensuring animations respect user preferences for reduced motion.
- Updated styling rules to maintain a cohesive visual identity with Tailwind and shadcn.
- Added new TabStrip component for improved navigation with sliding indicators.
- Introduced RouteSkeleton for better loading states that match destination layouts.
- Introduced a new `GameGuideCard` component to display game mode instructions in a collapsible format.
- Created a centralized `game-guides.ts` file as the single source of truth for game rules and instructions.
- Added a new `GAME-GUIDES.md` documentation file detailing how to play each game mode.
- Updated the `CreateSession`, `Overview`, and `SessionDetail` routes to incorporate the `GameGuideCard` for enhanced user experience.
- Implemented tests for the `resolveGameId` function to ensure accurate game mode detection from session titles.
- Enhanced documentation to guide future updates and maintain consistency across game instructions.
- Added support for JWT authentication, allowing users to exchange API keys for JWTs via the new `/auth/token` endpoint.
- Introduced API key management with routes for listing and creating API keys, enhancing security and user control.
- Updated the OpenAPI specification to reflect new authentication methods and security schemes.
- Enhanced the principal resolution logic to support JWTs and API keys, improving authorization handling across the application.
- Added tests to ensure proper functionality of the new authentication features and their integration with existing components.
…ures

- Introduced `RateLimiter` Durable Object for per-IP rate limiting, replacing in-memory token buckets.
- Added KV caching for session lists with a 15s TTL, including cache invalidation on session updates.
- Implemented structured JSON logging with `X-Trace-Id` for enhanced observability and error tracking.
- Updated health check endpoint to support deep readiness checks with database connectivity verification.
- Enhanced API routes and middleware to integrate new features, ensuring compliance with updated specifications.
- Added tests for health checks, rate limiting, and session caching functionalities to ensure reliability.
…ken setup

- Clarified the process for creating KV namespaces, specifying that commands should be run from the `apps/api` directory.
- Added instructions for copying KV namespace IDs into `wrangler.toml` for staging and production environments.
- Included guidance for local development without Cloudflare KV and troubleshooting authentication errors related to the Cloudflare API token.
- Added unit tests for the History and Overview components using Vitest and Testing Library, improving test coverage and reliability.
- Introduced contract tests to ensure OpenAPI paths align with expected schemas, enhancing API stability.
- Implemented visual regression tests with Playwright to capture UI changes and maintain visual consistency.
- Updated README and ROADMAP to reflect new testing capabilities and deployment instructions, including a full staging pipeline command.
- Upgraded Wrangler to version 4 across the project for improved development experience.
- Updated session list caching to use a 60s TTL in Cloudflare KV with a 15s HTTP max-age for responses, improving cache efficiency.
- Introduced a new utility function `isSessionId` for validating session IDs against a UUID format.
- Enhanced session retrieval routes to validate session IDs before processing requests, ensuring better error handling.
- Refactored cache-related functions to handle errors gracefully, maintaining API reliability.
- Updated documentation to reflect changes in caching strategy and session ID validation.
- Integrated PWA capabilities using vite-plugin-pwa, enabling offline access and caching for session data.
- Added i18n support with react-i18next, providing English translations for navigation and session details.
- Implemented a scorecard export feature, allowing users to generate print-ready scorecards for sessions.
- Introduced an OfflineBanner component to notify users when offline, enhancing user experience.
- Updated package dependencies to include necessary libraries for analytics and query persistence.
- Enhanced documentation to reflect new features and usage instructions.
… updates

- Updated the `FileField` component to include a visible button for file selection, improving user experience.
- Implemented state management to display the selected file name, enhancing feedback for users.
- Modified tooltip descriptions in the documentation to clarify the new file input pattern and usage guidelines.
- Ensured accessibility by maintaining proper aria attributes and labels for the file input.
@Hum2a
Hum2a merged commit 666af97 into enhancing Jul 3, 2026
1 of 2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant