Skip to content

feat: Implement text-to-speech for articles#438

Open
wangweity wants to merge 5 commits intocooderl:mainfrom
wangweity:text-to-speech
Open

feat: Implement text-to-speech for articles#438
wangweity wants to merge 5 commits intocooderl:mainfrom
wangweity:text-to-speech

Conversation

@wangweity
Copy link
Copy Markdown

This feature adds text-to-speech (TTS) functionality to the application, allowing you to listen to WeChat Official Account articles.

Key changes include:

Frontend (apps/web):

  • Added a new ArticleViewer component to display article content fetched from the backend.
  • Integrated the Web Speech API for TTS capabilities.
  • Implemented playback controls:
    • Play, Pause, Resume functionality.
    • Skip forward and skip backward (by a set number of words).
    • Draggable progress bar to show and control speech playback position.
  • Modified the article list to open the ArticleViewer in a modal.
  • Added unit tests for the ArticleViewer component, covering rendering, content display, and TTS controls.
  • Updated the tRPC client to use an environment variable (VITE_API_URL) for the backend URL, facilitating deployment.
  • Added VITE_API_URL to .env.local.example.

Backend (apps/server):

  • Added a new tRPC endpoint (article.content) to fetch raw HTML content for a given article ID.
  • Modified prisma/schema.prisma to set the database provider to postgresql for compatibility with Render.com deployment.

Deployment:

  • The changes are prepared for deployment on Render.com, with the frontend as a static site and the backend as a Dockerized web service using PostgreSQL.

google-labs-jules bot and others added 5 commits June 2, 2025 14:16
This feature adds text-to-speech (TTS) functionality to the application, allowing you to listen to WeChat Official Account articles.

Key changes include:

Frontend (apps/web):
- Added a new `ArticleViewer` component to display article content fetched from the backend.
- Integrated the Web Speech API for TTS capabilities.
- Implemented playback controls:
    - Play, Pause, Resume functionality.
    - Skip forward and skip backward (by a set number of words).
    - Draggable progress bar to show and control speech playback position.
- Modified the article list to open the `ArticleViewer` in a modal.
- Added unit tests for the `ArticleViewer` component, covering rendering, content display, and TTS controls.
- Updated the tRPC client to use an environment variable (`VITE_API_URL`) for the backend URL, facilitating deployment.
- Added `VITE_API_URL` to `.env.local.example`.

Backend (apps/server):
- Added a new tRPC endpoint (`article.content`) to fetch raw HTML content for a given article ID.
- Modified `prisma/schema.prisma` to set the database provider to `postgresql` for compatibility with Render.com deployment.

Deployment:
- The changes are prepared for deployment on Render.com, with the frontend as a static site and the backend as a Dockerized web service using PostgreSQL.
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