Files
Claude-Code-Workflow/ccw/frontend/src/hooks/useLocale.ts
catlog22 d43696d756 feat: Implement phases 6 to 9 of the review cycle fix process, including discovery, batching, parallel planning, execution, and completion
- Added Phase 6: Fix Discovery & Batching with intelligent grouping and batching of findings.
- Added Phase 7: Fix Parallel Planning to launch planning agents for concurrent analysis and aggregation of partial plans.
- Added Phase 8: Fix Execution for stage-based execution of fixes with conservative test verification.
- Added Phase 9: Fix Completion to aggregate results, generate summary reports, and handle session completion.
- Introduced new frontend components: ResizeHandle for draggable resizing of sidebar panels and useResizablePanel hook for managing panel sizes with localStorage persistence.
- Added PowerShell script for checking TypeScript errors in source code, excluding test files.
2026-02-07 19:28:33 +08:00

81 lines
2.3 KiB
TypeScript

// ========================================
// useLocale Hook
// ========================================
// Convenient hook for locale management
import { useCallback, useMemo } from 'react';
import { useAppStore, selectLocale } from '../stores/appStore';
import type { Locale } from '../types/store';
import { availableLocales, formatMessage } from '../lib/i18n';
export interface UseLocaleReturn {
/** Current locale ('en' or 'zh') */
locale: Locale;
/** Set locale preference */
setLocale: (locale: Locale) => void;
/** Available locales with display names */
availableLocales: Record<Locale, string>;
}
/**
* Hook for managing locale state
* @returns Locale state and actions
*
* @example
* ```tsx
* const { locale, setLocale, availableLocales } = useLocale();
*
* return (
* <select value={locale} onChange={(e) => setLocale(e.target.value as Locale)}>
* {Object.entries(availableLocales).map(([key, label]) => (
* <option key={key} value={key}>{label}</option>
* ))}
* </select>
* );
* ```
*/
export function useLocale(): UseLocaleReturn {
const locale = useAppStore(selectLocale);
const setLocaleAction = useAppStore((state) => state.setLocale);
const setLocale = useCallback(
(newLocale: Locale) => {
setLocaleAction(newLocale);
},
[setLocaleAction]
);
return {
locale,
setLocale,
availableLocales,
};
}
/**
* Hook to format i18n messages with the current locale
* @returns A formatMessage function for translating message IDs
*
* Supports both string and react-intl descriptor formats:
* - formatMessage('home.title')
* - formatMessage({ id: 'home.title' })
*
* @example
* ```tsx
* const formatMessage = useFormatMessage();
* return <h1>{formatMessage('home.title')}</h1>;
* ```
*/
export function useFormatMessage(): (
idOrDescriptor: string | { id: string; defaultMessage?: string },
values?: Record<string, string | number | boolean | Date | null | undefined>
) => string {
// Use useMemo to avoid recreating the function on each render
return useMemo(() => {
return (idOrDescriptor: string | { id: string; defaultMessage?: string }, values?: Record<string, string | number | boolean | Date | null | undefined>) => {
const id = typeof idOrDescriptor === 'string' ? idOrDescriptor : idOrDescriptor.id;
return formatMessage(id, values);
};
}, []);
}