Paul Bailey
e92d0349bf
- Created VoiceAssignmentSection component with role-to-voice mapping - Added language selector with American English, British English, French, Japanese - Added speed slider (0.5x - 1.5x range) - Implemented Generate Audiobook button with proper disabled state - Integrated component into App.tsx with state management - Added role detection API call on text submission - Validates all roles have assigned voices before enabling generation Requirements: 3.1, 3.2, 3.3, 3.4, 3.5, 3.6, 4.1, 4.2, 4.3, 4.4, 5.1, 5.2, 5.3
Text to Audiobook Frontend
React TypeScript frontend for the Text to Audiobook application.
Setup
Prerequisites
- Node.js 20.19+ or 22.12+
- npm or yarn
Installation
- Install dependencies:
npm install
- Create environment file:
cp .env.example .env
- Update
.envwith your backend URL (default:http://localhost:8000)
Development
Start the development server:
npm run dev
The application will be available at http://localhost:5173
Build
Build for production:
npm run build
Preview production build:
npm run preview
Project Structure
src/
├── api/ # API client modules
├── components/ # React components
├── App.tsx # Main application component
├── main.tsx # Application entry point
└── index.css # Global styles (Tailwind)
Environment Variables
VITE_API_BASE_URL- Backend API base URL (default: http://localhost:8000)