From a1d2e13bc9912b83be4bbed359c9581d760e0fbf Mon Sep 17 00:00:00 2001 From: Claude Date: Fri, 7 Nov 2025 21:23:06 +0000 Subject: [PATCH] revert: Remove debugging infrastructure while keeping bug fixes Removed: - ErrorBoundary component and all error boundary wrapping - Debug console.log statements from useReasoningTranslation - Debug useEffect in DashboardPage - Dev mode Dockerfile (Dockerfile.kubernetes.dev) - Dev mode Tilt configuration - Enhanced vite watcher config (depth, awaitWriteFinish, HMR overlay) Kept actual bug fixes: - String() coercion in translation functions - useMemo/useCallback for formatters - Null guards in components - Basic vite ignored patterns (node_modules, dist, .git) - Conditional rendering in DashboardPage --- Tiltfile | 14 +--- frontend/Dockerfile.kubernetes.dev | 25 ------- frontend/src/components/ErrorBoundary.tsx | 68 ------------------- frontend/src/hooks/useReasoningTranslation.ts | 45 ++---------- frontend/src/pages/app/DashboardPage.tsx | 42 +++--------- frontend/vite.config.ts | 6 +- 6 files changed, 17 insertions(+), 183 deletions(-) delete mode 100644 frontend/Dockerfile.kubernetes.dev delete mode 100644 frontend/src/components/ErrorBoundary.tsx diff --git a/Tiltfile b/Tiltfile index 99d4741c..03a5a9e1 100644 --- a/Tiltfile +++ b/Tiltfile @@ -48,25 +48,13 @@ def python_live_update(service_name, service_path): # ============================================================================= # FRONTEND (React + Vite) # ============================================================================= -# DEV MODE: Uses Vite dev server with hot reload and unminified React -# PROD MODE: Change dockerfile to './frontend/Dockerfile.kubernetes' for production builds docker_build( 'bakery/dashboard', context='./frontend', - dockerfile='./frontend/Dockerfile.kubernetes.dev', # DEV: Vite dev server + dockerfile='./frontend/Dockerfile.kubernetes', live_update=[ - # Fall back to full rebuild if package.json changes - fall_back_on(['./frontend/package.json', './frontend/package-lock.json']), - - # Sync source code changes - Vite will hot reload sync('./frontend/src', '/app/src'), sync('./frontend/public', '/app/public'), - sync('./frontend/index.html', '/app/index.html'), - sync('./frontend/vite.config.ts', '/app/vite.config.ts'), - sync('./frontend/tsconfig.json', '/app/tsconfig.json'), - - # Reinstall dependencies if package.json changes - run('npm ci', trigger=['./frontend/package.json', './frontend/package-lock.json']), ] ) diff --git a/frontend/Dockerfile.kubernetes.dev b/frontend/Dockerfile.kubernetes.dev deleted file mode 100644 index e8d5e42d..00000000 --- a/frontend/Dockerfile.kubernetes.dev +++ /dev/null @@ -1,25 +0,0 @@ -# Development Dockerfile for Frontend - Vite Dev Server -# This runs the Vite dev server with hot reload and unminified React - -FROM node:18-alpine - -WORKDIR /app - -# Install dependencies -COPY package*.json ./ -RUN npm ci --verbose && \ - npm cache clean --force - -# Copy source code -COPY . . - -# Expose Vite dev server port -EXPOSE 3000 - -# Set NODE_ENV to development for unminified React -ENV NODE_ENV=development - -# Start Vite dev server with host binding for Kubernetes -# --host 0.0.0.0 allows external access from Kubernetes -# --port 3000 keeps the same port as production -CMD ["npm", "run", "dev", "--", "--host", "0.0.0.0", "--port", "3000"] diff --git a/frontend/src/components/ErrorBoundary.tsx b/frontend/src/components/ErrorBoundary.tsx deleted file mode 100644 index cfd39cb3..00000000 --- a/frontend/src/components/ErrorBoundary.tsx +++ /dev/null @@ -1,68 +0,0 @@ -import React, { Component, ErrorInfo, ReactNode } from 'react'; - -interface Props { - children: ReactNode; - componentName?: string; -} - -interface State { - hasError: boolean; - error?: Error; - errorInfo?: ErrorInfo; -} - -/** - * Error Boundary to catch React errors and show debug information - */ -export class ErrorBoundary extends Component { - constructor(props: Props) { - super(props); - this.state = { hasError: false }; - } - - static getDerivedStateFromError(error: Error): State { - return { hasError: true, error }; - } - - componentDidCatch(error: Error, errorInfo: ErrorInfo) { - console.error('🔴 ErrorBoundary caught error:', { - component: this.props.componentName || 'Unknown', - error: error.message, - stack: error.stack, - componentStack: errorInfo.componentStack, - }); - - this.setState({ error, errorInfo }); - } - - render() { - if (this.state.hasError) { - return ( -
-

- 🔴 Error in {this.props.componentName || 'Component'} -

-
-

- Error: {this.state.error?.message} -

