Skip to content

Claude/extract old site template 43 cu3#167

Closed
stokoe-app wants to merge 4 commits into
incluud:mainfrom
stokoe-app:claude/extract-old-site-template-43Cu3
Closed

Claude/extract old site template 43 cu3#167
stokoe-app wants to merge 4 commits into
incluud:mainfrom
stokoe-app:claude/extract-old-site-template-43Cu3

Conversation

@stokoe-app
Copy link
Copy Markdown

@stokoe-app stokoe-app commented Jan 5, 2026

Summary by CodeRabbit

  • New Features

    • Added visual delta pipeline with audio description capabilities, event detection, and state management.
    • Introduced real-time audio description policy engine and verbalizer system.
    • Added snapshot client for meeting UI analysis and visual fingerprinting.
  • Documentation

    • Added Security & Privacy, Accessibility, and Architecture documentation pages.
    • Published comprehensive system design specification and API documentation.
  • UI/Design

    • Redesigned homepage with five-lane architecture diagram and feature sections.
    • Updated navigation structure and footer with new links.
    • Implemented dark-mode-first design system with Tailwind tokens.
  • Configuration

    • Project rebranding and restructure with updated metadata and configs.

✏️ Tip: You can customize this high-level summary in your review settings.

claude and others added 4 commits January 5, 2026 04:14
- Set canonical site URL to https://stokoe.app
- Add Security & Privacy page (/security) with threat model, data
  minimization, encryption, key management, and responsible disclosure
- Add Accessibility page (/accessibility) with WCAG 2.2 AA commitment,
  tested behaviors, assistive tech notes, and known limitations
- Update navigation: Home, How it works, Security, Accessibility, Docs
- Update footer with Stokoe-focused structure (Product, Trust, Contact)
- Add _redirects for Cloudflare Pages (/privacy -> /security, /trust -> /security)
- Polish metadata: proper canonical URLs, OG tags, Twitter cards
Extracted web-main.zip containing the original Stokoe template with:
- Standards-grade reference architecture design
- Five-lane architecture components and documentation
- Strict accessibility-first design system (WCAG AAA)
- Dark theme with detailed design tokens
- MDX content pages and Astro components

This will serve as reference for incremental updates to the current site.
@netlify
Copy link
Copy Markdown

netlify Bot commented Jan 5, 2026

Deploy Preview for accessible-astro-starter-incluud failed.

Name Link
🔨 Latest commit 8117723
🔍 Latest deploy log https://app.netlify.com/projects/accessible-astro-starter-incluud/deploys/695c258556d974000870e75e

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented Jan 5, 2026

Caution

Review failed

The pull request is closed.

📝 Walkthrough

Walkthrough

This PR transforms an Accessible Astro starter site into Stokoe, a privacy-first accessibility platform, while introducing a comprehensive Visual Delta Pipeline system under web-main/core. Changes include site rebranding, new security/accessibility documentation pages, and a deterministic five-lane real-time caption and audio description architecture.

Changes

