feedback

Author: thomasyuill-livekit

components/app/session-view.tsx

@@ -18,7 +18,7 @@ import { ScrollArea } from '../livekit/scroll-area/scroll-area';
 
 const MotionBottom = motion.create('div');
 
-const IN_DEVELOPMENT = process.env.NODE_END !== 'production';
+const IN_DEVELOPMENT = process.env.NODE_ENV !== 'production';
 const BOTTOM_VIEW_MOTION_PROPS = {
   variants: {
     visible: {

components/livekit/agent-control-bar/agent-control-bar.tsx

@@ -13,8 +13,6 @@ import { UseInputControlsProps, useInputControls } from './hooks/use-input-contr
 import { usePublishPermissions } from './hooks/use-publish-permissions';
 import { TrackSelector } from './track-selector';
 
-const NOOP = () => {};
-
 export interface ControlBarControls {
   leave?: boolean;
   camera?: boolean;
@@ -37,9 +35,9 @@ export function AgentControlBar({
   controls,
   saveUserChoices = true,
   className,
-  onDisconnect = NOOP,
-  onDeviceError = NOOP,
-  onChatOpenChange = NOOP,
+  onDisconnect,
+  onDeviceError,
+  onChatOpenChange,
   ...props
 }: AgentControlBarProps & HTMLAttributes<HTMLDivElement>) {
   const { send } = useChat();
@@ -74,7 +72,7 @@ export function AgentControlBar({
   const handleToggleTranscript = useCallback(
     (open: boolean) => {
       setChatOpen(open);
-      onChatOpenChange(open);
+      onChatOpenChange?.(open);
     },
     [onChatOpenChange, setChatOpen]
   );
@@ -87,7 +85,7 @@ export function AgentControlBar({
     }
 
     setIsDisconnecting(false);
-    onDisconnect();
+    onDisconnect?.();
   }, [room, onDisconnect]);
 
   const visibleControls = {

components/livekit/agent-control-bar/hooks/use-input-controls.ts

@@ -7,8 +7,6 @@ import {
   useTrackToggle,
 } from '@livekit/components-react';
 
-const NOOP = () => {};
-
 export interface UseInputControlsProps {
   saveUserChoices?: boolean;
   onDisconnect?: () => void;
@@ -28,23 +26,23 @@ export interface UseInputControlsReturn {
 
 export function useInputControls({
   saveUserChoices = true,
-  onDeviceError = NOOP,
+  onDeviceError,
 }: UseInputControlsProps = {}): UseInputControlsReturn {
   const { microphoneTrack, localParticipant } = useLocalParticipant();
 
   const microphoneToggle = useTrackToggle({
     source: Track.Source.Microphone,
-    onDeviceError: (error) => onDeviceError({ source: Track.Source.Microphone, error }),
+    onDeviceError: (error) => onDeviceError?.({ source: Track.Source.Microphone, error }),
   });
 
   const cameraToggle = useTrackToggle({
     source: Track.Source.Camera,
-    onDeviceError: (error) => onDeviceError({ source: Track.Source.Camera, error }),
+    onDeviceError: (error) => onDeviceError?.({ source: Track.Source.Camera, error }),
   });
 
   const screenShareToggle = useTrackToggle({
     source: Track.Source.ScreenShare,
-    onDeviceError: (error) => onDeviceError({ source: Track.Source.ScreenShare, error }),
+    onDeviceError: (error) => onDeviceError?.({ source: Track.Source.ScreenShare, error }),
   });
 
   const micTrackRef = useMemo(() => {
@@ -107,12 +105,12 @@ export function useInputControls({
     [cameraToggle, screenShareToggle]
   );
   const handleMicrophoneDeviceSelectError = useCallback(
-    (error: Error) => onDeviceError({ source: Track.Source.Microphone, error }),
+    (error: Error) => onDeviceError?.({ source: Track.Source.Microphone, error }),
     [onDeviceError]
   );
 
   const handleCameraDeviceSelectError = useCallback(
-    (error: Error) => onDeviceError({ source: Track.Source.Camera, error }),
+    (error: Error) => onDeviceError?.({ source: Track.Source.Camera, error }),
     [onDeviceError]
   );
 

components/livekit/agent-control-bar/track-device-select.tsx

@@ -13,8 +13,6 @@ import {
 } from '@/components/livekit/select';
 import { cn } from '@/lib/utils';
 
-const NOOP = () => {};
-
 type DeviceSelectProps = React.ComponentProps<typeof SelectTrigger> & {
   kind: MediaDeviceKind;
   variant?: 'default' | 'small';
@@ -45,9 +43,9 @@ export function TrackDeviceSelect({
   track,
   size = 'default',
   requestPermissions = false,
-  onMediaDeviceError = NOOP,
-  onDeviceListChange = NOOP,
-  onActiveDeviceChange = NOOP,
+  onMediaDeviceError,
+  onDeviceListChange,
+  onActiveDeviceChange,
   ...props
 }: DeviceSelectProps) {
   const room = useMaybeRoomContext();
@@ -62,7 +60,7 @@ export function TrackDeviceSelect({
   });
 
   useEffect(() => {
-    onDeviceListChange(devices);
+    onDeviceListChange?.(devices);
   }, [devices, onDeviceListChange]);
 
   // When the select opens, ensure that media devices are re-requested in case when they were last
@@ -75,7 +73,7 @@ export function TrackDeviceSelect({
 
   const handleActiveDeviceChange = (deviceId: string) => {
     setActiveMediaDevice(deviceId);
-    onActiveDeviceChange(deviceId);
+    onActiveDeviceChange?.(deviceId);
   };
 
   const filteredDevices = useMemo(() => devices.filter((d) => d.deviceId !== ''), [devices]);

components/livekit/scroll-area/hooks/useAutoScroll.ts

@@ -1,6 +1,6 @@
 import { useEffect } from 'react';
 
-const AUTO_SCROLL_THRESHOLD = 50;
+const AUTO_SCROLL_THRESHOLD_PX = 50;
 
 export function useAutoScroll(scrollContentContainer?: Element | null) {
   useEffect(() => {
@@ -12,7 +12,7 @@ export function useAutoScroll(scrollContentContainer?: Element | null) {
         scrollContentContainer.clientHeight -
         scrollContentContainer.scrollTop;
 
-      if (distanceFromBottom < AUTO_SCROLL_THRESHOLD) {
+      if (distanceFromBottom < AUTO_SCROLL_THRESHOLD_PX) {
         scrollContentContainer.scrollTop = scrollContentContainer.scrollHeight;
       }
     }