feat: moved audiplayer to its own page and updated URL to actual audio

next.config.js

@@ -1,7 +1,6 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   experimental: {
-    serverActions: true,
     optimizePackageImports: ["@chakra-ui/react"],
   },
   images: {

package.json

@@ -28,6 +28,7 @@
     "@shelf/jest-mongodb": "^4.3.2",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.1.0",
+    "@types/howler": "^2.2.12",
     "@types/jest": "^29.5.14",
     "@types/node": "^20",
     "@types/react": "^18",

src/app/audioplayer/page.tsx

@@ -0,0 +1,17 @@
+"use client";
+import { useState, useRef } from "react";
+import Navbar from "@/components/Navbar";
+import AudioPlayer from "@/components/AudioPlayer";
+
+export default function Page() {
+  return (
+    <main>
+      <Navbar />
+      <h1 className="text-3xl font-bold underline">Hello world!</h1> {/* sample audio formatting */}
+      <AudioPlayer
+        audioURL="https://og83eubqb6o3yptf.public.blob.vercel-storage.com/Bill_Deneen_Kathleen_Final-KDIk27mD6mgRGoXc2MyH7NLrmvXFAR.wav"
+        name="Test Audio"
+      />
+    </main>
+  );
+}

src/app/page.tsx

@@ -1,13 +1,8 @@
 import Navbar from "@/components/Navbar";
-import AudioPlayer from "@/components/AudioPlayer";
-
 export default function Home() {
   return (
     <main>
       <Navbar />
-      <h1 className="text-3xl font-bold underline">Hello world!</h1> {/* sample audio formatting */}
-      <AudioPlayer audioURL="https://www.example.com/sample-audio.mp3" name="Sample Audio" />
     </main>
   );
-  s;
 }