Cohort / File(s) Summary
Site Configuration & Rebranding
astro.config.mjs, public/_redirects
Updated site URL to stokoe.app; added Cloudflare Pages redirects for /privacy and /trust to /security (HTTP 301).
Navigation & Layout Refactoring
src/components/Header.astro, src/components/Footer.astro, src/layouts/DefaultLayout.astro
Replaced theme and project links with Stokoe-specific navigation (Home, How it works, Docs, Contact); updated copyright and attribution; changed default layout values (author, title, description).
Metadata & SEO
src/components/SiteMeta.astro
Expanded Props.url to `URL
Policy & Documentation Pages
src/pages/accessibility.mdx, src/pages/security.mdx
Added new MDX pages documenting WCAG 2.2 Level AA conformance, security practices, encryption standards, and responsible disclosure; includes accessibility commitments and test practices.
Web-main Configuration
web-main/astro.config.mjs, web-main/package.json, web-main/postcss.config.mjs, web-main/tailwind.config.mjs, web-main/tsconfig.json
Established Astro project configuration with Tailwind, MDX, TypeScript strict mode; dark-mode support; responsive typography and spacing design tokens.
Core Module Setup
web-main/core/package.json, web-main/core/tsconfig.json, web-main/core/vitest.config.ts, web-main/core/postcss.config.mjs
Created @stokoe/core TypeScript module with Vitest test runner, strict type checking, and empty PostCSS plugins array to prevent inheritance.
Visual Events System
web-main/core/src/events/visual.ts
Defined 13 event types (VID lifecycle, hand signals, screen share, slides, layout changes); VID type (v`${number}``), factory pattern with auto-incrementing IDs, and event payloads with timestamps and confidence scores.
State Management
web-main/core/src/state/visual.ts
Implemented immutable state model (VIDState, ScreenShareState, VisualState) with reducer pattern; handlers for snapshot, VID appearance/disappearance, hand signals, screen share, slides, layout; selectors for active VIDs, hand-raised, stale, and participant counts.
Visual Delta Detection
web-main/core/src/visual/delta.ts, web-main/core/src/visual/vid.ts, web-main/core/src/visual/fingerprint.ts, web-main/core/src/visual/snapshot.ts
Delta detector with debounced signal changes; VID tracker for region continuity; fingerprint utilities (position, slide hash, color); snapshot client for composite image capture and region analysis.
Audio Description Subsystem
web-main/core/src/ad/policy.ts, web-main/core/src/ad/verbalizer.ts, web-main/core/src/ad/index.ts
ADPolicyGate for event filtering and prioritization with configurable cooldowns; Verbalizer for template-based and LLM-driven audio descriptions; prohibited term validation and fallback mechanisms.
API & UI Components
web-main/core/src/api/visual.ts, web-main/core/src/ui/VisualDeltaPanel.ts
VisualAPIClient with snapshot submission and WebSocket event streaming; MockVisualSnapshotHandler for testing; VisualDeltaPanel UI component for dev/debug display of state, events, and AD controls.
Comprehensive Tests
web-main/core/src/__tests__/delta.test.ts, web-main/core/src/__tests__/policy.test.ts, web-main/core/src/__tests__/verbalizer.test.ts, web-main/core/src/__tests__/vid.test.ts
Test suites covering hand raise/lower detection, debounce behavior, VID lifecycle, layout changes, AD policy filtering and prioritization, template/LLM verbalization, fallback chains, and region matching.
Web-main UI Components
web-main/src/components/FeatureGrid.astro, web-main/src/components/FiveLaneDiagram.astro, web-main/src/components/Hero.astro, web-main/src/components/SiteHeader.astro, web-main/src/components/ui/*
New Astro UI library: Hero, FeatureGrid, FiveLaneDiagram (SVG architecture), SiteHeader with mobile menu, and reusable UI primitives (Badge, Button, Callout, Card, GlassCard, ThemeToggle).
Web-main Pages & Layouts
web-main/src/pages/index.astro, web-main/src/pages/how-it-works.mdx, web-main/src/pages/catalyst.mdx, web-main/src/pages/privacy.mdx, web-main/src/pages/docs/*, web-main/src/layouts/BaseLayout.astro, web-main/src/layouts/DocsLayout.astro
Homepage with five-lane diagram; documentation structure (Getting Started, Stokoe, Catalyst architectures); privacy & trust pages; responsive layouts with dark mode and accessibility focus.
Styling & Design System
web-main/src/styles/global.css, web-main/src/env.d.ts
Global CSS with root design tokens (colors, spacing, borders), accessibility resets, focus states, motion-reduction policy, and Astro type declarations.
Documentation
web-main/core/src/visual/README.md, web-main/DESIGN_SPEC.md, web-main/README.md
Visual Delta Pipeline architecture guide; comprehensive design specification (grid, typography, colors, components, responsive breakpoints); project README with five-lane system overview.
Repository Metadata
.gitignore
Standard ignore patterns for build outputs, dependencies, logs, environment files, IDE directories, and OS metadata.

Sequence Diagram(s)

sequenceDiagram
    participant Client as Client (Browser)
    participant SC as SnapshotClient
    participant API as Visual API
    participant Delta as VisualDeltaDetector
    participant State as State Manager
    participant Policy as ADPolicyGate
    participant Verb as Verbalizer
    participant Panel as UI Panel

    Client->>SC: start() periodic snapshots
    loop Every interval
        Client->>SC: sendSnapshot(tiles, layout)
        SC->>SC: buildComposite(tiles)
        SC->>SC: analyzeRegions()
        SC->>API: POST /visual/snapshot
    end
    
    API->>Delta: handleSnapshot(regions, layout)
    Delta->>Delta: computeDeltas(prevState)
    Note over Delta: VIDTracker.processRegions()<br/>Track appearances, updates, expirations
    Delta->>State: visualStateReducer(events)
    Note over State: Apply snapshot, VID, hand,<br/>screen share, layout events
    State-->>Delta: nextState
    
    Delta-->>API: VisualSnapshotResponse
    API->>Client: WebSocket: visual_events
    
    Client->>Policy: selectADCandidates(events)
    Note over Policy: Filter by cooldown,<br/>prioritize by type
    Policy->>Policy: shouldSpeakAD(audioActivity)
    alt Can speak
        Policy->>Verb: verbalize(candidates)
        Note over Verb: Template or LLM<br/>with fallback
        Verb-->>Policy: descriptions[]
        Policy-->>Client: queue announcements
    else Wait for speech gap
        Policy-->>Client: (no announcement yet)
    end
    
    Client->>Panel: updateVisualState(state)
    Client->>Panel: addEvents(events)
    Panel->>Panel: render()
    Panel-->>Client: UI update (state summary, events, controls)
Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

  • Next #160: Modifies Header.astro and Footer.astro with accessible component refactoring and navigation updates, affecting the same UI elements being rebranded in this PR.

Suggested reviewers

  • markteekman

🐰 Hop with joy, new lanes are here!
Five streams of captions, crystal clear,
Audio blooms where silence grew,
Delta whispers what is new.
Privacy and trust, a solemn creed—
Stokoe gives the ears they need!

✨ Finishing touches
  • 📝 Generate docstrings

📜 Recent review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between e53585c and 8117723.

⛔ Files ignored due to path filters (5)
  • web-main.zip is excluded by !**/*.zip
  • web-main/public/logo-dark.svg is excluded by !**/*.svg
  • web-main/public/logo-light.svg is excluded by !**/*.svg
  • web-main/public/logo.svg is excluded by !**/*.svg
  • web-main/stokoe-mdx-files.zip is excluded by !**/*.zip
