firebase-intermediate-complete

Author: ARYPROGRAMMER

app/api/generate-audio-file/route.jsx

@@ -1,14 +1,13 @@
 import { ElevenLabsClient } from "elevenlabs";
-import { writeFile } from "fs/promises";
 import { NextResponse } from "next/server";
-import path from "path";
-import { mkdir } from "fs/promises";
+import { getDownloadURL, ref, uploadBytes } from "firebase/storage";
+import { storage } from "@/configs/FireBaseConfig";
 
 export async function POST(req) {
     try {
 
         const { text, id } = await req.json();
-        
+
         if (!text || !id) {
             return NextResponse.json(
                 { error: "Missing required fields: text and id" },
@@ -23,23 +22,28 @@ export async function POST(req) {
             apiKey: apiKey,
         });
 
-        const audioResponse = await elevenlabs.generate({
+        const audioStream = await elevenlabs.generate({
 
             voice: "Jessica" ,
             text: text,
             modelId: "eleven_multilingual_v2",
             outputFormat: "mp3",
         });
+        const chunks = [];
+        for await (const chunk of audioStream) {
+            chunks.push(chunk);
+        }
+        const audioBuffer = Buffer.concat(chunks);
 
-        const audioDir = path.join(process.cwd());
-        await mkdir(audioDir, { recursive: true });
+        const storageRef = ref(storage,'video-generator-ai-files/'+id+'.mp3');
 
-        const filePath = path.join(audioDir, `output.mp3`);
-        await writeFile(filePath, audioResponse);
+        await uploadBytes(storageRef, audioBuffer, { contentType: 'audio/mp3' });
 
+        const downloadUrl = await getDownloadURL(storageRef);
+      
         return NextResponse.json(
             { 
-                Result: 'Success'
+                Result: downloadUrl
             },
             { status: 200 }
         );

app/dashboard/create-new/page.jsx

@@ -16,9 +16,9 @@ function CreateNew() {
   const [formData,setFormData]= useState([])
   const [loading,setLoading]=useState(false)
   const [videoScript,setVideoScript]=useState()
+  const [audioFileUrl,setAudioFileUrl]=useState()
 
   const onHandleChange=(fieldName,fieldValue)=>{
-    console.log(fieldName,fieldValue)
     setFormData(
       prev=>({
         ...prev,
@@ -59,7 +59,7 @@ function CreateNew() {
         id: id
       }
     ).then(res=>{
-      console.log(res)
+      setAudioFileUrl(res.data.Result);
     })
     setLoading(false)
   }

configs/FireBaseConfig.jsx

@@ -0,0 +1,21 @@
+// Import the functions you need from the SDKs you need
+import { initializeApp } from "firebase/app";
+
+import { getStorage } from "firebase/storage";
+// TODO: Add SDKs for Firebase products that you want to use
+// https://firebase.google.com/docs/web/setup#available-libraries
+
+// Your web app's Firebase configuration
+const firebaseConfig = {
+  apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
+  authDomain: "supercool-mental-health-app.firebaseapp.com",
+  projectId: "supercool-mental-health-app",
+  storageBucket: "supercool-mental-health-app.appspot.com",
+  messagingSenderId: "26005611530",
+  appId: "1:26005611530:web:3eeedbf3f32703373babf3"
+};
+
+// Initialize Firebase
+const app = initializeApp(firebaseConfig);
+
+export const storage=getStorage(app);