- {this.state.error?.stack && ( -
- Stack Trace -
{this.state.error.stack}
-
- )} -
- -
- ); - } - - return this.props.children; - } -} diff --git a/frontend/src/hooks/useReasoningTranslation.ts b/frontend/src/hooks/useReasoningTranslation.ts index 5673e25c..36c009d4 100644 --- a/frontend/src/hooks/useReasoningTranslation.ts +++ b/frontend/src/hooks/useReasoningTranslation.ts @@ -151,70 +151,33 @@ export function useReasoningFormatter() { const translation = useReasoningTranslation(); const formatPOAction = useCallback((reasoningData?: ReasoningData) => { - console.log('🔍 formatPOAction called with:', reasoningData); - if (!reasoningData) { - const fallback = { + return { reasoning: String(translation.translatePOReasonng({} as ReasoningData) || 'Purchase order required'), consequence: String(''), severity: String('') }; - console.log('🔍 formatPOAction: No reasoning data, returning fallback:', fallback); - return fallback; } const reasoning = String(translation.translatePOReasonng(reasoningData) || 'Purchase order required'); const consequence = String(translation.translateConsequence(reasoningData.consequence) || ''); const severity = String(translation.translateSeverity(reasoningData.consequence?.severity) || ''); - const result = { reasoning, consequence, severity }; - - // Debug: Check for undefined values - if (reasoning === undefined || consequence === undefined || severity === undefined) { - console.error('🔴 formatPOAction returned undefined value!', { - reasoningData, - result, - reasoning, - consequence, - severity - }); - } else { - console.log('✅ formatPOAction result:', { type: reasoningData.type, result }); - } - - return result; + return { reasoning, consequence, severity }; }, [translation]); const formatBatchAction = useCallback((reasoningData?: ReasoningData) => { - console.log('🔍 formatBatchAction called with:', reasoningData); - if (!reasoningData) { - const fallback = { + return { reasoning: String(translation.translateBatchReasoning({} as ReasoningData) || 'Production batch scheduled'), urgency: String('normal') }; - console.log('🔍 formatBatchAction: No reasoning data, returning fallback:', fallback); - return fallback; } const reasoning = String(translation.translateBatchReasoning(reasoningData) || 'Production batch scheduled'); const urgency = String(reasoningData.urgency?.level || 'normal'); - const result = { reasoning, urgency }; - - // Debug: Check for undefined values - if (reasoning === undefined || urgency === undefined) { - console.error('🔴 formatBatchAction returned undefined value!', { - reasoningData, - result, - reasoning, - urgency - }); - } else { - console.log('✅ formatBatchAction result:', { type: reasoningData.type, result }); - } - - return result; + return { reasoning, urgency }; }, [translation]); return { diff --git a/frontend/src/pages/app/DashboardPage.tsx b/frontend/src/pages/app/DashboardPage.tsx index 575457d3..8b75c280 100644 --- a/frontend/src/pages/app/DashboardPage.tsx +++ b/frontend/src/pages/app/DashboardPage.tsx @@ -15,7 +15,7 @@ * - Trust-building (explain system reasoning) */ -import React, { useState, useEffect } from 'react'; +import React from 'react'; import { useNavigate } from 'react-router-dom'; import { RefreshCw, ExternalLink } from 'lucide-react'; import { useTenant } from '../../stores/tenant.store'; @@ -34,7 +34,6 @@ import { ActionQueueCard } from '../../components/dashboard/ActionQueueCard'; import { OrchestrationSummaryCard } from '../../components/dashboard/OrchestrationSummaryCard'; import { ProductionTimelineCard } from '../../components/dashboard/ProductionTimelineCard'; import { InsightsGrid } from '../../components/dashboard/InsightsGrid'; -import { ErrorBoundary } from '../../components/ErrorBoundary'; export function NewDashboardPage() { const navigate = useNavigate(); @@ -72,25 +71,6 @@ export function NewDashboardPage() { refetch: refetchInsights, } = useInsights(tenantId); - // Debug logging for data - useEffect(() => { - console.log('🔍 Dashboard Data:', { - healthStatus: healthStatus, - orchestrationSummary: orchestrationSummary, - actionQueue: actionQueue, - productionTimeline: productionTimeline, - insights: insights, - loading: { - health: healthLoading, - orchestration: orchestrationLoading, - actionQueue: actionQueueLoading, - timeline: timelineLoading, - insights: insightsLoading - } - }); - }, [healthStatus, orchestrationSummary, actionQueue, productionTimeline, insights, - healthLoading, orchestrationLoading, actionQueueLoading, timelineLoading, insightsLoading]); - // Mutations const approvePO = useApprovePurchaseOrder(); const startBatch = useStartProductionBatch(); @@ -167,12 +147,10 @@ export function NewDashboardPage() { {/* Main Dashboard Layout */}
{/* SECTION 1: Bakery Health Status */} - - - + {healthStatus && } {/* SECTION 2: What Needs Your Attention (Action Queue) */} - + {actionQueue && ( - + )} {/* SECTION 3: What the System Did for You (Orchestration Summary) */} - + {orchestrationSummary && ( - + )} {/* SECTION 4: Today's Production Timeline */} - + {productionTimeline && ( - + )} {/* SECTION 5: Quick Insights Grid */} - + {insights && (

Key Metrics

-
+ )} {/* SECTION 6: Quick Action Links */}
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts index 44eb0999..4e5e4c27 100644 --- a/frontend/vite.config.ts +++ b/frontend/vite.config.ts @@ -24,14 +24,12 @@ export default defineConfig({ host: '0.0.0.0', // Important for Docker port: 3000, watch: { - usePolling: true, // Important for Docker file watching - // Ignore these directories to prevent "too many open files" error in Kubernetes + // Use polling for Docker/Kubernetes compatibility + usePolling: true, ignored: [ '**/node_modules/**', '**/dist/**', '**/.git/**', - '**/coverage/**', - '**/.cache/**', ], }, proxy: {