Rely on TTS API for splitting

README.md

@@ -103,7 +103,7 @@ services:
 
 3. Configure the environment:
    ```bash
-   cp .env.template .env
+   cp template.env .env
    # Edit .env with your configuration settings
    ```
    > Note: The base URL for the TTS API should be accessible and relative to the Next.js server

src/app/api/tts/route.ts

@@ -20,7 +20,7 @@ export async function POST(req: NextRequest) {
     // Initialize OpenAI client with abort signal
     const openai = new OpenAI({
       apiKey: openApiKey,
-      baseURL: openApiBaseUrl || 'https://api.openai.com/v1',
+      baseURL: openApiBaseUrl,
     });
 
     // Request audio from OpenAI and pass along the abort signal
@@ -33,15 +33,15 @@ export async function POST(req: NextRequest) {
 
     // Get the audio data as array buffer
     // This will also be aborted if the client cancels
-    const arrayBuffer = await response.arrayBuffer();
+    const stream = response.body;
 
     // Return audio data with appropriate headers
-    return new NextResponse(arrayBuffer);
+    return new NextResponse(stream);
   } catch (error) {
     // Check if this was an abort error
     if (error instanceof Error && error.name === 'AbortError') {
       console.log('TTS request aborted by client');
-      return new Response(null, { status: 499 }); // Use 499 status for client closed request
+      return new NextResponse(null, { status: 499 }); // Use 499 status for client closed request
     }
 
     console.error('Error generating TTS:', error);

src/components/DocumentSettings.tsx

@@ -1,11 +1,13 @@
 'use client';
 
 import { Fragment, useState, useRef } from 'react';
-import { Dialog, DialogPanel, DialogTitle, Transition, TransitionChild, Listbox, ListboxButton, ListboxOptions, ListboxOption, Button } from '@headlessui/react';
+import { Dialog, DialogPanel, Transition, TransitionChild, Listbox, ListboxButton, ListboxOptions, ListboxOption, Button } from '@headlessui/react';
 import { useConfig, ViewType } from '@/contexts/ConfigContext';
 import { ChevronUpDownIcon, CheckIcon } from '@/components/icons/Icons';
 import { useEPUB } from '@/contexts/EPUBContext';
 
+const isDev = process.env.NEXT_PUBLIC_NODE_ENV !== 'production' || process.env.NODE_ENV == null;
+
 interface DocViewSettingsProps {
   isOpen: boolean;
   setIsOpen: (isOpen: boolean) => void;
@@ -93,14 +95,43 @@ export function DocumentSettings({ isOpen, setIsOpen, epub }: DocViewSettingsPro
               leaveTo="opacity-0 scale-95"
             >
               <DialogPanel className="w-full max-w-md transform rounded-2xl bg-base p-6 text-left align-middle shadow-xl transition-all">
-                <DialogTitle
-                  as="h3"
-                  className="text-lg font-semibold leading-6 text-foreground"
-                >
-                  View Settings
-                </DialogTitle>
-                <div className="mt-4">
                 <div className="space-y-4">
+                  {isDev && <div className="space-y-2 pb-2">
+                    {!isGenerating ? (
+                      <Button
+                        type="button"
+                        className="w-full inline-flex justify-center rounded-lg bg-accent px-4 py-2 text-sm 
+                                       font-medium text-background hover:opacity-95 focus:outline-none 
+                                       focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2
+                                       transform transition-transform duration-200 ease-in-out hover:scale-[1.04]"
+                        onClick={handleStartGeneration}
+                      >
+                        Export to Audiobook (experimental)
+                      </Button>
+                    ) : (
+                      <div className="space-y-2">
+                        <div className="w-full bg-background rounded-lg overflow-hidden">
+                          <div
+                            className="h-2 bg-accent transition-all duration-300 ease-in-out"
+                            style={{ width: `${progress}%` }}
+                          />
+                        </div>
+                        <div className="flex justify-between items-center text-sm text-muted">
+                          <span>{Math.round(progress)}% complete</span>
+                          <Button
+                            type="button"
+                            className="inline-flex justify-center rounded-lg px-2.5 py-1 text-sm 
+                                    font-medium text-foreground hover:text-accent focus:outline-none 
+                                    focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2
+                                    transform transition-transform duration-200 ease-in-out hover:scale-[1.02]"
+                            onClick={handleCancel}
+                          >
+                            Cancel and download
+                          </Button>
+                        </div>
+                      </div>
+                    )}
+                  </div>}
                   {!epub && <div className="space-y-2">
                     <label className="block text-sm font-medium text-foreground">Mode</label>
                     <Listbox
@@ -169,7 +200,6 @@ export function DocumentSettings({ isOpen, setIsOpen, epub }: DocViewSettingsPro
                     </p>
                   </div>
                   {epub && (
-                      <>
                     <div className="space-y-2">
                       <label className="flex items-center space-x-2">
                         <input
@@ -184,46 +214,8 @@ export function DocumentSettings({ isOpen, setIsOpen, epub }: DocViewSettingsPro
                         Apply the current app theme to the EPUB viewer
                       </p>
                     </div>
-                        <div className="mt-4 space-y-2">
-                          {!isGenerating ? (
-                            <Button
-                              type="button"
-                              className="w-full inline-flex justify-center rounded-lg bg-accent px-4 py-2 text-sm 
-                                       font-medium text-background hover:opacity-95 focus:outline-none 
-                                       focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2
-                                       transform transition-transform duration-200 ease-in-out hover:scale-[1.04]"
-                              onClick={handleStartGeneration}
-                            >
-                              Export to Audiobook (.mp3)
-                            </Button>
-                          ) : (
-                            <div className="space-y-2">
-                              <div className="w-full bg-background rounded-lg overflow-hidden">
-                                <div
-                                  className="h-2 bg-accent transition-all duration-300 ease-in-out"
-                                  style={{ width: `${progress}%` }}
-                                />
-                              </div>
-                              <div className="flex justify-between items-center text-sm text-muted">
-                                <span>{Math.round(progress)}% complete</span>
-                                <Button
-                                  type="button"
-                                  className="inline-flex justify-center rounded-lg px-2.5 py-1 text-sm 
-                                    font-medium text-foreground hover:text-accent focus:outline-none 
-                                    focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2
-                                    transform transition-transform duration-200 ease-in-out hover:scale-[1.02]"
-                                  onClick={handleCancel}
-                                >
-                                  Cancel and download
-                                </Button>
-                              </div>
-                            </div>
                   )}
                 </div>
-                      </>
-                    )}
-                  </div>
-                </div>
 
                 <div className="mt-3 flex justify-end">
                   <Button

src/contexts/EPUBContext.tsx

@@ -191,90 +191,35 @@ export function EPUBProvider({ children }: { children: ReactNode }) {
 
       // Create an array to store all audio chunks
       const audioChunks: ArrayBuffer[] = [];
-      let processedSentences = 0;
+      let processedSections = 0;
-      let totalSentences = 0;
+      const totalSections = textArray.length;
-
-      // First, count total sentences
-      for (const text of textArray) {
-        if (!text.trim()) continue;
-
-        const nlpResponse = await fetch('/api/nlp', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ text }),
-        });
-
-        if (!nlpResponse.ok) {
-          throw new Error(`NLP processing failed with status ${nlpResponse.status}`);
-        }
-
-        const nlpData = await nlpResponse.json();
-        const sentences = nlpData?.sentences;
-        if (sentences && Array.isArray(sentences)) {
-          totalSentences += sentences.length;
-        }
-      }
 
       // Process each section of text
       for (const text of textArray) {
-        if (!text.trim()) continue;
-
-        // Check for cancellation
-        if (signal?.aborted) {
-          // If cancelled, return what we have so far
-          const partialBuffer = combineAudioChunks(audioChunks);
-          return partialBuffer;
-        }
-
-        const nlpResponse = await fetch('/api/nlp', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ text }),
-        });
-
-        if (!nlpResponse.ok) {
-          throw new Error(`NLP processing failed with status ${nlpResponse.status}`);
-        }
-
-        const nlpData = await nlpResponse.json();
-        const sentences = nlpData?.sentences;
-
-        if (!sentences || !Array.isArray(sentences) || sentences.length === 0) {
-          console.warn('No valid sentences returned from NLP, processing text block as single sentence');
-          continue;
-        }
-
-        // Process each sentence through TTS with retries
-        for (const sentence of sentences) {
         // Check for cancellation
         if (signal?.aborted) {
           const partialBuffer = combineAudioChunks(audioChunks);
           return partialBuffer;
         }
 
-          if (!sentence || typeof sentence !== 'string' || !sentence.trim()) {
+        if (!text.trim()) {
-            processedSentences++;
+          processedSections++;
           continue;
         }
 
-          let retryCount = 0;
-          const maxRetries = 2;
-          let success = false;
-
-          while (retryCount <= maxRetries && !success) {
         try {
           const ttsResponse = await fetch('/api/tts', {
             method: 'POST',
             headers: {
-                  'Content-Type': 'application/json',
+              'x-openai-key': apiKey,
-                  'x-openai-key': apiKey || '',
+              'x-openai-base-url': baseUrl,
-                  'x-openai-base-url': baseUrl || 'https://api.openai.com/v1',
             },
             body: JSON.stringify({
-                  text: sentence.trim(),
+              text: text.trim(),
               voice: voice,
               speed: voiceSpeed,
             }),
+            signal // Pass the AbortSignal to the fetch request
           });
 
           if (!ttsResponse.ok) {
@@ -287,27 +232,22 @@ export function EPUBProvider({ children }: { children: ReactNode }) {
           }
 
           audioChunks.push(audioBuffer);
-              success = true;
-            } catch (error) {
-              retryCount++;
-              if (retryCount <= maxRetries) {
-                console.warn(`TTS generation failed, attempt ${retryCount} of ${maxRetries}:`, error);
-                await new Promise(resolve => setTimeout(resolve, 1000));
-              } else {
-                console.error(`Failed to generate audio after ${maxRetries} retries, skipping sentence:`, sentence);
-              }
-            }
-          }
 
-          if (success) {
+          // Add a small pause between sections (500ms of silence)
-            // Add a small pause between sentences (500ms of silence)
           const silenceBuffer = new ArrayBuffer(24000);
           audioChunks.push(silenceBuffer);
+
+        } catch (error) {
+          if (error instanceof Error && error.name === 'AbortError') {
+            console.log('TTS request aborted');
+            const partialBuffer = combineAudioChunks(audioChunks);
+            return partialBuffer;
+          }
+          console.error('Error processing section:', error);
         }
 
-          processedSentences++;
+        processedSections++;
-          onProgress((processedSentences / totalSentences) * 100);
+        onProgress((processedSections / totalSections) * 100);
-        }
       }
 
       if (audioChunks.length === 0) {