Improves bar visualizer animations and adds initializing state (#987)

Co-authored-by: lukasIO <[email protected]>
livekit · Sep 29, 2024 · 11bdec8 · 11bdec8
1 parent 3a8495f
commit 11bdec8
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 2 deletions.
diff --git a/.changeset/ninety-cheetahs-tickle.md b/.changeset/ninety-cheetahs-tickle.md
@@ -0,0 +1,5 @@
+---
+"@livekit/components-react": patch
+---
+
+Improve bar visualizer animations and add initializing state
diff --git a/packages/react/src/components/participant/BarVisualizer.tsx b/packages/react/src/components/participant/BarVisualizer.tsx
@@ -30,7 +30,8 @@ export interface BarVisualizerProps extends React.HTMLProps<HTMLDivElement> {
 }
 
 const sequencerIntervals = new Map<AgentState, number>([
-  ['connecting', 25 * 15],
+  ['connecting', 2000],
+  ['initializing', 2000],
   ['listening', 500],
   ['thinking', 150],
 ]);

diff --git a/packages/react/src/components/participant/animationSequences/connectingSequence.ts b/packages/react/src/components/participant/animationSequences/connectingSequence.ts
@@ -1,7 +1,7 @@
 export const generateConnectingSequenceBar = (columns: number): number[][] => {
   const seq = [];
 
-  for (let x = 0; x <= columns; x++) {
+  for (let x = 0; x < columns; x++) {
     seq.push([x, columns - 1 - x]);
   }