Update README.md

Updated details about API keys

README.md

@@ -23,13 +23,13 @@ Feel free to play around with the existing code and please leave any feedback fo
 
 6. Run `npm run dev`
 
-### Difference between Trial Token and Enterprise API Token
+### Using the API Key
 
-The HeyGen Trial Token is available to all users, not just Enterprise users, and allows for testing of the Interactive Avatar API, as well as other HeyGen API endpoints.
+Every HeyGen user receives 10 free API Credits when they sign up for HeyGen. You can access your HeyGen API Key at https://app.heygen.com/settings?nav=API
 
-Each Trial Token is limited to 3 concurrent interactive sessions. However, every interactive session you create with the Trial Token is free of charge, no matter how many tasks are sent to the avatar. Please note that interactive sessions will automatically close after 10 minutes of no tasks sent.
+To see the different amounts of credits that are consumed by different endpoints of the API, visit the Limits page of the API documentation: https://docs.heygen.com/reference/limits
 
-If you do not 'close' the interactive sessions and try to open more than 3, you will encounter errors including stuttering and freezing of the Interactive Avatar. Please endeavor to only have 3 sessions open at any time while you are testing the Interactive Avatar API with your Trial Token.
+To add more API credits, subscribe to one of HeyGen's API Plans. Pricing and details can be found at https://www.heygen.com/api-pricing
 
 ### Starting sessions
 

components/InteractiveAvatar.tsx

@@ -31,7 +31,7 @@ export default function InteractiveAvatar() {
   const [stream, setStream] = useState<MediaStream>();
   const [debug, setDebug] = useState<string>();
   const [knowledgeId, setKnowledgeId] = useState<string>("");
-  const [avatarId, setAvatarId] = useState<string>("");
+  const [avatarId, setAvatarId] = useState<string>("Wayne_20240711");
   const [language, setLanguage] = useState<string>('en');
 
   const [data, setData] = useState<StartAvatarResponse>();
@@ -64,6 +64,8 @@ export default function InteractiveAvatar() {
 
     avatar.current = new StreamingAvatar({
       token: newToken,
+      basePath: "https://api.heygen.com",
+      userAudioWebsocketPath: "ws://localhost:3001/user-audio-input",
     });
     avatar.current.on(StreamingEvents.AVATAR_START_TALKING, (e) => {
       console.log("Avatar started talking", e);
@@ -91,12 +93,6 @@ export default function InteractiveAvatar() {
       const res = await avatar.current.createStartAvatar({
         quality: AvatarQuality.Low,
         avatarName: avatarId,
-        knowledgeId: knowledgeId, // Or use a custom `knowledgeBase`.
-        voice: {
-          rate: 1.5, // 0.5 ~ 1.5
-          emotion: VoiceEmotion.EXCITED,
-        },
-        language: language,
         disableIdleTimeout: true,
       });
 
@@ -125,6 +121,7 @@ export default function InteractiveAvatar() {
     });
     setIsLoadingRepeat(false);
   }
+  
   async function handleInterrupt() {
     if (!avatar.current) {
       setDebug("Avatar API not initialized");

package.json

@@ -10,20 +10,20 @@
   },
   "dependencies": {
     "@ai-sdk/openai": "^0.0.34",
-    "@heygen/streaming-avatar": "^2.0.8",
-    "@nextui-org/button": "2.0.34",
+    "@heygen/streaming-avatar": "github:HeyGen-Official/StreamingAvatarSDK#realtime-alpha",
+    "@nextui-org/button": "^2.0.34",
     "@nextui-org/chip": "^2.0.32",
-    "@nextui-org/code": "2.0.29",
-    "@nextui-org/input": "2.2.2",
-    "@nextui-org/kbd": "2.0.30",
-    "@nextui-org/link": "2.0.32",
-    "@nextui-org/listbox": "2.1.21",
-    "@nextui-org/navbar": "2.0.33",
+    "@nextui-org/code": "^2.0.29",
+    "@nextui-org/input": "^2.2.2",
+    "@nextui-org/kbd": "^2.0.30",
+    "@nextui-org/link": "^2.0.32",
+    "@nextui-org/listbox": "^2.1.21",
+    "@nextui-org/navbar": "^2.0.33",
     "@nextui-org/react": "^2.4.2",
-    "@nextui-org/snippet": "2.0.38",
-    "@nextui-org/switch": "2.0.31",
-    "@nextui-org/system": "2.2.1",
-    "@nextui-org/theme": "2.2.5",
+    "@nextui-org/snippet": "^2.0.38",
+    "@nextui-org/switch": "^2.0.31",
+    "@nextui-org/system": "^2.2.1",
+    "@nextui-org/theme": "^2.2.5",
     "@phosphor-icons/react": "^2.1.5",
     "@react-aria/ssr": "3.9.4",
     "@react-aria/visually-hidden": "3.8.12",
@@ -32,7 +32,7 @@
     "ahooks": "^3.8.1",
     "ai": "^3.2.15",
     "clsx": "2.1.1",
-    "framer-motion": "~11.1.1",
+    "framer-motion": "^11.5.6",
     "intl-messageformat": "^10.5.0",
     "next": "14.2.4",
     "next-themes": "^0.2.1",