Amin Mousavi
93c6513df6
MediaRecorder handling and the API call live in lib/, not in ui/, so
TreatmentDetailsEditor can stay presentational and take only a `voice` prop.
Container choice is made at record time and needs no transcode: Chrome and
Android give webm/opus, Safari and iPad give mp4/aac, and the transcription
endpoint accepts both. Safari's `audio/mp4` is sent as `m4a`, the name the
vendor's container list actually uses, so iPad recordings do not fail while
Chrome works. Older Safari shipped MediaRecorder without isTypeSupported, so
that path lets the browser choose rather than refusing outright.
From review of this commit:
- The auto-stop at maxMs guaranteed a 413. The client measures the final length
after the recorder has stopped, so a recording that runs to the cap always
reports slightly over it, and the server rejected exactly the recording the
auto-stop existed to save. The server now allows a documented 2s tolerance and
the client keeps reporting the true length, so telemetry stays honest.
- getUserMedia is async, so a permission granted after unmount installed a live
stream the cleanup effect had already run past — leaving the browser's
recording indicator lit with nothing listening. Guarded with a mounted ref.
- Client-side failures are now ApiError-shaped ({code, statusCode}) rather than
bare Errors, because getUserFacingError only resolves that shape; without it
errors.VOICE_MIC_DENIED was dead in all three locales.
Cancelling aborts the request, which closes the connection and aborts the
metered vendor call server-side rather than letting it settle unseen. The level
meter is best-effort: a blocked AudioContext costs the meter, not the recording.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Dyolink — Frontend (Next.js)
Prerequisites
- Node.js 20+ and npm
First-time setup
-
Clone the monorepo and go to the frontend app:
git clone <repository-url> dyolink cd dyolink/frontend -
Install dependencies
npm install -
Environment
Create
.env.localin this folder (not committed to git) with the public URLs your browser will use:NEXT_PUBLIC_APP_URL=http://localhost:3001 NEXT_PUBLIC_API_URL=http://localhost:3000/api NEXT_PUBLIC_APP_NAME=Dyolink- Adjust
NEXT_PUBLIC_API_URLif the Nest API runs on another host/port. - These values are baked in at build time for production images; for local dev, restart
npm run devafter changing them.
- Adjust
Run (development)
npm run dev
Open http://localhost:3001 (dev server uses port 3001 so it does not clash with the API on 3000).
Ensure the backend is running and NEXT_PUBLIC_API_URL matches its base URL (including /api if your API is mounted there).
After pulling latest main
git pull
npm install
Useful commands
| Command | Purpose |
|---|---|
npm run dev |
Development server (port 3001) |
npm run build |
Production build |
npm run start |
Serve production build (port 3000 — used inside Docker) |
npm run lint |
ESLint |
Docker
Image build and build-args (NEXT_PUBLIC_*) are documented in the repository root README.md.