feat: standardize logging across UI components

- Replaced console.log and console.error statements with logger methods from @automaker/utils in various UI components, ensuring consistent log formatting and improved readability.
- Enhanced error handling by utilizing logger methods to provide clearer context for issues encountered during operations.
- Updated multiple views and hooks to integrate the new logging system, improving maintainability and debugging capabilities.

This update significantly enhances the observability of UI components, facilitating easier troubleshooting and monitoring.
This commit is contained in:
Shirone
2026-01-02 17:25:13 +01:00
parent 96a999817f
commit 69f3ba9724
86 changed files with 1079 additions and 677 deletions

View File

@@ -1,5 +1,8 @@
import { useState, useCallback } from 'react';
import { toast } from 'sonner';
import { createLogger } from '@automaker/utils/logger';
const logger = createLogger('CliInstallation');
interface UseCliInstallationOptions {
cliType: 'claude';
@@ -82,7 +85,7 @@ export function useCliInstallation({
toast.error('Installation failed', { description: result.error });
}
} catch (error) {
console.error(`Failed to install ${cliType}:`, error);
logger.error(`Failed to install ${cliType}:`, error);
toast.error('Installation failed');
} finally {
setIsInstalling(false);

View File

@@ -1,4 +1,5 @@
import { useState, useCallback } from 'react';
import { createLogger } from '@automaker/utils/logger';
interface UseCliStatusOptions {
cliType: 'claude';
@@ -14,13 +15,14 @@ export function useCliStatus({
setAuthStatus,
}: UseCliStatusOptions) {
const [isChecking, setIsChecking] = useState(false);
const logger = createLogger('CliStatus');
const checkStatus = useCallback(async () => {
console.log(`[${cliType} Setup] Starting status check...`);
logger.info(`Starting status check for ${cliType}...`);
setIsChecking(true);
try {
const result = await statusApi();
console.log(`[${cliType} Setup] Raw status result:`, result);
logger.info(`Raw status result for ${cliType}:`, result);
if (result.success) {
const cliStatus = {
@@ -29,7 +31,7 @@ export function useCliStatus({
version: result.version || null,
method: result.method || 'none',
};
console.log(`[${cliType} Setup] CLI Status:`, cliStatus);
logger.info(`CLI Status for ${cliType}:`, cliStatus);
setCliStatus(cliStatus);
if (result.auth) {
@@ -60,11 +62,11 @@ export function useCliStatus({
}
}
} catch (error) {
console.error(`[${cliType} Setup] Failed to check status:`, error);
logger.error(`Failed to check status for ${cliType}:`, error);
} finally {
setIsChecking(false);
}
}, [cliType, statusApi, setCliStatus, setAuthStatus]);
}, [cliType, statusApi, setCliStatus, setAuthStatus, logger]);
return { isChecking, checkStatus };
}

View File

@@ -1,6 +1,9 @@
import { useState, useCallback } from 'react';
import { toast } from 'sonner';
import { getElectronAPI } from '@/lib/electron';
import { createLogger } from '@automaker/utils/logger';
const logger = createLogger('TokenSave');
interface UseTokenSaveOptions {
provider: string; // e.g., "anthropic_oauth_token", "anthropic", "openai"
@@ -24,7 +27,7 @@ export function useTokenSave({ provider, onSuccess }: UseTokenSaveOptions) {
if (setupApi?.storeApiKey) {
const result = await setupApi.storeApiKey(provider, tokenValue);
console.log(`[Token Save] Store result for ${provider}:`, result);
logger.info(`Store result for ${provider}:`, result);
if (result.success) {
const tokenType = provider.includes('oauth') ? 'subscription token' : 'API key';
@@ -42,7 +45,7 @@ export function useTokenSave({ provider, onSuccess }: UseTokenSaveOptions) {
return true;
}
} catch (error) {
console.error(`[Token Save] Failed to save ${provider}:`, error);
logger.error(`Failed to save ${provider}:`, error);
toast.error('Failed to save token');
return false;
} finally {

View File

@@ -1,4 +1,5 @@
import { useState, useEffect, useCallback, useRef } from 'react';
import { createLogger } from '@automaker/utils/logger';
import { Button } from '@/components/ui/button';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { Badge } from '@/components/ui/badge';
@@ -19,6 +20,8 @@ import {
import { toast } from 'sonner';
import { StatusBadge } from '../components';
const logger = createLogger('CursorSetupStep');
interface CursorSetupStepProps {
onNext: () => void;
onBack: () => void;
@@ -67,7 +70,7 @@ export function CursorSetupStep({ onNext, onBack, onSkip }: CursorSetupStepProps
}
}
} catch (error) {
console.error('Failed to check Cursor status:', error);
logger.error('Failed to check Cursor status:', error);
} finally {
setIsChecking(false);
}
@@ -140,7 +143,7 @@ export function CursorSetupStep({ onNext, onBack, onSkip }: CursorSetupStepProps
}
}, 2000);
} catch (error) {
console.error('Login failed:', error);
logger.error('Login failed:', error);
toast.error('Failed to start login process');
setIsLoggingIn(false);
}

View File

@@ -1,4 +1,5 @@
import { useState, useEffect, useCallback } from 'react';
import { createLogger } from '@automaker/utils/logger';
import { Button } from '@/components/ui/button';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { useSetupStore } from '@/store/setup-store';
@@ -18,6 +19,8 @@ import {
import { toast } from 'sonner';
import { StatusBadge } from '../components';
const logger = createLogger('GitHubSetupStep');
interface GitHubSetupStepProps {
onNext: () => void;
onBack: () => void;
@@ -46,7 +49,7 @@ export function GitHubSetupStep({ onNext, onBack, onSkip }: GitHubSetupStepProps
});
}
} catch (error) {
console.error('Failed to check gh status:', error);
logger.error('Failed to check gh status:', error);
} finally {
setIsChecking(false);
}