📒 Files selected for processing (59)
  • astro.config.mjs
  • public/_redirects
  • src/components/Footer.astro
  • src/components/Header.astro
  • src/components/SiteMeta.astro
  • src/layouts/DefaultLayout.astro
  • src/pages/accessibility.mdx
  • src/pages/security.mdx
  • web-main/.gitignore
  • web-main/DESIGN_SPEC.md
  • web-main/README.md
  • web-main/astro.config.mjs
  • web-main/core/package.json
  • web-main/core/postcss.config.mjs
  • web-main/core/src/__tests__/delta.test.ts
  • web-main/core/src/__tests__/policy.test.ts
  • web-main/core/src/__tests__/verbalizer.test.ts
  • web-main/core/src/__tests__/vid.test.ts
  • web-main/core/src/ad/index.ts
  • web-main/core/src/ad/policy.ts
  • web-main/core/src/ad/verbalizer.ts
  • web-main/core/src/api/visual.ts
  • web-main/core/src/events/visual.ts
  • web-main/core/src/index.ts
  • web-main/core/src/state/visual.ts
  • web-main/core/src/ui/VisualDeltaPanel.ts
  • web-main/core/src/visual/README.md
  • web-main/core/src/visual/delta.ts
  • web-main/core/src/visual/fingerprint.ts
  • web-main/core/src/visual/index.ts
  • web-main/core/src/visual/snapshot.ts
  • web-main/core/src/visual/vid.ts
  • web-main/core/tsconfig.json
  • web-main/core/vitest.config.ts
  • web-main/package.json
  • web-main/postcss.config.mjs
  • web-main/src/components/FeatureGrid.astro
  • web-main/src/components/FiveLaneDiagram.astro
  • web-main/src/components/Hero.astro
  • web-main/src/components/SiteHeader.astro
  • web-main/src/components/ui/Badge.astro
  • web-main/src/components/ui/Button.astro
  • web-main/src/components/ui/Callout.astro
  • web-main/src/components/ui/Card.astro
  • web-main/src/components/ui/GlassCard.astro
  • web-main/src/components/ui/ThemeToggle.astro
  • web-main/src/env.d.ts
  • web-main/src/layouts/BaseLayout.astro
  • web-main/src/layouts/DocsLayout.astro
  • web-main/src/pages/catalyst.mdx
  • web-main/src/pages/docs/catalyst/architecture.mdx
  • web-main/src/pages/docs/index.mdx
  • web-main/src/pages/docs/stokoe/architecture.mdx
  • web-main/src/pages/how-it-works.mdx
  • web-main/src/pages/index.astro
  • web-main/src/pages/privacy.mdx
  • web-main/src/styles/global.css
  • web-main/tailwind.config.mjs
  • web-main/tsconfig.json

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@stokoe-app stokoe-app closed this Jan 5, 2026
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.

2 participants