jb/paseo
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(app): remove debug logging from voice and UI components

Browse Source
This commit is contained in:
Mohamed Boudra
2026-03-13 21:07:18 +07:00
parent 80a2f8052c
commit 502dd2d2e2
28 changed files with 56 additions and 1288 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/app/src/components/agent-input-area.tsx
-30
View File
@@ -103,23 +103,6 @@ export function AgentInputArea({
const { client, isConnected, snapshot } = useHostRuntimeSession(serverId)
const toast = useToast()
const voice = useVoiceOptional()
console.log("[AgentInputArea] render", {
serverId,
agentId,
isConnected,
isVoiceMode: voice?.isVoiceMode ?? false,
isVoiceSwitching: voice?.isVoiceSwitching ?? false,
isMuted: voice?.isMuted ?? false,
})
console.log("[AgentInputArea] voice_snapshot", {
serverId,
agentId,
isVoiceMode: voice?.isVoiceMode ?? false,
isVoiceSwitching: voice?.isVoiceSwitching ?? false,
isMuted: voice?.isMuted ?? false,
activeServerId: voice?.activeServerId ?? null,
activeAgentId: voice?.activeAgentId ?? null,
})
const isDictationReady =
isConnected &&
(snapshot?.agentDirectoryStatus === 'ready' ||
@@ -168,19 +151,6 @@ export function AgentInputArea({
`message-input:${serverId}:${agentId}:${Math.random().toString(36).slice(2)}`
)
useEffect(() => {
console.log("[AgentInputArea] mount", {
serverId,
agentId,
})
return () => {
console.log("[AgentInputArea] unmount", {
serverId,
agentId,
})
}
}, [agentId, serverId])
const autocomplete = useAgentAutocomplete({
userInput,
cursorIndex,
packages/app/src/components/artifact-drawer.tsx
-11
View File
@@ -6,7 +6,6 @@ import {
Modal,
} from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
import { useEffect } from "react";
import { StyleSheet } from "react-native-unistyles";
import { Fonts } from "@/constants/theme";
@@ -154,16 +153,6 @@ const styles = StyleSheet.create((theme) => ({
}));
export function ArtifactDrawer({ artifact, onClose }: ArtifactDrawerProps) {
useEffect(() => {
if (!artifact) return;
console.log(
"[ArtifactDrawer] Showing artifact:",
artifact.id,
artifact.type,
artifact.title
);
}, [artifact]);
if (!artifact) {
return null;
}
packages/app/src/components/explorer-sidebar.tsx
+1 -7
View File
@@ -23,13 +23,7 @@ import { FileExplorerPane } from "./file-explorer-pane";
import { useKeyboardShiftStyle } from "@/hooks/use-keyboard-shift-style";
const MIN_CHAT_WIDTH = 400;
const IS_DEV = Boolean((globalThis as { __DEV__?: boolean }).__DEV__);
function logExplorerSidebar(event: string, details: Record<string, unknown>): void {
if (!IS_DEV) {
return;
}
console.log(`[ExplorerSidebar] ${event}`, details);
function logExplorerSidebar(_event: string, _details: Record<string, unknown>): void {
}
interface ExplorerSidebarProps {
packages/app/src/components/left-sidebar.tsx
-78
View File
@@ -32,14 +32,6 @@ import {
import { useKeyboardShortcutsStore } from '@/stores/keyboard-shortcuts-store'
const DESKTOP_SIDEBAR_WIDTH = 320
const IS_DEV = Boolean((globalThis as { __DEV__?: boolean }).__DEV__)
function logLeftSidebarCloseGesture(event: string, details: Record<string, unknown>): void {
if (!IS_DEV) {
return
}
console.log(`[LeftSidebarCloseGesture] ${event}`, details)
}
interface LeftSidebarProps {
selectedAgentId?: string
@@ -144,70 +136,6 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
// Track user-initiated refresh to avoid showing spinner on background revalidation
const [isManualRefresh, setIsManualRefresh] = useState(false)
useEffect(() => {
console.log('[LeftSidebar] isOpen_changed', {
isOpen,
isMobile,
mobileView,
desktopAgentListOpen,
})
}, [desktopAgentListOpen, isMobile, isOpen, mobileView])
useEffect(() => {
console.log('[LeftSidebar] pathname_changed', {
pathname,
activeServerIdFromPath,
activeServerId,
})
}, [activeServerId, activeServerIdFromPath, pathname])
useEffect(() => {
console.log('[LeftSidebar] hosts_changed', {
hostCount: daemons.length,
serverIds: daemons.map((daemon) => daemon.serverId),
runtimeConnectionStatusSignature,
})
}, [daemons, runtimeConnectionStatusSignature])
useEffect(() => {
console.log('[LeftSidebar] active_host_changed', {
activeServerId,
activeHostLabel,
activeHostStatus,
})
}, [activeHostLabel, activeHostStatus, activeServerId])
useEffect(() => {
console.log('[LeftSidebar] projects_changed', {
activeServerId,
projectCount: projects.length,
projectKeys: projects.map((project) => project.projectKey),
workspaceCounts: projects.map((project) => ({
projectKey: project.projectKey,
workspaceCount: project.workspaces.length,
})),
isInitialLoad,
isRevalidating,
})
}, [activeServerId, isInitialLoad, isRevalidating, projects])
useEffect(() => {
console.log('[LeftSidebar] collapsed_or_shortcuts_changed', {
collapsedProjectKeys: Array.from(collapsedProjectKeys),
shortcutCount: shortcutIndexByWorkspaceKey.size,
})
}, [collapsedProjectKeys, shortcutIndexByWorkspaceKey])
useEffect(() => {
console.log('[LeftSidebar] animation_context_changed', {
windowWidth,
translateXValue: translateX.value,
backdropOpacityValue: backdropOpacity.value,
isGesturing: isGesturing.value,
hasCloseGestureRef: Boolean(closeGestureRef.current),
})
}, [backdropOpacity, closeGestureRef, isGesturing, translateX, windowWidth])
const handleRefresh = useCallback(() => {
setIsManualRefresh(true)
refreshAll()
@@ -320,7 +248,6 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
})
.onStart(() => {
isGesturing.value = true
runOnJS(logLeftSidebarCloseGesture)('start', { isOpen, isMobile })
})
.onUpdate((event) => {
if (!isMobile) return
@@ -338,11 +265,6 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
isGesturing.value = false
if (!isMobile) return
const shouldClose = event.translationX < -windowWidth / 3 || event.velocityX < -500
runOnJS(logLeftSidebarCloseGesture)('end', {
translationX: event.translationX,
velocityX: event.velocityX,
shouldClose,
})
if (shouldClose) {
animateToClose()
runOnJS(handleClose)()
packages/app/src/components/message-input.tsx
-77
View File
@@ -216,18 +216,6 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
markScrollInvestigationRender(investigationComponentId)
const toast = useToast()
const voice = useVoiceOptional()
console.log("[MessageInput] render", {
voiceServerId: voiceServerId ?? null,
voiceAgentId: voiceAgentId ?? null,
hasVoice: Boolean(voice),
isVoiceMode: voice?.isVoiceMode ?? false,
isVoiceSwitching: voice?.isVoiceSwitching ?? false,
isMuted: voice?.isMuted ?? false,
disabled,
isSubmitLoading,
valueLength: value.length,
imageCount: images.length,
})
const [inputHeight, setInputHeight] = useState(MIN_INPUT_HEIGHT)
const rootRef = useRef<View | null>(null)
const inputWrapperRef = useRef<View | null>(null)
@@ -301,19 +289,6 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
)
)
useEffect(() => {
console.log("[MessageInput] mount", {
voiceServerId: voiceServerId ?? null,
voiceAgentId: voiceAgentId ?? null,
})
return () => {
console.log("[MessageInput] unmount", {
voiceServerId: voiceServerId ?? null,
voiceAgentId: voiceAgentId ?? null,
})
}
}, [voiceAgentId, voiceServerId])
useEffect(() => {
valueRef.current = value
}, [value])
@@ -428,25 +403,6 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
const showRealtimeOverlay = isRealtimeVoiceForCurrentAgent
const showOverlay = showDictationOverlay || showRealtimeOverlay
useEffect(() => {
console.log("[MessageInput] overlay_state", {
showDictationOverlay,
showRealtimeOverlay,
showOverlay,
isDictating,
isDictationProcessing,
dictationStatus,
isRealtimeVoiceForCurrentAgent,
})
}, [
dictationStatus,
isDictating,
isDictationProcessing,
isRealtimeVoiceForCurrentAgent,
showDictationOverlay,
showOverlay,
showRealtimeOverlay,
])
useEffect(() => {
if (isDictating || isDictationProcessing) {
@@ -484,11 +440,6 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
}))
const handleVoicePress = useCallback(async () => {
console.log("[MessageInput] handleVoicePress", {
isRealtimeVoiceForCurrentAgent,
isDictating,
hasVoice: Boolean(voice),
})
if (isRealtimeVoiceForCurrentAgent && voice) {
voice.toggleMute()
return
@@ -508,39 +459,28 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
])
const handleCancelRecording = useCallback(async () => {
console.log("[MessageInput] handleCancelRecording")
await cancelDictation()
}, [cancelDictation])
const handleAcceptRecording = useCallback(async () => {
console.log("[MessageInput] handleAcceptRecording")
sendAfterTranscriptRef.current = false
await confirmDictation()
}, [confirmDictation])
const handleAcceptAndSendRecording = useCallback(async () => {
console.log("[MessageInput] handleAcceptAndSendRecording")
sendAfterTranscriptRef.current = true
await confirmDictation()
}, [confirmDictation])
const handleRetryFailedRecording = useCallback(() => {
console.log("[MessageInput] handleRetryFailedRecording")
void retryFailedDictation()
}, [retryFailedDictation])
const handleDiscardFailedRecording = useCallback(() => {
console.log("[MessageInput] handleDiscardFailedRecording")
discardFailedDictation()
}, [discardFailedDictation])
const handleStopRealtimeVoice = useCallback(async () => {
console.log("[MessageInput] handleStopRealtimeVoice", {
hasVoice: Boolean(voice),
isRealtimeVoiceForCurrentAgent,
isAgentRunning,
voiceAgentId: voiceAgentId ?? null,
})
if (!voice || !isRealtimeVoiceForCurrentAgent) {
return
}
@@ -560,18 +500,6 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
}, [client, isAgentRunning, isRealtimeVoiceForCurrentAgent, voice, voiceAgentId])
const handleToggleRealtimeVoiceShortcut = useCallback(() => {
console.log("[MessageInput] handleToggleRealtimeVoiceShortcut", {
hasVoice: Boolean(voice),
voiceServerId: voiceServerId ?? null,
voiceAgentId: voiceAgentId ?? null,
isConnected,
disabled,
isVoiceSwitching: voice?.isVoiceSwitching ?? false,
isVoiceModeForAgent:
voice && voiceServerId && voiceAgentId
? voice.isVoiceModeForAgent(voiceServerId, voiceAgentId)
: false,
})
if (!voice || !voiceServerId || !voiceAgentId || !isConnected || disabled) {
return
}
@@ -593,11 +521,6 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
}, [disabled, handleStopRealtimeVoice, isConnected, toast, voice, voiceAgentId, voiceServerId])
const handleSendMessage = useCallback(() => {
console.log("[MessageInput] handleSendMessage", {
valueLength: value.length,
imageCount: images.length,
isAgentRunning,
})
const trimmed = value.trim()
if (!trimmed && images.length === 0) return
const payload = {
packages/app/src/components/realtime-voice-overlay.tsx
-16
View File
@@ -1,5 +1,4 @@
import { ActivityIndicator, Pressable, View } from "react-native";
import { useEffect } from "react";
import { StyleSheet, useUnistyles } from "react-native-unistyles";
import { Mic, MicOff, Square } from "lucide-react-native";
import { FOOTER_HEIGHT } from "@/constants/layout";
@@ -24,21 +23,6 @@ export function RealtimeVoiceOverlay({
}: RealtimeVoiceOverlayProps) {
const { theme } = useUnistyles();
const { volume, isDetecting, isSpeaking } = useVoiceTelemetry();
console.log("[RealtimeVoiceOverlay] render", {
isMuted,
isSwitching,
volume,
isDetecting,
isSpeaking,
});
useEffect(() => {
console.log("[RealtimeVoiceOverlay] mount");
return () => {
console.log("[RealtimeVoiceOverlay] unmount");
};
}, []);
return (
<View style={styles.container}>
<View style={styles.meterContainer}>
packages/app/src/components/sidebar-workspace-list.tsx
+10 -48
View File
@@ -257,7 +257,6 @@ function NewWorktreeButton({
function useLongPressDragInteraction(input: {
drag: () => void
menuController: ReturnType<typeof useContextMenu> | null
debugId: string
}) {
const didLongPressRef = useRef(false)
const dragArmedRef = useRef(false)
@@ -295,15 +294,11 @@ function useLongPressDragInteraction(input: {
input.menuController.setOpen(true)
menuOpenedRef.current = true
didLongPressRef.current = true
console.log('[sidebar-dnd-debug] context menu opened', { id: input.debugId })
}, [input.debugId, input.menuController])
}, [input.menuController])
const handleLongPress = useCallback(() => {
// Manual timers own long-press behavior on mobile.
console.log('[sidebar-dnd-debug] native onLongPress ignored (manual state machine active)', {
id: input.debugId,
})
}, [input.debugId])
}, [])
useEffect(() => {
return () => {
@@ -332,16 +327,11 @@ function useLongPressDragInteraction(input: {
const dy = current.y - start.y
const distance = Math.sqrt(dx * dx + dy * dy)
if (distance > DRAG_ARM_STATIONARY_SLOP_PX) {
console.log('[sidebar-dnd-debug] drag arm cancelled (movement)', {
id: input.debugId,
distance,
})
return
}
dragArmedRef.current = true
dragActivatedRef.current = true
didLongPressRef.current = true
console.log('[sidebar-dnd-debug] drag armed', { id: input.debugId })
void Haptics.selectionAsync().catch(() => {})
input.drag()
}, DRAG_ARM_DELAY_MS)
@@ -363,17 +353,12 @@ function useLongPressDragInteraction(input: {
const dy = current.y - start.y
const distance = Math.sqrt(dx * dx + dy * dy)
if (distance > CONTEXT_MENU_STATIONARY_SLOP_PX) {
console.log('[sidebar-dnd-debug] context menu cancelled (movement)', {
id: input.debugId,
distance,
})
return
}
console.log('[sidebar-dnd-debug] long-press armed', { id: input.debugId })
void Haptics.selectionAsync().catch(() => {})
openContextMenuAtStartPoint()
}, CONTEXT_MENU_DELAY_MS)
}, [clearTimers, input.debugId, input.menuController, openContextMenuAtStartPoint])
}, [clearTimers, input.menuController, openContextMenuAtStartPoint])
const handleDragIntent = useCallback(
(details: { dx: number; dy: number; distance: number }) => {
@@ -383,10 +368,9 @@ function useLongPressDragInteraction(input: {
didStartDragRef.current = true
didLongPressRef.current = true
clearTimers()
console.log('[sidebar-dnd-debug] drag movement detected', { id: input.debugId, ...details })
void Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Medium).catch(() => {})
},
[clearTimers, input.debugId]
[clearTimers]
)
const handleScrollIntent = useCallback(
@@ -394,18 +378,16 @@ function useLongPressDragInteraction(input: {
scrollIntentRef.current = true
didLongPressRef.current = true
clearTimers()
console.log('[sidebar-dnd-debug] scroll intent detected', { id: input.debugId, ...details })
},
[clearTimers, input.debugId]
[clearTimers]
)
const handleSwipeIntent = useCallback(
(details: { dx: number; dy: number; distance: number }) => {
didLongPressRef.current = true
clearTimers()
console.log('[sidebar-dnd-debug] swipe intent detected', { id: input.debugId, ...details })
},
[clearTimers, input.debugId]
[clearTimers]
)
const handlePressIn = useCallback((event: GestureResponderEvent) => {
@@ -423,13 +405,8 @@ function useLongPressDragInteraction(input: {
x: event.nativeEvent.pageX,
y: event.nativeEvent.pageY,
}
console.log('[sidebar-dnd-debug] press-in', {
id: input.debugId,
x: event.nativeEvent.pageX,
y: event.nativeEvent.pageY,
})
armTimers()
}, [armTimers, input.debugId])
}, [armTimers])
const handleTouchMove = useCallback(
(event: any) => {
@@ -476,20 +453,11 @@ function useLongPressDragInteraction(input: {
const handlePressOut = useCallback(() => {
clearTimers()
console.log('[sidebar-dnd-debug] press-out no context-menu', {
id: input.debugId,
didLongPress: didLongPressRef.current,
didStartDrag: didStartDragRef.current,
dragActivated: dragActivatedRef.current,
scrollIntent: scrollIntentRef.current,
dragArmed: dragArmedRef.current,
menuOpened: menuOpenedRef.current,
})
dragArmedRef.current = false
dragActivatedRef.current = false
touchStartRef.current = null
touchCurrentRef.current = null
}, [clearTimers, input.debugId])
}, [clearTimers])
return {
didLongPressRef,
@@ -518,7 +486,6 @@ function ProjectHeaderRow({
const interaction = useLongPressDragInteraction({
drag,
menuController,
debugId: `project:${project.projectKey}`,
})
const handlePress = useCallback(() => {
@@ -626,7 +593,6 @@ function WorkspaceRowInner({
const interaction = useLongPressDragInteraction({
drag,
menuController,
debugId: `workspace:${workspace.workspaceKey}`,
})
const handlePress = useCallback(() => {
@@ -1474,9 +1440,7 @@ export function SidebarWorkspaceList({
style={styles.list}
contentContainerStyle={styles.listContent}
showsVerticalScrollIndicator={false}
onScrollBeginDrag={() =>
console.log('[sidebar-dnd-debug] outer scroll begin')
}
testID="sidebar-project-workspace-list-scroll"
>
{content}
@@ -1486,9 +1450,7 @@ export function SidebarWorkspaceList({
style={styles.list}
contentContainerStyle={styles.listContent}
showsVerticalScrollIndicator={false}
onScrollBeginDrag={() =>
console.log('[sidebar-dnd-debug] outer scroll begin')
}
testID="sidebar-project-workspace-list-scroll"
>
{content}
packages/app/src/components/ui/dropdown-menu-floating.ts
-21
View File
@@ -170,10 +170,6 @@ export function useDropdownFloating({
}, []);
const update = useCallback(async () => {
console.log("[useDropdownFloating] update called", {
hasReferenceEl: !!referenceEl,
hasFloatingEl: !!floatingElRef.current,
});
if (!referenceEl || !floatingElRef.current) {
return;
@@ -185,12 +181,6 @@ export function useDropdownFloating({
measureElement(floatingElRef.current),
]);
console.log("[useDropdownFloating] measured", {
fromRect,
contentRect,
displayArea,
});
const result = computeGeometry({
fromRect,
contentSize: { width: contentRect.width, height: contentRect.height },
@@ -201,8 +191,6 @@ export function useDropdownFloating({
padding,
});
console.log("[useDropdownFloating] geometry result", result);
setGeometry(result);
} catch (e) {
console.warn("[useDropdownFloating] measure failed:", e);
@@ -210,7 +198,6 @@ export function useDropdownFloating({
}, [referenceEl, displayArea, placement, alignment, offset, padding]);
const floatingRef = useCallback((el: View | null) => {
console.log("[useDropdownFloating] floatingRef called", { hasEl: !!el });
floatingElRef.current = el;
}, []);
@@ -218,17 +205,10 @@ export function useDropdownFloating({
const [floatingReady, setFloatingReady] = useState(false);
const handleFloatingLayout = useCallback(() => {
console.log("[useDropdownFloating] handleFloatingLayout called");
setFloatingReady(true);
}, []);
useEffect(() => {
console.log("[useDropdownFloating] useEffect", {
open,
floatingReady,
hasReferenceEl: !!referenceEl,
hasFloatingEl: !!floatingElRef.current,
});
if (!open) {
setGeometry(null);
@@ -237,7 +217,6 @@ export function useDropdownFloating({
}
if (floatingReady && referenceEl && floatingElRef.current) {
console.log("[useDropdownFloating] calling update from useEffect");
update();
}
}, [open, floatingReady, referenceEl, update]);
packages/app/src/components/voice-compact-indicator.tsx
-17
View File
@@ -1,5 +1,4 @@
import { ActivityIndicator, Alert, Pressable, View } from "react-native";
import { useEffect } from "react";
import { StyleSheet, useUnistyles } from "react-native-unistyles";
import { Mic, MicOff, Square } from "lucide-react-native";
import { VolumeMeter } from "@/components/volume-meter";
@@ -15,22 +14,6 @@ export function VoiceCompactIndicator() {
toggleMute,
stopVoice,
} = useVoice();
console.log("[VoiceCompactIndicator] render", {
isVoiceMode,
isVoiceSwitching,
isMuted,
volume,
isDetecting,
isSpeaking,
});
useEffect(() => {
console.log("[VoiceCompactIndicator] mount");
return () => {
console.log("[VoiceCompactIndicator] unmount");
};
}, []);
if (!isVoiceMode) {
return null;
}
packages/app/src/components/voice-panel.tsx
-16
View File
@@ -1,5 +1,4 @@
import { View, Pressable } from "react-native";
import { useEffect } from "react";
import { StyleSheet, useUnistyles } from "react-native-unistyles";
import { MicOff, Square } from "lucide-react-native";
import { VolumeMeter } from "./volume-meter";
@@ -16,21 +15,6 @@ export function VoicePanel() {
toggleMute,
activeServerId,
} = useVoice();
console.log("[VoicePanel] render", {
activeServerId,
isMuted,
volume,
isDetecting,
isSpeaking,
});
useEffect(() => {
console.log("[VoicePanel] mount");
return () => {
console.log("[VoicePanel] unmount");
};
}, []);
const hostLabel = activeServerId
? daemons.find((daemon) => daemon.serverId === activeServerId)?.label ?? null
: null;