feat(i18n): Add next-intl framework with full bilingual support (EN/ZH) #434
Conversation
|
@unitagain is attempting to deploy a commit to the Rohan Verma's projects Team on Vercel. A member of the Team first needs to authorize it. |
WalkthroughAdds full i18n support: per-request locale resolution, LocaleContext and I18nProvider, LanguageSwitcher UI, English/Chinese message files, next-intl integration, many components wired to use translations, minor config and middleware tweaks. No business-logic changes. Changes
Sequence Diagram(s)sequenceDiagram
participant Browser
participant NextServer
participant ReqConfig as i18n/request.ts
participant Messages as messages/*.json
Browser->>NextServer: HTTP request
NextServer->>ReqConfig: resolve requestLocale
ReqConfig->>Messages: import messages for locale
ReqConfig-->>NextServer: return { locale, messages }
NextServer-->>Browser: render page with messages
rect rgba(0,128,96,0.06)
Note right of Browser: Client runtime i18n
Browser->>LocaleProvider: mount
LocaleProvider->>I18nProvider: provide locale & messages
I18nProvider->>App: render children with NextIntlClientProvider
Browser->>LanguageSwitcher: user selects locale
LanguageSwitcher->>LocaleProvider: setLocale(newLocale)
LocaleProvider->>I18nProvider: update messages
I18nProvider->>App: rerender with new locale
end
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes Areas to focus review on:
Possibly related PRs
Suggested reviewers
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
@MODSetter requesting for review |
![recurseml[bot]](https://avatars.githubusercontent.com/in/1054195?s=60&v=4){kind=small}
There was a problem hiding this comment.
Review by RecurseML
🔍 Review performed on 8aeaf41..7b8a094
✨ No bugs found, your code is sparkling clean
✅ Files analyzed, no issues (49)
• surfsense_backend/app/users.py
• surfsense_web/.gitignore
• surfsense_web/app/(home)/login/GoogleLoginButton.tsx
• surfsense_web/app/(home)/login/LocalLoginForm.tsx
• surfsense_web/app/(home)/login/page.tsx
• surfsense_web/app/(home)/register/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx
• surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx
• surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx
• surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx
• surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/onboard/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/podcasts/podcasts-client.tsx
• surfsense_web/app/dashboard/[search_space_id]/researcher/[[...chat_id]]/page.tsx
• surfsense_web/app/dashboard/[search_space_id]/settings/page.tsx
• surfsense_web/app/dashboard/layout.tsx
• surfsense_web/app/dashboard/page.tsx
• surfsense_web/app/layout.tsx
• surfsense_web/components/LanguageSwitcher.tsx
• surfsense_web/components/chat/AnimatedEmptyState.tsx
• surfsense_web/components/chat/ChatInputGroup.tsx
• surfsense_web/components/chat/ConnectorComponents.tsx
• surfsense_web/components/contact/contact-form.tsx
• surfsense_web/components/dashboard-breadcrumb.tsx
• surfsense_web/components/homepage/cta.tsx
• surfsense_web/components/homepage/features-bento-grid.tsx
• surfsense_web/components/homepage/features-card.tsx
• surfsense_web/components/homepage/hero-section.tsx
• surfsense_web/components/homepage/integrations.tsx
• surfsense_web/components/homepage/navbar.tsx
• surfsense_web/components/onboard/add-provider-step.tsx
• surfsense_web/components/onboard/assign-roles-step.tsx
• surfsense_web/components/pricing/pricing-section.tsx
• surfsense_web/components/providers/I18nProvider.tsx
• surfsense_web/components/settings/llm-role-manager.tsx
• surfsense_web/components/settings/model-config-manager.tsx
• surfsense_web/components/sidebar/AppSidebarProvider.tsx
• surfsense_web/components/sidebar/nav-main.tsx
• surfsense_web/components/sidebar/nav-projects.tsx
• surfsense_web/components/sidebar/nav-secondary.tsx
• surfsense_web/contexts/LocaleContext.tsx
• surfsense_web/i18n/request.ts
• surfsense_web/i18n/routing.ts
⏭️ Files skipped (4)
| Locations |
|---|
surfsense_web/messages/en.json |
surfsense_web/messages/zh.json |
surfsense_web/middleware.ts |
surfsense_web/next.config.ts |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 14
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (14)
surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx (1)
91-93: Translate the hard-coded error message.The error message
"Failed to process YouTube videos"is hard-coded in English, which is inconsistent with the comprehensive internationalization applied throughout this file. This string should be moved to a translation key.Apply this diff to fix the inconsistency:
if (!response.ok) { - throw new Error("Failed to process YouTube videos"); + throw new Error(t('error_api_failed')); }Make sure to add the corresponding key to your translation files:
messages/en.json:"add_youtube.error_api_failed": "Failed to process YouTube videos"messages/zh.json:"add_youtube.error_api_failed": "处理YouTube视频失败"(or appropriate translation)surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx (1)
82-84: Translate the hardcoded error message for i18n consistency.The error message "Failed to crawl URLs" is hardcoded in English, while all other user-facing strings in this component use the translation function. This creates an inconsistent user experience in non-English locales.
Apply this diff to use a translated error message:
if (!response.ok) { - throw new Error("Failed to crawl URLs"); + throw new Error(t('error_failed_crawl')); }Make sure to add the corresponding key to
messages/en.jsonandmessages/zh.json:"add_webpage": { "error_failed_crawl": "Failed to crawl URLs" }surfsense_web/components/settings/llm-role-manager.tsx (1)
406-410: Avoid index as React key in mapped lists.Per guidelines, use a stable, unique key. Index can cause reconciliation bugs on reordering.
- {role.characteristics.map((char, idx) => ( - <Badge key={idx} variant="outline" className="text-xs"> + {role.characteristics.map((char) => ( + <Badge key={char} variant="outline" className="text-xs"> {char} </Badge> ))}As per coding guidelines.
surfsense_web/components/chat/ConnectorComponents.tsx (2)
71-74: Guard against divide-by-zero in progress barWhen connectorSources is empty, progressPercentage becomes NaN and sets an invalid width.
- const totalConnectors = connectorSources.length; - const selectedCount = selectedConnectors.length; - const progressPercentage = (selectedCount / totalConnectors) * 100; + const totalConnectors = connectorSources.length; + const selectedCount = selectedConnectors.length; + const progressPercentage = totalConnectors > 0 ? (selectedCount / totalConnectors) * 100 : 0;Also applies to: 125-130
157-161: Localize Research mode labels and options"Q/A", "Report", and report sub-options are hard-coded. Move to translations for consistency.
+ import { useTranslations } from "next-intl"; ... export const ResearchModeControl = ({ value, onChange }: ResearchModeControlProps) => { + const t = useTranslations('researcher'); ... - const reportSubOptions = [ - { value: "GENERAL", label: "General", icon: getConnectorIcon("GENERAL") }, - { value: "DEEP", label: "Deep", icon: getConnectorIcon("DEEP") }, - { value: "DEEPER", label: "Deeper", icon: getConnectorIcon("DEEPER") }, - ]; + const reportSubOptions = [ + { value: "GENERAL", label: t('report_general'), icon: getConnectorIcon("GENERAL") }, + { value: "DEEP", label: t('report_deep'), icon: getConnectorIcon("DEEP") }, + { value: "DEEPER", label: t('report_deeper'), icon: getConnectorIcon("DEEPER") }, + ]; ... - <span>Q/A</span> + <span>{t('qna')}</span> ... - <span>Report</span> + <span>{t('report')}</span>Also applies to: 181-203, 219-223
surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (2)
320-351: Localize status/tooltips in the table"Enabled", "Disabled", "-", and tooltip strings remain hard-coded.
- : "Enabled"} + : t('enabled')} ... - <span className="text-sm text-muted-foreground">Disabled</span> + <span className="text-sm text-muted-foreground">{t('disabled')}</span> ... - <span className="text-sm text-muted-foreground">-</span> + <span className="text-sm text-muted-foreground">–</span> {/* or t('na') if you have one */} ... - <span className="sr-only">Configure Periodic Indexing</span> + <span className="sr-only">{t('configure_periodic_indexing')}</span> ... - <p>{t('index_date_range')}</p> + <p>{t('index_date_range')}</p> {/* keep translated */} ... - <p>{t('quick_index_auto')}</p> + <p>{t('quick_index_auto')}</p> {/* keep translated */}Also applies to: 371-377, 392-398
594-671: Localize the Periodic Indexing dialogTitles, descriptions, labels, select options, and preview text are hard-coded.
- <DialogTitle>Configure Periodic Indexing</DialogTitle> + <DialogTitle>{t('configure_periodic_indexing')}</DialogTitle> - <DialogDescription> - Set up automatic indexing at regular intervals for this connector. - </DialogDescription> + <DialogDescription>{t('configure_periodic_indexing_desc')}</DialogDescription> ... - <Label htmlFor="periodic-enabled" className="text-base"> - Enable Periodic Indexing - </Label> + <Label htmlFor="periodic-enabled" className="text-base">{t('enable_periodic_indexing')}</Label> - <p className="text-sm text-muted-foreground"> - Automatically index this connector at regular intervals - </p> + <p className="text-sm text-muted-foreground">{t('enable_periodic_indexing_desc')}</p> ... - <Label htmlFor="frequency">Indexing Frequency</Label> + <Label htmlFor="frequency">{t('indexing_frequency')}</Label> - <SelectValue placeholder="Select frequency" /> + <SelectValue placeholder={t('select_frequency')} /> - <SelectItem value="15">Every 15 minutes</SelectItem> + <SelectItem value="15">{t('every_15_minutes')}</SelectItem> - <SelectItem value="60">Every hour</SelectItem> + <SelectItem value="60">{t('every_hour')}</SelectItem> - <SelectItem value="360">Every 6 hours</SelectItem> + <SelectItem value="360">{t('every_6_hours')}</SelectItem> - <SelectItem value="720">Every 12 hours</SelectItem> + <SelectItem value="720">{t('every_12_hours')}</SelectItem> - <SelectItem value="1440">Daily (24 hours)</SelectItem> + <SelectItem value="1440">{t('daily_24h')}</SelectItem> - <SelectItem value="10080">Weekly (7 days)</SelectItem> + <SelectItem value="10080">{t('weekly_7d')}</SelectItem> - <SelectItem value="custom">Custom</SelectItem> + <SelectItem value="custom">{t('custom')}</SelectItem> ... - <Label htmlFor="custom-frequency">Custom Frequency (minutes)</Label> + <Label htmlFor="custom-frequency">{t('custom_frequency_minutes')}</Label> - placeholder="Enter minutes" + placeholder={t('enter_minutes')} ... - <p className="font-medium mb-1">Preview:</p> + <p className="font-medium mb-1">{t('preview')}</p> - "Will run every 15 minutes" ... etc + {/* Build preview with t('will_run_every_minutes', {count}) etc. */}Also localize the footer buttons:
- <Button variant="outline">Cancel</Button> + <Button variant="outline">{tCommon('cancel')}</Button> ... - Save Configuration + {t('save_configuration')}Also applies to: 676-689, 684-689
surfsense_web/app/(home)/login/LocalLoginForm.tsx (1)
28-36: Decouple retry from the submit event; localize toast/action labels.Avoid reusing the original submit event and translate remaining strings.
+ // Extract core login logic so it can be retried without a submit event + const attemptLogin = async () => { + const loadingToast = toast.loading(tCommon('loading')); + try { + const formData = new URLSearchParams(); + formData.append("username", username); + formData.append("password", password); + formData.append("grant_type", "password"); + const response = await fetch(`${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/auth/jwt/login`, { + method: "POST", + headers: { "Content-Type": "application/x-www-form-urlencoded" }, + body: formData.toString(), + }); + const data = await response.json(); + if (!response.ok) throw new Error(data.detail || `HTTP ${response.status}`); + toast.success(t('login_success'), { + id: loadingToast, + description: t('redirecting'), + duration: 2000, + }); + setTimeout(() => router.push(`/auth/callback?token=${data.access_token}`), 500); + } catch (err) { + const errorCode = err instanceof Error ? err.message : (isNetworkError(err) ? 'NETWORK_ERROR' : 'UNKNOWN_ERROR'); + const errorDetails = getAuthErrorDetails(errorCode); + setErrorTitle(errorDetails.title); + setError(errorDetails.description); + const toastOptions: any = { id: loadingToast, description: errorDetails.description, duration: 6000 }; + if (shouldRetry(errorCode)) { + toastOptions.action = { label: tCommon('retry'), onClick: () => attemptLogin() }; + } + toast.error(errorDetails.title, toastOptions); + } finally { + setIsLoading(false); + } + }; + - const handleSubmit = async (e: React.FormEvent) => { + const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); setIsLoading(true); setError(null); setErrorTitle(null); - const loadingToast = toast.loading(tCommon('loading')); - try { /* ...full login logic... */ } - catch (err) { /* ... */ } - finally { setIsLoading(false); } + await attemptLogin(); };Also translate the labels:
- aria-label="Dismiss error" + aria-label={tCommon('dismiss')} - label: "Retry", + label: tCommon('retry'), - description: "Redirecting to dashboard...", + description: t('redirecting'),Also applies to: 96-104
surfsense_web/components/homepage/features-bento-grid.tsx (1)
45-55: Use stable, descriptive keys instead of array index.Index keys hurt reconciliation when order changes. Add deterministic ids and use them.
- {items.map((item, i) => ( - <BentoGridItem - key={i} + {items.map((item) => ( + <BentoGridItem + key={item.id} title={item.title} description={item.description} header={item.header} className={item.className} icon={item.icon} /> ))}surfsense_web/app/(home)/login/page.tsx (1)
192-192: Translate the hardcoded loading text.Line 192 in the
LoadingFallbackcomponent has a hardcoded"Loading..."string that should be translated for consistency.The LoadingFallback component needs access to translations. Consider refactoring it to use the translations hook or passing the translated string as a prop.
surfsense_web/components/dashboard-breadcrumb.tsx (1)
159-170: Avoid index as React key; use a stable key.Index keys hinder reconciliation and violate our guideline. Use href+label.
Apply:
- {breadcrumbs.map((item, index) => ( - <React.Fragment key={index}> + {breadcrumbs.map((item) => ( + <React.Fragment key={`${item.href ?? 'current'}:${item.label}`}> <BreadcrumbItem> { /* ... */ } </BreadcrumbItem> { /* ... */ } </React.Fragment> ))}As per coding guidelines.
surfsense_web/app/dashboard/page.tsx (1)
221-234: Add translation keys for delete operation toasts in dashboard.Verification confirms three hard-coded toast messages in
surfsense_web/app/dashboard/page.tsx(lines 222, 230, 233) that bypass i18n. The codebase already usesnext-intlthroughout with the samet()pattern elsewhere in this component. The proposed keys follow the existing naming convention insurfsense_web/messages/en.json(dashboard namespace).Required changes:
- Add
"delete_space_failed","delete_space_error", and"delete_space_success"keys to bothsurfsense_web/messages/en.jsonandsurfsense_web/messages/zh.jsonunder the dashboard namespace- Update the three toast calls to use
t()as shown in the proposed diffsurfsense_web/app/(home)/register/page.tsx (1)
70-82: Translate hardcoded error messages for consistency.The error messages for the registration disabled case (HTTP 403) are hardcoded in English, while the rest of the file uses translations. For consistency with the i18n implementation, these should use translation keys.
Apply this diff to add translation support:
if (!response.ok && response.status === 403) { - const friendlyMessage = - "Registrations are currently closed. If you need access, contact your administrator."; - setErrorTitle("Registration is disabled"); - setError(friendlyMessage); - toast.error("Registration is disabled", { + const friendlyMessage = t('registration_closed_desc'); + setErrorTitle(t('registration_disabled')); + setError(friendlyMessage); + toast.error(t('registration_disabled'), { id: loadingToast, description: friendlyMessage, duration: 6000,surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx (1)
251-258: Fix timer leak: progress interval isn’t cleared on network errorsIf
fetchthrows beforeclearInterval, the interval keeps running. Hoist the ID and clear it infinally.- try { - // Simulate progress for better UX - const progressInterval = setInterval(() => { + let progressInterval: ReturnType<typeof setInterval> | null = null; + try { + // Simulate progress for better UX + progressInterval = setInterval(() => { setUploadProgress((prev) => { if (prev >= 90) return prev; return prev + Math.random() * 10; }); }, 200); ... - clearInterval(progressInterval); + if (progressInterval) clearInterval(progressInterval); setUploadProgress(100); ... - } catch (error: any) { + } catch (error: any) { setIsUploading(false); setUploadProgress(0); toast(t('upload_error'), { description: `${t('upload_error_desc')}: ${error.message}`, }); - } + } finally { + if (progressInterval) clearInterval(progressInterval); + }Also applies to: 270-275, 283-290
🧹 Nitpick comments (66)
surfsense_web/.gitignore (1)
51-51: Approve the addition; consider adding leading slash for consistency.The
.pnpm-store/entry appropriately excludes the pnpm package manager cache. However, for consistency with other root-level directory patterns (e.g.,/.source/,/node_modules), consider using/.pnpm-store/with a leading slash to match the gitignore convention and ensure it only matches at the repository root.# source /.source/ - -.pnpm-store/ + +/.pnpm-store/surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx (2)
94-95: Improve error type safety withunknowninstead ofany.The catch block uses
anytype, which bypasses TypeScript's type checking. Usingunknownwith proper type narrowing provides better type safety and follows modern TypeScript best practices.Apply this diff to improve type safety:
-} catch (error: any) { - setError(error.message || t('error_generic')); +} catch (error: unknown) { + const errorMessage = error instanceof Error ? error.message : t('error_generic'); + setError(errorMessage); toast(t('error_toast'), { - description: `${t('error_toast_desc')}: ${error.message}`, + description: `${t('error_toast_desc')}: ${errorMessage}`, });
21-21: Consider more robust URL validation.The current regex-based validation has limitations: it restricts TLDs to 2-6 characters (newer TLDs like
.photographyare longer), and doesn't support localhost or IP addresses. For a more comprehensive solution, consider using the browser's nativeURLconstructor for validation.Apply this diff for more robust validation:
-// URL validation regex -const urlRegex = /^(https?:\/\/)?([\da-z.-]+)\.([a-z.]{2,6})([/\w .-]*)*\/?$/; - -// Function to validate a URL -const isValidUrl = (url: string): boolean => { - return urlRegex.test(url); +// Function to validate a URL +const isValidUrl = (url: string): boolean => { + try { + // Prepend https:// if no protocol is specified + const urlToTest = url.match(/^https?:\/\//) ? url : `https://${url}`; + const parsed = new URL(urlToTest); + // Only allow http and https protocols + return parsed.protocol === 'http:' || parsed.protocol === 'https:'; + } catch { + return false; + } };Also applies to: 35-37
surfsense_web/components/contact/contact-form.tsx (1)
208-219: Consider removing the hardcoded English fallback.Since the Pin component is only used locally and always receives translated text at line 104, the hardcoded English fallback "We are here" is unnecessary and inconsistent with the i18n implementation.
Consider simplifying the component since text is always provided:
-const Pin = ({ className, text }: { className?: string; text?: string }) => { +const Pin = ({ className, text }: { className?: string; text: string }) => { return ( <motion.div style={{ transform: "translateZ(1px)" }} className={cn( "pointer-events-none absolute z-[60] flex h-40 w-96 items-center justify-center opacity-100 transition duration-500", className )} > <div className="h-full w-full"> <div className="absolute inset-x-0 top-0 z-20 mx-auto inline-block w-fit rounded-lg bg-neutral-200 px-2 py-1 text-xs font-normal text-neutral-700 dark:bg-neutral-800 dark:text-white"> - {text || "We are here"} + {text} <span className="absolute -bottom-0 left-[1.125rem] h-px w-[calc(100%-2.25rem)] bg-gradient-to-r from-blue-400/0 via-blue-400/90 to-blue-400/0 transition-opacity duration-500"></span> </div>surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx (1)
37-201: Translation keys verified—type-safe refactor is optional.All translation keys referenced in the connector categories data are confirmed to exist in both
en.jsonandzh.json. No missing keys detected.The current string-based approach works correctly. However, consider refactoring to use constants with
as constfor better developer experience and compile-time safety:const CATEGORY_KEYS = { SEARCH_ENGINES: 'search_engines', TEAM_CHATS: 'team_chats', PROJECT_MANAGEMENT: 'project_management', KNOWLEDGE_BASES: 'knowledge_bases', COMMUNICATION: 'communication', } as const; const CONNECTOR_DESC_KEYS = { TAVILY: 'tavily_desc', SEARXNG: 'searxng_desc', // ... etc } as const; // Usage: title: CATEGORY_KEYS.SEARCH_ENGINESThis provides IDE autocomplete, catches typos at compile time, and simplifies future refactoring.
surfsense_web/components/settings/llm-role-manager.tsx (9)
18-18: Good i18n integration; memoize role metadata for stability.Nice use of next-intl and a single descriptor factory. To avoid re-creating ROLE_DESCRIPTIONS every render, memoize it.
Apply this diff:
- import { useEffect, useState } from "react"; + import { useEffect, useMemo, useState } from "react"; - const t = useTranslations('settings'); - const ROLE_DESCRIPTIONS = createRoleDescriptions(t); + const t = useTranslations('settings'); + const ROLE_DESCRIPTIONS = useMemo(() => createRoleDescriptions(t), [t]);Also applies to: 33-58, 65-67
204-217: Localize remaining button labels.These are still hardcoded English. Move them to the settings namespace.
- <span className="hidden sm:inline">Refresh Configs</span> - <span className="sm:hidden">Configs</span> + <span className="hidden sm:inline">{t('refresh_configs')}</span> + <span className="sm:hidden">{t('configs_short')}</span> ... - <span className="hidden sm:inline">Refresh Preferences</span> - <span className="sm:hidden">Prefs</span> + <span className="hidden sm:inline">{t('refresh_preferences')}</span> + <span className="sm:hidden">{t('prefs_short')}</span>
236-241: Localize loading messages.Replace string literals with translations.
- {configsLoading && preferencesLoading - ? "Loading configurations and preferences..." - : configsLoading - ? "Loading configurations..." - : "Loading preferences..."} + {configsLoading && preferencesLoading + ? t('loading_configs_and_preferences') + : configsLoading + ? t('loading_configs') + : t('loading_preferences')}
255-256: Localize stats labels.These subtitles should use t().
- <p className="text-sm font-medium text-muted-foreground">Available Models</p> + <p className="text-sm font-medium text-muted-foreground">{t('available_models')}</p> - <p className="text-sm font-medium text-muted-foreground">Assigned Roles</p> + <p className="text-sm font-medium text-muted-foreground">{t('assigned_roles')}</p> - <p className="text-sm font-medium text-muted-foreground">Completion</p> + <p className="text-sm font-medium text-muted-foreground">{t('completion')}</p>Also applies to: 269-270, 289-290
369-383: Use map index parameter instead of computing indexOf each render.Slight perf/readability win.
- {Object.entries(ROLE_DESCRIPTIONS).map(([key, role]) => { + {Object.entries(ROLE_DESCRIPTIONS).map(([key, role], idx) => { const IconComponent = role.icon; ... - transition={{ delay: Object.keys(ROLE_DESCRIPTIONS).indexOf(key) * 0.1 }} + transition={{ delay: idx * 0.1 }}
403-404: Move punctuation into translations.Colons should be in the localized string to respect language conventions.
- <strong>{t('use_cases')}:</strong> + <strong>{t('use_cases_label')}</strong> - <Label className="text-sm font-medium">{t('assign_llm_config')}:</Label> + <Label className="text-sm font-medium">{t('assign_llm_config_label')}</Label> - {t('model')}: {assignedConfig.model_name} + {t('model_label')} {assignedConfig.model_name} - {t('base')}: {assignedConfig.api_base} + {t('base_label')} {assignedConfig.api_base} - <span>{t('progress')}:</span> + <span>{t('progress_label')}</span>Add the new *_label keys to messages/en.json and messages/zh.json. Based on learnings.
Also applies to: 415-416, 453-454, 457-458, 502-503
151-154: Localize the success toast.Keep notifications bilingual.
- if (success) { - setHasChanges(false); - toast.success("LLM role assignments saved successfully!"); - } + if (success) { + setHasChanges(false); + toast.success(t('roles_saved_success')); + }
168-171: Coerce assignment completion to boolean.Avoid relying on truthy chaining returning a non-boolean value.
- const isAssignmentComplete = - assignments.long_context_llm_id && assignments.fast_llm_id && assignments.strategic_llm_id; + const isAssignmentComplete = Boolean( + assignments.long_context_llm_id && + assignments.fast_llm_id && + assignments.strategic_llm_id + );
82-86: Type the assignments state to avoid string/number ambiguity.Make intent explicit and reduce casts/typeof checks.
+ type RoleAssignments = { + long_context_llm_id: number | ""; + fast_llm_id: number | ""; + strategic_llm_id: number | ""; + }; - const [assignments, setAssignments] = useState({ + const [assignments, setAssignments] = useState<RoleAssignments>({ long_context_llm_id: preferences.long_context_llm_id || "", fast_llm_id: preferences.fast_llm_id || "", strategic_llm_id: preferences.strategic_llm_id || "", });surfsense_backend/app/routes/documents_routes.py (5)
510-561: Optional: Remove redundant import.
TaskLoggingServiceis already imported at module level (Line 27), so the inline import on Line 515 is redundant.Apply this diff:
async def process_extension_document_with_new_session( individual_document, search_space_id: int, user_id: str ): """Create a new session and process extension document.""" from app.db import async_session_maker - from app.services.task_logging_service import TaskLoggingService async with async_session_maker() as session:
563-613: Optional: Remove redundant import.
TaskLoggingServiceis already imported at module level (Line 27), so the inline import on Line 568 is redundant.Apply this diff:
async def process_crawled_url_with_new_session( url: str, search_space_id: int, user_id: str ): """Create a new session and process crawled URL.""" from app.db import async_session_maker - from app.services.task_logging_service import TaskLoggingService async with async_session_maker() as session:
615-661: Optional: Remove redundant import.
TaskLoggingServiceis already imported at module level (Line 27), so the inline import on Line 620 is redundant.Apply this diff:
async def process_file_in_background_with_new_session( file_path: str, filename: str, search_space_id: int, user_id: str ): """Create a new session and process file.""" from app.db import async_session_maker - from app.services.task_logging_service import TaskLoggingService async with async_session_maker() as session:
663-713: Optional: Remove redundant import.
TaskLoggingServiceis already imported at module level (Line 27), so the inline import on Line 668 is redundant.Apply this diff:
async def process_youtube_video_with_new_session( url: str, search_space_id: int, user_id: str ): """Create a new session and process YouTube video.""" from app.db import async_session_maker - from app.services.task_logging_service import TaskLoggingService async with async_session_maker() as session:
738-744: Optional: Use logging instead of print for error messages.Multiple locations (Lines 738-744, 822-826, 885-891, 947-953, 1025-1031) use
print()for temp file deletion errors. Consider using theloggingmodule for consistency.Example:
# Clean up the temp file import os + import logging try: os.unlink(file_path) except Exception as e: - print("Error deleting temp file", e) - pass + logging.warning(f"Failed to delete temp file {file_path}: {e}")surfsense_web/components/homepage/integrations.tsx (1)
88-91: Use stable keys for mapped elementskey={index} can cause reconciliation issues; prefer a stable key like integration.name or actualIndex. As per coding guidelines.
Apply one of the following:
- <div - key={index} + <div + key={integration.name}or
- <div - key={index} + <div + key={actualIndex}surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
209-218: Translate validation errorThe frequency validation message is hard-coded.
- toast.error("Please enter a valid frequency in minutes"); + toast.error(t('invalid_frequency'));surfsense_web/components/homepage/navbar.tsx (2)
62-77: Use stable keys for nav itemsAvoid index-derived keys. Use navItem.link (stable) instead. As per coding guidelines.
- key={`link=${idx}`} + key={navItem.link}Also applies to: 160-168
141-149: Translate menu button aria-labelsLocalize "Open menu"/"Close menu" via the 'navigation' namespace.
- aria-label={open ? "Close menu" : "Open menu"} + aria-label={open ? t('close_menu') : t('open_menu')}surfsense_web/components/sidebar/nav-projects.tsx (3)
91-99: Remove redundant key inside ChatItemComponentThe parent map already sets a key on . The key on the returned is ignored and can mislead.
- <SidebarMenuItem key={chat.id ? `chat-${chat.id}` : `chat-${chat.name}`}> + <SidebarMenuItem>
104-108: Localize action labels"More" (sr-only) and "Deleting..." are hard-coded.
- <span className="sr-only">More</span> + <span className="sr-only">{t('more')}</span> ... - <span>{isDeletingChat && isDeleteAction ? "Deleting..." : action.name}</span> + <span>{isDeletingChat && isDeleteAction ? t('deleting') : action.name}</span>Also applies to: 131-133
114-131: Avoid relying on action display names for logicDetect delete actions via a stable field (e.g., action.type === 'delete' or icon === 'Trash2') rather than action.name text.
- const isDeleteAction = action.name.toLowerCase().includes("delete"); + const isDeleteAction = action.icon === 'Trash2' || action.type === 'delete';surfsense_web/app/dashboard/[search_space_id]/podcasts/podcasts-client.tsx (2)
128-131: Localize remaining strings and add aria labels for icon-only buttons.Several user‑facing strings are still hardcoded and a few icon-only buttons lack accessible names. Replace with translations and add aria-labels.
Examples (apply similarly elsewhere):
- setError("Authentication token not found. Please log in again."); + setError(t('auth_token_missing')); - throw new Error(`Failed to fetch podcasts: ${response.status} ${errorData?.detail || ""}`); + throw new Error(t('fetch_failed_with_status', { status: response.status, detail: errorData?.detail || '' })); - setError(error instanceof Error ? error.message : "Unknown error occurred"); + setError(error instanceof Error ? error.message : t('unknown_error')); - toast.error(error instanceof Error ? error.message : "Failed to load podcast audio."); + toast.error(error instanceof Error ? error.message : t('failed_load_audio')); - toast.success("Podcast deleted successfully"); + toast.success(t('podcast_deleted')) - toast.error(error instanceof Error ? error.message : "Failed to delete podcast"); + toast.error(error instanceof Error ? error.message : t('podcast_delete_failed')); - <span className="sr-only">Open menu</span> + <span className="sr-only">{t('open_menu')}</span> - title="Rewind 10 seconds" + title={t('rewind_10s')} - title="Forward 10 seconds" + title={t('forward_10s')} - <Image ... alt="Podcast illustration" ... + <Image ... alt={t('illustration_alt')} ... - {podcast.title || "Untitled Podcast"} + {podcast.title || t('untitled_podcast')} - toast.error("Failed to play audio."); + toast.error(t('audio_failed_to_play')); - toast.error("Error playing audio. Please try again."); + toast.error(t('audio_error_retry'));Icon-only controls in the bottom player:
- <Button ... onClick={skipBackward} ...> + <Button aria-label={t('rewind_10s')} ... onClick={skipBackward} ...> - <Button ... onClick={togglePlayPause} ...> + <Button aria-label={isPlaying ? t('pause') : t('play')} ... onClick={togglePlayPause} ...> - <Button ... onClick={skipForward} ...> + <Button aria-label={t('forward_10s')} ... onClick={skipForward} ...> - <Button ... onClick={closePlayer} ...> + <Button aria-label={t('close_player')} ... onClick={closePlayer} ...>Also applies to: 145-151, 156-163, 370-385, 433-439, 734-770, 785-787, 545-552, 667-672, 1008-1011, 1024-1026
671-672: Use locale-aware date formatting via next-intl.Replace date-fns format with next-intl for correct per-locale formats.
- import { format } from "date-fns"; + import { useFormatter } from "next-intl"; - {format(new Date(podcast.created_at), "MMM d, yyyy")} + {useFormatter().dateTime(new Date(podcast.created_at), { dateStyle: 'medium' })}surfsense_web/components/chat/ChatInputGroup.tsx (1)
65-73: Add accessible name to icon-only trigger.Provide aria-label/title so screen readers announce the control.
- <Button variant="outline" className="relative"> + <Button variant="outline" className="relative" aria-label={t('select_documents')} title={t('select_documents')}>surfsense_web/components/homepage/features-bento-grid.tsx (1)
12-41: Add item ids and localize audio illustration alt; pass t through.- const items = [ + const items = [ { + id: 'find-ask-act', title: t('find_ask_act.title'), description: t('find_ask_act.description'), header: <CitationIllustration t={t} />, className: "md:col-span-2", icon: <IconSearch className="h-4 w-4 text-neutral-500" />, }, { + id: 'real-time-collab', title: t('real_time_collab.title'), description: t('real_time_collab.description'), header: <CollaborationIllustration t={t} />, className: "md:col-span-1", icon: <IconUsers className="h-4 w-4 text-neutral-500" />, }, { + id: 'beyond-text', title: t('beyond_text.title'), description: t('beyond_text.description'), - header: <AudioCommentIllustration />, + header: <AudioCommentIllustration t={t} />, className: "md:col-span-1", icon: <IconMicrophone className="h-4 w-4 text-neutral-500" />, }, { + id: 'context-counts', title: t('context_counts.title'), description: t('context_counts.description'), header: <AnnotationIllustration t={t} />, className: "md:col-span-2", icon: <IconMessage className="h-4 w-4 text-neutral-500" />, }, ]; - const AudioCommentIllustration = () => ( + const AudioCommentIllustration = ({ t }: { t: (key: string) => string }) => ( <div className="relative flex w-full h-full min-h-[6rem] overflow-hidden rounded-xl"> <Image src="/homepage/comments-audio.webp" - alt="Audio Comment Illustration" + alt={t('audio_comment_illustration_alt')} fill className="object-cover" /> </div> );Also applies to: 441-449
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (6)
145-154: Localize dialog title and close action in MessageDetails.Use next-intl inside the component.
function MessageDetails({ ... }) { + const t = useTranslations('logs'); return ( <AlertDialog> <AlertDialogTrigger asChild>{children}</AlertDialogTrigger> <AlertDialogContent className="max-w-3xl w-full"> <div className="flex items-start justify-between gap-4"> <div> - <AlertDialogTitle className="text-lg">Log details</AlertDialogTitle> + <AlertDialogTitle className="text-lg">{t('log_details')}</AlertDialogTitle> </div> <div className="shrink-0"> - <AlertDialogCancel className="text-sm">Close</AlertDialogCancel> + <AlertDialogCancel className="text-sm">{t('close')}</AlertDialogCancel> </div> </div>
175-197: Localize checkbox aria-labels.- aria-label="Select all" + aria-label={t('select_all_rows')} ... - aria-label="Select row" + aria-label={t('select_row')}
406-434: Translate toasts for delete/refresh flows.- toast.error("No rows selected"); + toast.error(t('no_rows_selected')); ... - toast.success(`Successfully deleted ${selectedRows.length} log(s)`); + toast.success(t('deleted_n_logs', { count: selectedRows.length })); - toast.error("Some logs could not be deleted"); + toast.error(t('some_logs_not_deleted')); ... - toast.error("Error deleting logs"); + toast.error(t('delete_logs_error')); ... - toast.success("Logs refreshed"); + toast.success(t('logs_refreshed'));
856-887: Localize loading and error states in LogsTable.- <p className="text-sm text-muted-foreground">Loading logs...</p> + <p className="text-sm text-muted-foreground">{t('loading_logs')}</p> ... - <p className="text-sm text-destructive">Error loading logs</p> + <p className="text-sm text-destructive">{t('error_loading_logs')}</p> - <Button variant="outline" size="sm" onClick={onRefresh}>Retry</Button> + <Button variant="outline" size="sm" onClick={onRefresh}>{t('retry')}</Button>
1051-1061: Internationalize pagination summary.Replace the hardcoded “of” with a translated template.
- of <span className="text-foreground">{table.getRowCount()}</span> + {t('range_of_total', { + total: table.getRowCount() + })}Or render whole summary with:
- <p> {start}-{end} of {total} </p> + <p>{t('range', { start, end, total })}</p>Please confirm these keys exist in logs namespace: range_of_total or range, loading_logs, error_loading_logs, no_rows_selected, logs_refreshed, deleted_n_logs, some_logs_not_deleted, select_all_rows, select_row, log_details, close.
1146-1179: Translate JsonMetadataViewer title and all action labels.- title={`Log ${log.id} - Metadata`} + title={t('log_metadata_title', { id: log.id })}Already-placed labels (view metadata, delete, confirm, cancel, deleting) look good with t(). Ensure corresponding keys exist.
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx (1)
6-6: Good i18n coverage with minor gaps.Most table content is properly translated, but a couple of strings remain hardcoded:
- "Created At" header (line 184)
- "Actions" screen-reader text (line 196)
For complete localization consistency, these should also use translation keys.
Apply translations to the remaining headers:
> - Created At + {t('created_at')} {sortKey === "created_at" ? (<TableHead style={{ width: 60 }}> - <span className="sr-only">Actions</span> + <span className="sr-only">{t('actions')}</span> </TableHead>Also applies to: 70-70, 106-122, 145-175, 269-269, 340-340
surfsense_web/components/LanguageSwitcher.tsx (2)
22-25: Consider moving languages array outside component.The
languagesarray is recreated on every render. Moving it outside the component or wrapping it inuseMemowould prevent unnecessary allocations.Apply this diff to move it outside:
+// Supported languages configuration +const languages = [ + {code: 'en' as const, name: 'English', flag: '🇺🇸'}, + {code: 'zh' as const, name: '简体中文', flag: '🇨🇳'}, +] as const; + /** * Language switcher component * Allows users to change the application language * Persists preference in localStorage */ export function LanguageSwitcher() { const {locale, setLocale} = useLocaleContext(); - // Supported languages configuration - const languages = [ - {code: 'en' as const, name: 'English', flag: '🇺🇸'}, - {code: 'zh' as const, name: '简体中文', flag: '🇨🇳'}, - ]; -
31-33: Consider wrapping handleLanguageChange with useCallback.The function is recreated on every render. While not critical given the component's simplicity, using
useCallbackwould be consistent with React performance best practices.Apply this diff:
+import {useLocaleContext} from '@/contexts/LocaleContext'; +import {useCallback} from 'react'; + /** * Handle language change * Updates locale in context and localStorage */ - const handleLanguageChange = (newLocale: string) => { + const handleLanguageChange = useCallback((newLocale: string) => { setLocale(newLocale as 'en' | 'zh'); - }; + }, [setLocale]);surfsense_web/app/dashboard/page.tsx (3)
53-59: Make date formatting locale-aware.Currently fixed to en-US, which breaks when locale is zh. Use the selected locale from next-intl.
Apply these diffs:
- import { useTranslations } from "next-intl"; + import { useTranslations, useLocale } from "next-intl";-const formatDate = (dateString: string): string => { - return new Date(dateString).toLocaleDateString("en-US", { +const formatDate = (dateString: string, locale: string): string => { + return new Date(dateString).toLocaleDateString(locale, { year: "numeric", month: "short", day: "numeric", }); };- const t = useTranslations('dashboard'); - const tCommon = useTranslations('common'); - + const t = useTranslations('dashboard'); + const tCommon = useTranslations('common'); + const locale = useLocale();- <span>{t('created')} {formatDate(space.created_at)}</span> + <span>{t('created')} {formatDate(space.created_at, locale)}</span>Also applies to: 10-10, 137-140, 350-351
196-204: Consider localizing user fallback strings."User", "Loading...", "Error loading user", "Unknown User" are hard-coded. Prefer common.* keys (e.g., common.loading) and add a common.unknown_user key.
297-307: Remove redundant key props on non-list elements.The key on is unnecessary since the list key lives on the wrapping <motion.div>. Safe to drop.
Also applies to: 340-354
surfsense_web/app/layout.tsx (1)
82-92: Set HTML lang from selected locale during SSR for a11y/SEO.lang="en" with suppressHydrationWarning avoids mismatch but ships wrong lang to crawlers/AT on first paint. Prefer server-provided locale.
Options:
- Use next-intl’s server helpers to read locale (cookie/header/URL) and render
<html lang={locale}>.- If staying client-only, consider middleware to set Content-Language and dynamic metadata per locale.
Also consider making openGraph.locale dynamic (e.g., en_US vs zh_CN).
surfsense_web/components/dashboard-breadcrumb.tsx (1)
97-106: Localize hard-coded crumb labels.Replace "Connectors" and "Add Connector" with translations to keep breadcrumbs bilingual.
- breadcrumbs.push({ - label: "Connectors", - href: `/dashboard/${segments[1]}/connectors`, - }); + breadcrumbs.push({ + label: t('connectors'), + href: `/dashboard/${segments[1]}/connectors`, + }); - breadcrumbs.push({ - label: "Add Connector", - href: `/dashboard/${segments[1]}/connectors/add`, - }); + breadcrumbs.push({ + label: t('add_connector'), + href: `/dashboard/${segments[1]}/connectors/add`, + });Also applies to: 116-121
surfsense_web/messages/en.json (3)
140-141: Fix brand casing: YouTube.Ensure consistent capitalization.
- "add_youtube": "Add Youtube Videos", - "add_youtube_videos": "Add Youtube Videos", + "add_youtube": "Add YouTube Videos", + "add_youtube_videos": "Add YouTube Videos",
151-156: Tweak subtitle grammar.Improve readability.
- "subtitle": "Choose that works for you", + "subtitle": "Choose a plan that works for you",
116-120: Add keys for dashboard delete toasts referenced in code.Supports localized toasts in Dashboard page.
"delete_search_space": "Delete Search Space", "delete_space_confirm": "Are you sure you want to delete \"{name}\"? This action cannot be undone. All documents, chats, and podcasts in this search space will be permanently deleted.", + "delete_space_failed": "Failed to delete search space", + "delete_space_error": "An error occurred while deleting the search space", + "delete_space_success": "Search space deleted successfully", "no_spaces_found": "No search spaces found",surfsense_web/messages/zh.json (1)
116-121: Add matching delete toast keys for Dashboard.Mirror EN additions.
"delete_search_space": "删除搜索空间", "delete_space_confirm": "您确定要删除\"{name}\"吗？此操作无法撤销。此搜索空间中的所有文档、对话和播客将被永久删除。", + "delete_space_failed": "删除搜索空间失败", + "delete_space_error": "删除搜索空间时出错", + "delete_space_success": "搜索空间删除成功", "no_spaces_found": "未找到搜索空间",surfsense_web/components/sidebar/nav-main.tsx (1)
66-66: Consider using unique identifiers for keys if available.The current keys use
${item.title}-${index}format, which should be stable for static navigation items. However, if the nav items have unique identifiers (like a URL or ID field), using those would be preferable to including the index.For example, if items have unique URLs:
-<Collapsible key={`${item.title}-${index}`} asChild defaultOpen={item.isActive}> +<Collapsible key={item.url} asChild defaultOpen={item.isActive}>Based on coding guidelines.
Also applies to: 96-96
surfsense_web/contexts/LocaleContext.tsx (2)
25-27: Stronger type-safety for messages across locales
messagesis typed astypeof enMessages, which won't catch missing keys inzh. Add a sharedMessagestype and assert both bundles satisfy it.Apply:
-import enMessages from '../messages/en.json'; -import zhMessages from '../messages/zh.json'; +import enMessages from '../messages/en.json'; +import zhMessages from '../messages/zh.json'; +type Messages = typeof enMessages; // Compile-time assurance that zh matches the shape: +const _zhSatisfies: Messages = zhMessages; -interface LocaleContextType { +interface LocaleContextType { locale: Locale; - messages: typeof enMessages; + messages: Messages; setLocale: (locale: Locale) => void; }
49-55: Simplify lang sync;mountedflag is unnecessary
useEffectnever runs during SSR; you can dropmountedand setdocumentElement.langwheneverlocalechanges.-const [mounted, setMounted] = useState(false); ... -useEffect(() => { - setMounted(true); - if (typeof window !== 'undefined') { +useEffect(() => { + if (typeof window !== 'undefined') { const stored = localStorage.getItem(LOCALE_STORAGE_KEY); if (stored === 'zh') { setLocaleState('zh'); } } -}, []); +}, []); ... -useEffect(() => { - if (typeof window !== 'undefined' && mounted) { +useEffect(() => { + if (typeof window !== 'undefined') { document.documentElement.lang = locale; } -}, [locale, mounted]); +}, [locale]);surfsense_web/components/sidebar/AppSidebarProvider.tsx (3)
101-118: Localize fallback chat title and action label
Chat ${chat.id}and"Delete"are hard-coded. Use translations and interpolation.- name: chat.title || `Chat ${chat.id}`, + name: chat.title || t('chat_number', { id: chat.id }), ... - actions: [ + actions: [ { - name: "Delete", + name: tCommon('delete'), icon: "Trash2",
122-126: Localize generic error stringsReplace
"Unknown error occurred"with a translated fallback to keep UX bilingual.- setChatError(error instanceof Error ? error.message : "Unknown error occurred"); + setChatError(error instanceof Error ? error.message : tCommon('unknown_error')); ... - setSearchSpaceError(error instanceof Error ? error.message : "Unknown error occurred"); + setSearchSpaceError(error instanceof Error ? error.message : tCommon('unknown_error'));Also applies to: 142-145
86-100: Avoid setState after unmount in async fetchesAdd an abort/safe-guard to prevent state updates on unmounted components during in-flight requests.
- const fetchRecentChats = useCallback(async () => { + const fetchRecentChats = useCallback(async () => { + let cancelled = false; try { if (typeof window === "undefined") return; const chats: Chat[] = await apiClient.get<Chat[]>( `api/v1/chats/?limit=5&skip=0&search_space_id=${searchSpaceId}` ); - const sortedChats = chats.sort( + const sortedChats = [...chats].sort( (a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime() ); const formattedChats = sortedChats.map((chat) => ({ ... })); - setRecentChats(formattedChats); + if (!cancelled) setRecentChats(formattedChats); if (!cancelled) setChatError(null); } catch (error) { console.error("Error fetching chats:", error); - setChatError(...); - setRecentChats([]); + if (!cancelled) { setChatError(...); setRecentChats([]); } } finally { - setIsLoadingChats(false); + if (!cancelled) setIsLoadingChats(false); } - }, [searchSpaceId]); + return () => { cancelled = true; }; + }, [searchSpaceId]);Note: mirror the same pattern in
fetchSearchSpace.Also applies to: 131-148
surfsense_web/components/onboard/add-provider-step.tsx (2)
60-63: Localize the validation toastHard-coded error copy; use translations.
- toast.error("Please fill in all required fields"); + toast.error(t('fill_required_fields'));
139-142: Add accessible name to icon-only delete buttonIcon-only buttons need an aria-label for screen readers.
- <Button + <Button variant="ghost" size="sm" onClick={async () => { const success = await deleteLLMConfig(config.id); if (success) { onConfigDeleted?.(); } }} className="text-destructive hover:text-destructive" + aria-label={t('delete_config')} >surfsense_web/components/settings/model-config-manager.tsx (5)
112-114: Localize the validation toastUse translations for consistency.
- toast.error("Please fill in all required fields"); + toast.error(t('fill_required_fields'));
147-151: Localize destructive confirm dialogHard-coded English. Replace with a translated confirm flow (or use your existing Dialog).
- if (confirm("Are you sure you want to delete this configuration? This action cannot be undone.")) { + if (confirm(t('confirm_delete_config'))) {
467-476: Missed i18n in dialog title, description, and form labelsSeveral strings remain hard-coded in the Add/Edit dialog. Wrap them with
t('...')under themodel_confignamespace.- {editingConfig ? "Edit LLM Configuration" : "Add New LLM Configuration"} + {editingConfig ? t('edit_config_title') : t('add_config_title')} ... - {editingConfig ? "Update your language model provider configuration" : "Configure a new language model provider for your AI assistant"} + {editingConfig ? t('edit_config_subtitle') : t('add_config_subtitle')} ... - <Label htmlFor="name">Configuration Name *</Label> + <Label htmlFor="name">{t('config_name_required')}</Label> - <Input ... placeholder="e.g., My OpenAI GPT-4" /> + <Input ... placeholder={t('config_name_placeholder')} /> ... - <Label htmlFor="provider">Provider *</Label> + <Label htmlFor="provider">{t('provider_required')}</Label> - <SelectValue placeholder="Select a provider"> + <SelectValue placeholder={t('provider_placeholder')}> ... - <Label htmlFor="custom_provider">Custom Provider Name *</Label> + <Label htmlFor="custom_provider">{t('custom_provider_name')}</Label> - <Input ... placeholder="e.g., my-custom-provider" /> + <Input ... placeholder={t('custom_provider_placeholder')} /> ... - <Label htmlFor="model_name">Model Name *</Label> + <Label htmlFor="model_name">{t('model_name_required')}</Label> - <Input ... placeholder={selectedProvider?.example || "e.g., gpt-4"} /> + <Input ... placeholder={selectedProvider?.example || t('model_name_placeholder')} /> - <p className="text-xs text-muted-foreground">Examples: {selectedProvider.example}</p> + <p className="text-xs text-muted-foreground">{t('examples')}: {selectedProvider.example}</p> ... - <Label htmlFor="language">Language (Optional)</Label> + <Label htmlFor="language">{t('language_optional')}</Label> - <SelectValue placeholder="Select language" /> + <SelectValue placeholder={t('language_placeholder')} /> ... - <Label htmlFor="api_key">API Key *</Label> + <Label htmlFor="api_key">{t('api_key_required')}</Label> - <Input ... placeholder="Your API key" /> + <Input ... placeholder={t('api_key_placeholder')} /> ... - <Label htmlFor="api_base">API Base URL + <Label htmlFor="api_base">{t('api_base_optional')} ... - Using recommended API endpoint for {selectedProvider.label} + {t('using_recommended_endpoint', { provider: selectedProvider.label })} ... - ⚠️ API Base URL is required for {selectedProvider.label}. Click to auto-fill: + {t('api_base_required_for', { provider: selectedProvider.label })} {t('click_to_autofill')}:Also applies to: 481-516, 532-566, 568-576, 580-599, 625-657
371-383: Add aria-labels to icon-only buttons (a11y)Provide accessible names for Eye/EyeOff, Edit, and Delete controls.
- <Button ... onClick={() => toggleApiKeyVisibility(config.id)} className="h-8 w-8 p-0"> + <Button ... onClick={() => toggleApiKeyVisibility(config.id)} className="h-8 w-8 p-0" aria-label={showApiKey[config.id] ? t('hide_api_key') : t('show_api_key')}> ... - <Button ... onClick={() => setEditingConfig(config)} className="h-8 w-8 p-0"> + <Button ... onClick={() => setEditingConfig(config)} className="h-8 w-8 p-0" aria-label={t('edit_config')}> ... - <Button ... onClick={() => handleDelete(config.id)} className="h-8 w-8 p-0 ..."> + <Button ... onClick={() => handleDelete(config.id)} className="h-8 w-8 p-0 ..." aria-label={t('delete_config')}>Also applies to: 415-430
401-405: Format dates using the active localeLeverage
useLocale()for consistent i18n date formatting.-import { useTranslations } from "next-intl"; +import { useTranslations, useLocale } from "next-intl"; ... - const t = useTranslations('model_config'); + const t = useTranslations('model_config'); + const locale = useLocale(); ... - {t('created')} {new Date(config.created_at).toLocaleDateString()} + {t('created')} {new Intl.DateTimeFormat(locale).format(new Date(config.created_at))}surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx (5)
219-226: Use dropzone’sopen()instead ofquerySelectorAvoid querying the DOM;
useDropzoneexposesopen()to trigger the file dialog.- const { getRootProps, getInputProps, isDragActive } = useDropzone({ + const { getRootProps, getInputProps, isDragActive, open } = useDropzone({ onDrop, accept: acceptedFileTypes, maxSize: 50 * 1024 * 1024, noClick: false, noKeyboard: false, }); ... - onClick={(e) => { - e.stopPropagation(); - const input = document.querySelector('input[type="file"]') as HTMLInputElement; - if (input) input.click(); - }} + onClick={(e) => { + e.stopPropagation(); + open(); + }}Also applies to: 392-405
443-452: Prefer stable keys for files list
name-indexcan collide and reordering breaks React’s diffing. Use name+size+lastModified.- key={`${file.name}-${index}`} + key={`${file.name}-${file.size}-${file.lastModified}`}As per coding guidelines (unique, stable keys).
463-465: Localize “Unknown type”Replace fallback with a translation.
- {file.type || "Unknown type"} + {file.type || t('unknown_type')}
231-237: Optional: localize file sizesConsider
Intl.NumberFormatand translated units for better locale fidelity.- const formatFileSize = (bytes: number) => { - if (bytes === 0) return "0 Bytes"; - const k = 1024; - const sizes = ["Bytes", "KB", "MB", "GB", "TB"]; - const i = Math.floor(Math.log(bytes) / Math.log(k)); - return `${parseFloat((bytes / k ** i).toFixed(2))} ${sizes[i]}`; - }; + const formatFileSize = (bytes: number) => { + if (bytes === 0) return `0 ${t('bytes')}`; + const k = 1024; + const sizes = [t('bytes'), 'KB', 'MB', 'GB', 'TB']; // or fully translate + const i = Math.floor(Math.log(bytes) / Math.log(k)); + const num = new Intl.NumberFormat().format(parseFloat((bytes / k ** i).toFixed(2))); + return `${num} ${sizes[i]}`; + };
52-61: RenameaudioFileTypesfor clarityThis object includes text types; rename to
alwaysSupportedTypesto avoid confusion.- // Audio files are always supported (using whisper) - const audioFileTypes = { + // Types always supported across ETL providers + const alwaysSupportedTypes = { "audio/mpeg": [".mp3", ".mpeg", ".mpga"], ... "text/plain": [".txt"], }; ... - ...audioFileTypes, + ...alwaysSupportedTypes,
| request: DocumentsCreate, | ||
| session: AsyncSession = Depends(get_async_session), | ||
| user: User = Depends(current_active_user), | ||
| fastapi_background_tasks: BackgroundTasks = BackgroundTasks(), |
There was a problem hiding this comment.
Critical: Mutable default argument causes task accumulation across requests.
Using BackgroundTasks() as a default parameter value is incorrect. Python evaluates default arguments once at function definition time, so all requests will share the same BackgroundTasks instance, causing tasks from different requests to accumulate and execute incorrectly.
Apply this diff to fix:
- fastapi_background_tasks: BackgroundTasks = BackgroundTasks(),
+ fastapi_background_tasks: BackgroundTasks = Depends(BackgroundTasks),📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| fastapi_background_tasks: BackgroundTasks = BackgroundTasks(), | |
| fastapi_background_tasks: BackgroundTasks = Depends(BackgroundTasks), |
🤖 Prompt for AI Agents
In surfsense_backend/app/routes/documents_routes.py around line 59, the
parameter fastapi_background_tasks is incorrectly given a mutable default
BackgroundTasks(), causing tasks to be shared across requests; change the
signature to accept Optional[BackgroundTasks] = None (import typing.Optional if
needed) and inside the function, if fastapi_background_tasks is None assign
fastapi_background_tasks = BackgroundTasks() so each request gets a fresh
instance; keep the type hint and any callers unchanged.
| search_space_id: int = Form(...), | ||
| session: AsyncSession = Depends(get_async_session), | ||
| user: User = Depends(current_active_user), | ||
| fastapi_background_tasks: BackgroundTasks = BackgroundTasks(), |
There was a problem hiding this comment.
Critical: Mutable default argument causes task accumulation across requests.
Same issue as Line 59. All requests will share the same BackgroundTasks instance, causing tasks to accumulate incorrectly across different requests.
Apply this diff to fix:
- fastapi_background_tasks: BackgroundTasks = BackgroundTasks(),
+ fastapi_background_tasks: BackgroundTasks = Depends(BackgroundTasks),📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| fastapi_background_tasks: BackgroundTasks = BackgroundTasks(), | |
| fastapi_background_tasks: BackgroundTasks = Depends(BackgroundTasks), |
🤖 Prompt for AI Agents
In surfsense_backend/app/routes/documents_routes.py around line 109, the
function parameter uses a mutable default BackgroundTasks instance which will be
shared across requests; change the signature to default
fastapi_background_tasks: BackgroundTasks | None = None and inside the function
do if fastapi_background_tasks is None: fastapi_background_tasks =
BackgroundTasks() so each request gets a fresh BackgroundTasks instance,
avoiding cross-request task accumulation.
| with open(file_path, encoding="utf-8") as f: | ||
| markdown_content = f.read() |
There was a problem hiding this comment.
Performance: Blocking I/O on async event loop.
Using open() for file reading is blocking and will stall the event loop. Use aiofiles for async file I/O.
Apply this diff:
+ import aiofiles
+
# For markdown files, read the content directly
- with open(file_path, encoding="utf-8") as f:
- markdown_content = f.read()
+ async with aiofiles.open(file_path, encoding="utf-8") as f:
+ markdown_content = await f.read()📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| with open(file_path, encoding="utf-8") as f: | |
| markdown_content = f.read() | |
| import aiofiles | |
| # For markdown files, read the content directly | |
| async with aiofiles.open(file_path, encoding="utf-8") as f: | |
| markdown_content = await f.read() |
🤖 Prompt for AI Agents
In surfsense_backend/app/routes/documents_routes.py around lines 734-735, the
code uses blocking open() to read the file which stalls the async event loop;
replace it with aiofiles async I/O: import aiofiles at the top, change the
blocking open to an async context manager (async with aiofiles.open(file_path,
mode="r", encoding="utf-8") as f) and await f.read() to get markdown_content,
and ensure the enclosing route handler is async; also add aiofiles to project
dependencies if not present.
| with open(file_path, "rb") as audio_file: | ||
| # Use LiteLLM for audio transcription |
There was a problem hiding this comment.
Performance: Blocking I/O on async event loop.
Using open() for file reading is blocking. Use aiofiles for async file I/O.
Apply this diff:
+ import aiofiles
+
# Open the audio file for transcription
- with open(file_path, "rb") as audio_file:
+ async with aiofiles.open(file_path, "rb") as audio_file:
+ audio_content = await audio_file.read()
+
# Use LiteLLM for audio transcription
transcription_kwargs: dict[str, object] = {
"model": app_config.STT_SERVICE,
- "file": audio_file,
+ "file": audio_content,
"api_key": app_config.STT_SERVICE_API_KEY,
}Note: Verify that atranscription accepts bytes content rather than file object.
Committable suggestion skipped: line range outside the PR's diff.
🤖 Prompt for AI Agents
In surfsense_backend/app/routes/documents_routes.py around lines 788 to 789, the
code uses a blocking open() to read the audio file; replace it with aiofiles to
perform async file I/O: open the file with aiofiles in binary mode, await
reading the file into a bytes variable, then pass those bytes to atranscription
(or if atranscription requires a file-like object, wrap the bytes in an
io.BytesIO before passing). Ensure imports for aiofiles (and io if using
BytesIO) are added and remove the blocking open usage.
| with open(file_path, "rb") as audio_file: | ||
| # Use LiteLLM for audio transcription | ||
| transcription_kwargs: dict[str, object] = { | ||
| "model": app_config.STT_SERVICE, | ||
| "file": audio_file, | ||
| "api_key": app_config.STT_SERVICE_API_KEY, | ||
| } | ||
|
|
||
| if app_config.STT_SERVICE_API_BASE: | ||
| transcription_kwargs["api_base"] = app_config.STT_SERVICE_API_BASE | ||
|
|
||
| transcription_response = await atranscription(**transcription_kwargs) | ||
|
|
||
| # Extract the transcribed text | ||
| transcribed_text = transcription_response.get("text", "") | ||
|
|
||
| if not transcribed_text: | ||
| raise ValueError("Transcription returned empty text") |
There was a problem hiding this comment.
🧩 Analysis chain
Verify atranscription API contract.
The code assumes atranscription returns a dict with a "text" key (Line 802). Ensure this matches the LiteLLM API contract for the configured STT service.
🏁 Script executed:
#!/bin/bash
# Search for other atranscription usages to confirm the API pattern
ast-grep --pattern $'atranscription($$$)'Length of output: 487
---
🏁 Script executed:
```shell
#!/bin/bash
# Examine the atranscription usage in file_processors.py
cat surfsense_backend/app/tasks/document_processors/file_processors.py | sed -n '520,540p'
Length of output: 802
🏁 Script executed:
#!/bin/bash
# Search for atranscription import
rg -n 'from.*atranscription|import.*atranscription' surfsense_backend/Length of output: 189
🏁 Script executed:
#!/bin/bash
# Search for atranscription definition or documentation
rg -nP '(def|async def)\s+atranscription|atranscription\s*=' surfsense_backend/Length of output: 0
🌐 Web query:
LiteLLM atranscription API response format documentation
💡 Result:
Short answer — LiteLLM exposes an audio transcription endpoint (including async variant names like "atranscription" in proxy config) and returns provider-normalized responses (usually OpenAI-compatible or provider-specific JSON). See these docs for formats and examples:
- Audio transcription overview + SDK/proxy usage (endpoint /v1/audio/transcriptions). Shows how to call transcription and that responses follow provider formats. [1]
- Example provider transcription response (ElevenLabs example JSON with text, task, language, words/timestamps). [2]
- LiteLLM general output/response format (OpenAI-compatible choices/message format used across completion-like endpoints). [3]
- Proxy caching docs showing supported call types include "atranscription". [4]
References
- LiteLLM — Audio transcription docs. [1] https://docs.litellm.ai/docs/audio_transcription
- LiteLLM — ElevenLabs transcription response example. [2] https://docs.litellm.ai/docs/providers/elevenlabs
- LiteLLM — Completion / output response format (OpenAI-compatible). [3] https://docs.litellm.ai/docs/
- LiteLLM — Proxy caching / supported_call_types (lists "atranscription"). [4] https://litellm.vercel.app/docs/proxy/caching
If you want, I can fetch a concrete sample JSON for the exact provider you’re using (OpenAI Whisper, Deepgram, ElevenLabs, etc.).
---
🏁 Script executed:
```shell
#!/bin/bash
# Search for STT_SERVICE configuration and usage
rg -n 'STT_SERVICE' surfsense_backend/ -A 2 -B 2
Length of output: 4228
🏁 Script executed:
#!/bin/bash
# Look for config file or environment documentation
fd -e '.env' -o -e 'config' -o -e '.md' surfsense_backend/ | head -20Length of output: 116
🏁 Script executed:
#!/bin/bash
# Search for documentation about supported providers
rg -n 'provider|transcription' surfsense_backend/ --type=py -l | head -10Length of output: 527
---
🏁 Script executed:
```shell
#!/bin/bash
# Examine the local STT service implementation
cat surfsense_backend/app/services/stt_service.py
Length of output: 3152
🏁 Script executed:
#!/bin/bash
# Check how the stt_service_type is used in file_processors
rg -n 'stt_service_type' surfsense_backend/app/tasks/document_processors/file_processors.py -A 10 -B 2Length of output: 1387
---
🏁 Script executed:
```shell
#!/bin/bash
# Get broader context around the code under review
cat surfsense_backend/app/routes/documents_routes.py | sed -n '770,810p'
Length of output: 1733
🏁 Script executed:
#!/bin/bash
# Check if there's a local vs external check in documents_routes
rg -n 'stt_service_type|STT_SERVICE.*startswith.*local' surfsense_backend/app/routes/documents_routes.py -B 5 -A 5Length of output: 0
Handle local STT models properly—do not pass local models to LiteLLM's atranscription.
The code assumes all STT services route through LiteLLM's atranscription, but the codebase supports both local (Faster-Whisper) and external providers. In file_processors.py, this distinction is handled correctly with a conditional check (lines 474-479). The code at line 788-805 lacks this branching and will fail when STT_SERVICE is configured as "local/base" or "local/tiny", as LiteLLM won't recognize local model identifiers.
Add a check to determine if STT_SERVICE starts with "local/" and route to stt_service.transcribe_file() instead, matching the pattern in file_processors.py.
🤖 Prompt for AI Agents
In surfsense_backend/app/routes/documents_routes.py around lines 788 to 805, the
code always calls LiteLLM's atranscription causing failures for local STT
models; add a conditional that checks if app_config.STT_SERVICE startswith
"local/" and in that case call the local STT handler await
stt_service.transcribe_file(file_path) (matching file_processors.py pattern),
otherwise open the file and call await atranscription(...) as before (including
api_base when present); then extract the transcribed text, validate it is
non-empty, and raise the same ValueError if transcription returns empty text.
| import { CircleAlert, CircleX, Columns3, Filter, ListFilter, Trash } from "lucide-react"; | ||
| import { AnimatePresence, motion, type Variants } from "motion/react"; | ||
| import React, { useMemo, useRef } from "react"; | ||
| import { useTranslations } from "next-intl"; |
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major
Incomplete localization coverage.
The search input placeholder and aria-label are translated, but numerous other user-facing strings remain hardcoded:
- "Type" button text (line 140)
- "Filters" label (line 156)
- Column labels: "Title", "Type", "Content", "Created At" (lines 213-216)
- "Toggle columns" (line 210)
- "Delete" button (line 244)
- Alert dialog: "Are you absolutely sure?", description text, "Cancel", "Delete" (lines 259-268)
For a comprehensive i18n implementation, all user-facing text should use translation keys.
Apply this pattern to translate the remaining strings:
- Type
+ {t('type_label')}- <div className="text-xs font-medium text-muted-foreground">Filters</div>
+ <div className="text-xs font-medium text-muted-foreground">{t('filters')}</div>Similarly for alert dialog content:
- <AlertDialogTitle>Are you absolutely sure?</AlertDialogTitle>
+ <AlertDialogTitle>{t('confirm_delete_title')}</AlertDialogTitle>Also applies to: 59-59, 95-97
🤖 Prompt for AI Agents
In
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx
around lines 6, 59, 95-97, 140, 156, 210, 213-216, 244 and 259-268 replace all
hardcoded user-facing strings with calls to the existing useTranslations hook
(e.g. t('documentsFilters.someKey')) following the same pattern used for the
search placeholder/aria-label; update the JSX for the "Type" button, "Filters"
label, "Toggle columns" label, the column headers ("Title", "Type", "Content",
"Created At"), the "Delete" button, and the alert dialog title, description and
action buttons to use translation keys; add corresponding keys and translated
values to the locale JSON files (or the project’s i18n resource) using clear
names (e.g. documentsFilters.typeButton, documentsFilters.filtersLabel,
documentsFilters.column.title, documentsFilters.dialog.confirmTitle, etc.);
ensure aria-labels and placeholders use translated strings too and run a quick
smoke test to confirm no missing translation keys.
|
|
||
| import { ChevronFirst, ChevronLast, ChevronLeft, ChevronRight } from "lucide-react"; | ||
| import { motion } from "motion/react"; | ||
| import { useTranslations } from "next-intl"; |
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major
Incomplete localization coverage.
The "rows per page" label is translated, but other user-facing text remains hardcoded:
- "of" text in the pagination summary (lines 78-81)
- Aria-labels for navigation buttons: "Go to first page", "Go to previous page", "Go to next page", "Go to last page" (lines 100, 118, 136, 154)
For comprehensive i18n, these strings should also use translation keys to support accessibility in multiple languages.
Apply translations to the remaining strings:
<span className="text-foreground">
{start}-{end}
</span>{" "}
- of <span className="text-foreground">{total}</span>
+ {t('of')} <span className="text-foreground">{total}</span>- aria-label="Go to first page"
+ aria-label={t('go_to_first_page')}Also applies to: 42-42, 55-55
🤖 Prompt for AI Agents
In
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx
(affecting lines 42, 55, 78-81, 100, 118, 136, 154), several user-facing strings
remain hardcoded and must use the existing next-intl translator: import and call
useTranslations() (already imported at line 5) to get t, replace the hardcoded
"of" in the pagination summary with t('pagination.of') (or similar key), and
replace all navigation aria-labels ("Go to first page", "Go to previous page",
"Go to next page", "Go to last page") with t('pagination.goToFirstPage'),
t('pagination.goToPreviousPage'), t('pagination.goToNextPage'),
t('pagination.goToLastPage') respectively; add corresponding keys to the locale
files and keep the rows-per-page label using t as already done.
| <TableCell colSpan={columns.length} className="h-24 text-center"> | ||
| {t('no_logs')} | ||
| </TableCell> | ||
| </TableRow> | ||
| )} |
There was a problem hiding this comment.
Fix colSpan to match the actual table columns.
Use the table instance rather than a static columns array.
- <TableCell colSpan={columns.length} className="h-24 text-center">
+ <TableCell colSpan={table.getAllColumns().length} className="h-24 text-center">📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <TableCell colSpan={columns.length} className="h-24 text-center"> | |
| {t('no_logs')} | |
| </TableCell> | |
| </TableRow> | |
| )} | |
| <TableCell colSpan={table.getAllColumns().length} className="h-24 text-center"> | |
| {t('no_logs')} | |
| </TableCell> | |
| </TableRow> | |
| )} |
🤖 Prompt for AI Agents
In surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx around
lines 1000-1004, the TableCell uses a static columns.length for colSpan which
can be incorrect; replace the static value with the table instance's visible
column count (e.g., use table.getVisibleFlatColumns().length or
table.getHeaderGroups()[0].headers.length) so colSpan reflects the actual
rendered columns, and ensure table is defined in scope before using it.
| import Link from "next/link"; | ||
| import React, { useEffect, useState } from "react"; | ||
| import { useTranslations } from "next-intl"; | ||
| import { Logo } from "@/components/Logo"; |
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major
Switch to locale-aware Link
To preserve the active locale, import the localized Link from your i18n routing helpers (or next-intl/navigation) and use it for internal routes.
- import Link from "next/link";
+ import { Link } from "@/i18n/routing"; // or "next-intl/navigation"Also applies to: 63-69, 161-167
🤖 Prompt for AI Agents
In surfsense_web/components/homepage/navbar.tsx around lines 4-7 (and also
update usages at 63-69 and 161-167), you're importing Link from "next/link"
which doesn't preserve the active locale; replace that with the locale-aware
Link from your i18n routing helpers (for example the Link exported by next-intl
or the localized Link from next-intl/navigation), update the import statement
accordingly, and change all internal route Link usages in the file to use that
localized Link so the active locale is preserved across navigation.
| {memoizedItems.map((item, index) => ( | ||
| <SidebarMenuItem key={`${item.title}-${index}`}> |
There was a problem hiding this comment.
Use stable key instead of index-based key.
The key ${item.title}-${index} violates the React key best practice. If items are reordered or titles are duplicated, React's reconciliation may break. Use a stable identifier like item.url instead.
As per coding guidelines.
Apply this diff:
- <SidebarMenuItem key={`${item.title}-${index}`}>
+ <SidebarMenuItem key={item.url}>🤖 Prompt for AI Agents
In surfsense_web/components/sidebar/nav-secondary.tsx around lines 37 to 38 the
list key uses `${item.title}-${index}`, which is unstable; replace the key with
a stable unique identifier such as `item.url` (or `item.id` if present) to
ensure consistent React reconciliation, e.g., use `key={item.url}` and ensure
the chosen field is unique for all items.
There was a problem hiding this comment.
@unitagain Thanks for this but some of your changes are reverting my recent updates. Could you please sync with the main branch first?
unitagain
force-pushed
the
feature/i18n-clean
branch
from
7b8a094 to
0f6a771
Compare
|
@MODSetter I've synced with the main branch and cleaned up the commit history. Changes made:
This PR now contains only the internationalization framework with no conflicts or reverted changes. Please review again. Thanks! 🙏 |
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (7)
surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx (1)
83-83: Translate the hardcoded error message.This error string is hardcoded in English and will appear in user-facing messages (lines 95, 97), breaking the bilingual experience. Replace it with a translation key to align with the comprehensive i18n goals of this PR.
Apply this diff:
- throw new Error("Failed to crawl URLs"); + throw new Error(t('error_crawl_failed'));Ensure that
error_crawl_failedis added to bothmessages/en.jsonandmessages/zh.jsonin theadd_webpagenamespace.surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (5)
403-429: Translate all toast messages in handleDeleteRows.The toast messages are hardcoded in English and should use the translation function for consistency with the rest of the i18n implementation.
Apply this diff to translate the messages:
const handleDeleteRows = async () => { const selectedRows = table.getSelectedRowModel().rows; if (selectedRows.length === 0) { - toast.error("No rows selected"); + toast.error(t('no_rows_selected')); return; } const deletePromises = selectedRows.map((row) => deleteLog(row.original.id)); try { const results = await Promise.all(deletePromises); const allSuccessful = results.every((result) => result === true); if (allSuccessful) { - toast.success(`Successfully deleted ${selectedRows.length} log(s)`); + toast.success(t('delete_success', { count: selectedRows.length })); } else { - toast.error("Some logs could not be deleted"); + toast.error(t('delete_partial_error')); } await refreshLogs(); table.resetRowSelection(); } catch (error: any) { console.error("Error deleting logs:", error); - toast.error("Error deleting logs"); + toast.error(t('delete_error')); } };
431-434: Translate the refresh success message.The toast message should use the translation function.
Apply this diff:
const handleRefresh = async () => { await Promise.all([refreshLogs(), refreshSummary()]); - toast.success("Logs refreshed"); + toast.success(t('refresh_success')); };
856-891: Translate loading and error state messages.The loading spinner text, error message, and retry button label are hardcoded and should use the translation function.
Apply this diff:
if (loading) { return ( <motion.div className="rounded-md border" initial={{ opacity: 0, y: 20 }} animate={{ opacity: 1, y: 0 }} > <div className="flex h-[400px] w-full items-center justify-center"> <div className="flex flex-col items-center gap-2"> <div className="h-8 w-8 animate-spin rounded-full border-b-2 border-primary"></div> - <p className="text-sm text-muted-foreground">Loading logs...</p> + <p className="text-sm text-muted-foreground">{t('loading')}</p> </div> </div> </motion.div> ); } if (error) { return ( <motion.div className="rounded-md border" initial={{ opacity: 0, y: 20 }} animate={{ opacity: 1, y: 0 }} > <div className="flex h-[400px] w-full items-center justify-center"> <div className="flex flex-col items-center gap-2"> <AlertCircle className="h-8 w-8 text-destructive" /> - <p className="text-sm text-destructive">Error loading logs</p> + <p className="text-sm text-destructive">{t('error_loading')}</p> <Button variant="outline" size="sm" onClick={onRefresh}> - Retry + {t('retry')} </Button> </div> </div> </motion.div> ); }
1051-1061: Translate the pagination display text.The "of" text in the pagination display is hardcoded and should be translated for consistency.
Apply this diff:
> <p className="whitespace-nowrap text-sm text-muted-foreground"> <span className="text-foreground"> {table.getState().pagination.pageIndex * table.getState().pagination.pageSize + 1}- {Math.min( table.getState().pagination.pageIndex * table.getState().pagination.pageSize + table.getState().pagination.pageSize, table.getRowCount() )} </span>{" "} - of <span className="text-foreground">{table.getRowCount()}</span> + {t('of')} <span className="text-foreground">{table.getRowCount()}</span> </p> </motion.div>
126-173: Translate hardcoded strings in MessageDetails component.The "Log details" title and "Close" button text are hardcoded and should use translations. Consider adding a translation function parameter to this component.
You'll need to:
- Add
tas a prop to MessageDetails- Pass
tfrom the column cell renderer (line 275-294)- Use
t()for the hardcoded stringsApply this diff:
function MessageDetails({ message, taskName, metadata, createdAt, children, + t, }: { message: string; taskName?: string; metadata?: any; createdAt?: string; children: React.ReactNode; + t: (key: string) => string; }) { return ( <AlertDialog> <AlertDialogTrigger asChild>{children}</AlertDialogTrigger> <AlertDialogContent className="max-w-3xl w-full"> <div className="flex items-start justify-between gap-4"> <div> - <AlertDialogTitle className="text-lg">Log details</AlertDialogTitle> + <AlertDialogTitle className="text-lg">{t('log_details')}</AlertDialogTitle> {createdAt && ( <p className="text-xs text-muted-foreground mt-1"> {new Date(createdAt).toLocaleString()} </p> )} </div> <div className="shrink-0"> - <AlertDialogCancel className="text-sm">Close</AlertDialogCancel> + <AlertDialogCancel className="text-sm">{t('close')}</AlertDialogCancel> </div> </div>Then update the usage in the column definition (around line 275):
return ( <MessageDetails message={message} taskName={taskName} metadata={row.original.log_metadata} createdAt={createdAt} + t={t} >surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
215-233: Localize remaining English strings in the periodic-indexing UX.Several user-visible strings are untranslated (toasts, statuses, labels, preview text, ARIA). Replace literals with t/tCommon keys.
Examples (apply pattern elsewhere in these ranges):
- toast.error("Please enter a valid frequency in minutes"); + toast.error(t('enter_valid_frequency_minutes')); - : "Enabled"} + : t('enabled')} - <span className="text-sm text-muted-foreground">Disabled</span> + <span className="text-sm text-muted-foreground">{t('disabled')}</span> - <span className="sr-only">Configure Periodic Indexing</span> + <span className="sr-only">{t('configure_periodic_indexing')}</span> - <DialogTitle>Configure Periodic Indexing</DialogTitle> + <DialogTitle>{t('configure_periodic_indexing')}</DialogTitle> - Set up automatic indexing at regular intervals for this connector. + {t('configure_periodic_indexing_desc')} - <Label htmlFor="frequency">Indexing Frequency</Label> + <Label htmlFor="frequency">{t('indexing_frequency')}</Label> - <SelectValue placeholder="Select frequency" /> + <SelectValue placeholder={t('select_frequency')} /> - <SelectItem value="15">Every 15 minutes</SelectItem> + <SelectItem value="15">{t('every_n_minutes', {n: 15})}</SelectItem> ... (repeat for other presets) - <Label htmlFor="custom-frequency">Custom Frequency (minutes)</Label> + <Label htmlFor="custom-frequency">{t('custom_frequency_minutes')}</Label> - placeholder="Enter minutes" + placeholder={t('enter_minutes')} - Enter the number of minutes between each indexing run + {t('minutes_between_runs')} - <p className="font-medium mb-1">Preview:</p> + <p className="font-medium mb-1">{t('preview')}</p> - Will run every ${customFrequency} minutes + {t('will_run_every_n_minutes', {n: customFrequency})} ... (repeat for other preview lines) - Cancel + {tCommon('cancel')} - Save Configuration + {t('save_configuration')} - toast.success( - periodicEnabled ? "Periodic indexing enabled successfully" : "Periodic indexing disabled successfully" - ); + toast.success(periodicEnabled ? t('periodic_enabled_success') : t('periodic_disabled_success'));Also applies to: 329-351, 413-418, 590-671, 684-689
♻️ Duplicate comments (2)
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
998-1004: Fix colSpan to match the actual table columns.This issue was previously flagged. The
colSpanuses the staticcolumnsarray length, but the table instance should be used to get the actual column count.Apply this diff:
) : ( <TableRow> - <TableCell colSpan={columns.length} className="h-24 text-center"> + <TableCell colSpan={table.getAllColumns().length} className="h-24 text-center"> {t('no_logs')} </TableCell> </TableRow> )}surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
69-81: Use active locale for date/time formatting (duplicate of prior review).formatDateTime still hardcodes "en-US". Use next-intl’s useFormatter() to respect the selected locale.
- import { useTranslations } from "next-intl"; + import { useTranslations, useFormatter } from "next-intl"; @@ export default function ConnectorsPage() { - const t = useTranslations('connectors'); + const t = useTranslations('connectors'); + const fmt = useFormatter(); @@ - const formatDateTime = (dateString: string | null): string => { + const formatDateTime = (dateString: string | null): string => { if (!dateString) return t('never'); - const date = new Date(dateString); - return new Intl.DateTimeFormat("en-US", { - year: "numeric", - month: "short", - day: "numeric", - hour: "2-digit", - minute: "2-digit", - }).format(date); + const date = new Date(dateString); + return fmt.dateTime(date, {dateStyle: "medium", timeStyle: "short"}); };
🧹 Nitpick comments (10)
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
322-323: Consider removing the backward-compatible default columns array.The
columnsarray appears to be used only at line 1000 forcolSpan={columns.length}. Since the component now exclusively usestranslatedColumnsfor the actual table, this default array seems unnecessary. Consider removing it and updating line 1000 to usetable.getAllColumns().lengthinstead.Apply this diff:
-// Default columns for backward compatibility -const columns: ColumnDef<Log>[] = createColumns((key) => key); -And update line 1000 as shown in a separate comment below.
surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx (1)
41-57: Good use of memoization, but consider the title-to-key transformation.The
useMemohooks properly optimize the translation of navigation items. However, the transformation at line 44 uses.toLowerCase().replace(/ /g, '_')to convert titles to translation keys. This approach is brittle because:
- It assumes the original titles match expected patterns
- Special characters or punctuation would break the mapping
- If a nav title changes, the translation key lookup silently fails
For more robustness, consider:
- Explicitly mapping title identifiers to translation keys
- Adding a fallback to the original title if translation is missing
- Using a dedicated
translationKeyproperty on nav itemsExample approach:
const translatedNavMain = useMemo(() => { return navMain.map((item) => ({ ...item, - title: tNavMenu(item.title.toLowerCase().replace(/ /g, '_')), + title: tNavMenu(item.translationKey || item.title.toLowerCase().replace(/ /g, '_')), items: item.items?.map((subItem: any) => ({ ...subItem, - title: tNavMenu(subItem.title.toLowerCase().replace(/ /g, '_')), + title: tNavMenu(subItem.translationKey || subItem.title.toLowerCase().replace(/ /g, '_')), })), })); }, [navMain, tNavMenu]);Alternatively, add error handling to detect missing translations in development.
surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
500-502: Localize calendar button date labels.format(..., "PPP") renders in English. Use next-intl formatter for locale-aware display.
- {startDate ? format(startDate, "PPP") : t('pick_date')} + {startDate ? fmt.dateTime(startDate, {dateStyle: "medium"}) : t('pick_date')} @@ - {endDate ? format(endDate, "PPP") : t('pick_date')} + {endDate ? fmt.dateTime(endDate, {dateStyle: "medium"}) : t('pick_date')}Also applies to: 526-528
surfsense_web/components/sidebar/nav-main.tsx (2)
63-112: Use stable keys and locale-aware Link; localize ARIA text.
- Keys should be stable/unique; avoid index. Use URLs.
- Use locale-aware Link from i18n/routing, not plain .
- Localize “with submenu” and “Toggle submenu”.
As per coding guidelines.
- import { useTranslations } from "next-intl"; + import { useTranslations } from "next-intl"; + import { Link } from "@/i18n/routing"; @@ - {memoizedItems.map((item, index) => { + {memoizedItems.map((item) => { @@ - <Collapsible key={`${item.title}-${index}`} asChild defaultOpen={item.isActive}> + <Collapsible key={item.url} asChild defaultOpen={item.isActive}> @@ - aria-label={`${translatedTitle}${item.items?.length ? " with submenu" : ""}`} + aria-label={ + `${translatedTitle}${item.items?.length ? ` ${t('with_submenu')}` : ""}` + } @@ - <a href={item.url}> + <Link href={item.url}> <item.icon /> <span>{translatedTitle}</span> - </a> + </Link> @@ - aria-label={`Toggle ${translatedTitle} submenu`} + aria-label={t('toggle_submenu', {title: translatedTitle})} @@ - <span className="sr-only">Toggle submenu</span> + <span className="sr-only">{t('toggle_submenu', {title: translatedTitle})}</span> @@ - {item.items?.map((subItem, subIndex) => { + {item.items?.map((subItem) => { @@ - <SidebarMenuSubItem key={`${subItem.title}-${subIndex}`}> + <SidebarMenuSubItem key={subItem.url}> @@ - <a href={subItem.url}> + <Link href={subItem.url}> <span>{translatedSubTitle}</span> - </a> + </Link>Verification: ensure nav_menu has keys with_submenu and toggle_submenu(title). If not, add them.
35-55: Avoid brittle title-to-key mapping; prefer explicit i18n keys.translateTitle relies on English titles. Pass an i18nKey on items (or build menu from keys) and resolve via t(i18nKey). Safer and easier to maintain.
surfsense_web/app/(home)/login/LocalLoginForm.tsx (1)
62-66: Localize remaining literals and use locale-aware Link.Replace hard-coded text with translations; use i18n Link for routing.
- toast.success(t('login_success'), { - id: loadingToast, - description: "Redirecting to dashboard...", + toast.success(t('login_success'), { + id: loadingToast, + description: t('redirecting_dashboard'), duration: 2000, }); @@ - toastOptions.action = { label: "Retry", onClick: () => handleSubmit(e) }; + toastOptions.action = { label: tCommon('retry'), onClick: () => handleSubmit(e) }; @@ - aria-label="Dismiss error" + aria-label={tCommon('dismiss_error')} @@ - <title>Close</title> + <title>{tCommon('close')}</title> @@ - import Link from "next/link"; + import { Link } from "@/i18n/routing";Additionally, consider localizing getAuthErrorDetails outputs by returning keys per error code and resolving via t(). I can sketch that refactor if desired.
Also applies to: 99-101, 151-166, 242-247
surfsense_web/components/sidebar/AppSidebarProvider.tsx (1)
101-118: Translate chat item labels and fallbacks.Use i18n for action label and chat fallback name.
- name: chat.title || `Chat ${chat.id}`, + name: chat.title || t('chat_with_id', {id: chat.id}), @@ - { - name: "Delete", + { + name: tCommon('delete'), icon: "Trash2",surfsense_web/i18n/routing.ts (1)
8-18: Routing config looks correct; optional typing tweak.Config is valid for en/zh with as-needed prefix. Optionally type locales as const and export a Locale type for stronger typing.
-export const routing = defineRouting({ - locales: ['en', 'zh'], +const locales = ['en', 'zh'] as const; +export type Locale = (typeof locales)[number]; +export const routing = defineRouting({ + locales, defaultLocale: 'en', localePrefix: 'as-needed' });Also applies to: 22-23
surfsense_web/contexts/LocaleContext.tsx (2)
40-54: Consider consolidating HTML lang attribute updates.The HTML lang attribute is updated in two places: directly in
setLocale(line 45) and in the useEffect (line 52). WhensetLocaleis explicitly called, this results in two consecutive DOM updates. While not a bug, you could optimize by removing line 45 and relying solely on the useEffect for all lang attribute updates.const setLocale = (newLocale: Locale) => { setLocaleState(newLocale); if (typeof window !== 'undefined') { localStorage.setItem(LOCALE_STORAGE_KEY, newLocale); - // Update HTML lang attribute - document.documentElement.lang = newLocale; } };
29-54: Redundant window checks in useEffect.The
typeof window !== 'undefined'checks on lines 31, 42, and 51 are technically unnecessary sinceuseEffectonly runs in the browser wherewindowis always defined. While this is a common defensive pattern and doesn't cause issues, these checks can be safely removed.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (34)
surfsense_web/.gitignore(1 hunks)surfsense_web/app/(home)/login/GoogleLoginButton.tsx(4 hunks)surfsense_web/app/(home)/login/LocalLoginForm.tsx(4 hunks)surfsense_web/app/(home)/login/page.tsx(4 hunks)surfsense_web/app/(home)/register/page.tsx(10 hunks)surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx(7 hunks)surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx(20 hunks)surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx(13 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx(12 hunks)surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx(33 hunks)surfsense_web/app/dashboard/[search_space_id]/onboard/page.tsx(8 hunks)surfsense_web/app/dashboard/page.tsx(13 hunks)surfsense_web/app/layout.tsx(2 hunks)surfsense_web/components/LanguageSwitcher.tsx(1 hunks)surfsense_web/components/dashboard-breadcrumb.tsx(7 hunks)surfsense_web/components/onboard/add-provider-step.tsx(9 hunks)surfsense_web/components/onboard/assign-roles-step.tsx(8 hunks)surfsense_web/components/sidebar/AppSidebarProvider.tsx(9 hunks)surfsense_web/components/sidebar/nav-main.tsx(2 hunks)surfsense_web/components/sidebar/nav-projects.tsx(5 hunks)surfsense_web/components/sidebar/nav-secondary.tsx(2 hunks)surfsense_web/contexts/LocaleContext.tsx(1 hunks)surfsense_web/i18n/request.ts(1 hunks)surfsense_web/i18n/routing.ts(1 hunks)surfsense_web/messages/en.json(1 hunks)surfsense_web/messages/zh.json(1 hunks)surfsense_web/middleware.ts(1 hunks)surfsense_web/next.config.ts(2 hunks)
✅ Files skipped from review due to trivial changes (1)
- surfsense_web/messages/zh.json
🚧 Files skipped from review as they are similar to previous changes (17)
- surfsense_web/components/onboard/add-provider-step.tsx
- surfsense_web/components/sidebar/nav-projects.tsx
- surfsense_web/middleware.ts
- surfsense_web/.gitignore
- surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx
- surfsense_web/app/(home)/login/page.tsx
- surfsense_web/next.config.ts
- surfsense_web/app/(home)/login/GoogleLoginButton.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx
- surfsense_web/i18n/request.ts
- surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx
- surfsense_web/app/dashboard/page.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx
- surfsense_web/components/sidebar/nav-secondary.tsx
- surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx
- surfsense_web/components/LanguageSwitcher.tsx
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{jsx,tsx}
📄 CodeRabbit inference engine (.rules/require_unique_id_props.mdc)
**/*.{jsx,tsx}: When mapping arrays to React elements in JSX/TSX, each rendered element must include a unique key prop
Keys used for React list items should be stable, predictable, and unique among siblings
Files:
surfsense_web/app/(home)/register/page.tsxsurfsense_web/app/dashboard/[search_space_id]/client-layout.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsxsurfsense_web/components/onboard/assign-roles-step.tsxsurfsense_web/app/(home)/login/LocalLoginForm.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsxsurfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsxsurfsense_web/components/dashboard-breadcrumb.tsxsurfsense_web/app/dashboard/[search_space_id]/onboard/page.tsxsurfsense_web/components/sidebar/nav-main.tsxsurfsense_web/contexts/LocaleContext.tsxsurfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsxsurfsense_web/components/sidebar/AppSidebarProvider.tsxsurfsense_web/app/layout.tsx
🧬 Code graph analysis (5)
surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx (2)
surfsense_web/components/LanguageSwitcher.tsx (1)
LanguageSwitcher(18-55)surfsense_web/components/theme/theme-toggle.tsx (1)
ThemeTogglerComponent(9-71)
surfsense_web/components/onboard/assign-roles-step.tsx (1)
surfsense_web/hooks/use-llm-configs.ts (2)
useLLMConfigs(50-190)useLLMPreferences(192-285)
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
surfsense_web/hooks/use-logs.ts (1)
Log(8-17)
surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
surfsense_web/hooks/use-connectors.ts (1)
deleteConnector(116-131)
surfsense_web/app/layout.tsx (2)
surfsense_web/contexts/LocaleContext.tsx (1)
LocaleProvider(19-61)surfsense_web/components/theme/theme-provider.tsx (1)
ThemeProvider(6-8)
🔇 Additional comments (18)
surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx (1)
8-8: Excellent i18n implementation!The component correctly implements next-intl throughout, with proper namespace scoping (
add_webpage), translation hook initialization, and comprehensive coverage of all user-facing strings including titles, labels, placeholders, hints, tips, and button text. The translation calls with interpolation (e.g., line 50) are well-structured.Also applies to: 24-24, 137-177, 187-196
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (4)
537-662: LGTM! Well-implemented i18n for summary dashboard.The LogsSummaryDashboard component properly uses translations throughout, including parameterized translations for dynamic values like
last_hoursandsuccessful. The error states and loading states are also correctly localized.
664-765: LGTM! Filters properly localized.The LogsFilters component correctly implements i18n support, translating all filter labels and passing the translation function to child components.
767-836: LGTM! FilterDropdown correctly localized.The component properly accepts and uses the translation function for the filter label.
1114-1186: LGTM! Row actions properly localized.The LogRowActions component correctly uses translations for all user-facing strings including toast messages, menu items, and confirmation dialog text.
surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx (1)
27-27: LGTM! Clean i18n integration.The translation integration is well-implemented with the
useTranslations('add_youtube')hook. All user-facing strings are properly localized, including error messages, toasts, labels, and button text. The mapped video preview elements at lines 234-254 correctly includekey={tag.id}props.Also applies to: 52-291
surfsense_web/components/onboard/assign-roles-step.tsx (2)
26-52: LGTM! Well-structured i18n integration.The role descriptions are properly internationalized, and the translation keys are cleanly organized. The dynamic object construction from translation keys is a good approach for maintaining type safety while supporting multiple languages.
134-212: LGTM! Proper key props in mapped elements.Both mapped arrays correctly include key props:
- Line 134: Role cards with
key={key}- Line 230: Progress indicators with
key={key}The translation interpolation at lines 242-245 using
{assigned}and{total}parameters follows next-intl conventions correctly.Also applies to: 230-246
surfsense_web/app/dashboard/[search_space_id]/onboard/page.tsx (2)
20-20: LGTM! Consistent i18n implementation.The onboarding page properly uses translations for all UI strings including step titles, descriptions, and navigation labels. The translation integration is clean and maintains the existing logic flow.
Also applies to: 72-78, 109-142
146-177: LGTM! Proper key prop in mapped step indicators.The step indicators correctly use
key={stepNum}at line 152 for the mapped array elements.surfsense_web/app/layout.tsx (1)
82-111: Consider hydration implications of hardcoded HTML lang attribute.The HTML
langattribute is hardcoded to"en"at line 91, while the locale can dynamically change viaLocaleContext. Based on the context snippet fromLocaleContext.tsx, the lang attribute is updated client-side when the locale changes. However, this creates a potential hydration mismatch:
- Server renders with
lang="en"- Client may have a different locale stored in localStorage
- LocaleContext updates the lang attribute after mount
While this works, users with
zhlocale preference will briefly seelang="en"before it updates. Since you're usingsuppressHydrationWarningon the html element, this is intentionally handled.If you want to verify the hydration behavior is smooth, you can test:
- Set locale to 'zh' and reload the page
- Check if there's any visible flash or layout shift during hydration
surfsense_web/messages/en.json (1)
1-692: LGTM! Well-organized translation structure.The English translation file is comprehensive and well-structured with clear namespace organization (common, auth, dashboard, researcher, documents, etc.). The keys follow a consistent naming convention and cover all UI strings mentioned in the PR objectives.
surfsense_web/components/dashboard-breadcrumb.tsx (2)
21-148: LGTM! Comprehensive breadcrumb internationalization.All breadcrumb labels are properly localized, including section names, document types, and connector types. The translation key lookups are well-structured and maintain the existing breadcrumb generation logic.
159-170: LGTM! Proper key prop with acceptable index usage.The mapped breadcrumb elements correctly include
key={index}at line 160. While using array indices as keys is generally discouraged, it's acceptable here since breadcrumbs are derived from the URL path and don't reorder dynamically.surfsense_web/app/(home)/register/page.tsx (1)
14-15: LGTM! Complete i18n coverage for registration flow.All user-facing strings are properly localized, including form labels, validation errors, toast messages, and loading states. The translation integration preserves the existing validation logic and error handling patterns.
Also applies to: 32-143
surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx (1)
147-150: LGTM! Language switcher integration.The
LanguageSwitcheris properly added to the header alongside the theme toggle, providing easy access to language preferences.surfsense_web/components/sidebar/AppSidebarProvider.tsx (1)
197-233: Solid fallback logic and state handling. LGTM.Fallbacks for error/no data and dependency arrays include t/tCommon to update on locale changes.
surfsense_web/contexts/LocaleContext.tsx (1)
19-61: Excellent i18n implementation with proper hydration handling.The LocaleProvider correctly avoids hydration mismatches by initializing with 'en' and syncing with localStorage after mount. The HTML lang attribute updates ensure proper accessibility support. The implementation is clean, type-safe, and handles all critical aspects of client-side locale management.
| setError(error.message || t('error_generic')); | ||
| toast(t('error_toast'), { | ||
| description: `${t('error_toast_desc')}: ${error.message}`, | ||
| }); |
There was a problem hiding this comment.
🧩 Analysis chain
Verify handling of untranslated error messages.
The error handling mixes translated strings with raw error.message, which may contain untranslated backend or JavaScript error text. For example, line 97 displays ${t('error_toast_desc')}: ${error.message}, where error.message might be in English regardless of the user's selected language, breaking the bilingual experience.
Consider one of the following approaches:
- Map known backend error messages to translation keys
- Use a generic translated error message without exposing
error.messageto the user, and log the technical details for debugging
🏁 Script executed:
#!/bin/bash
# Examine the actual file content to verify the concerns raised
if [ -d ".git" ]; then
FILE_PATH="surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx"
else
FILE_PATH="surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx"
fi
# Extract lines around the error handling (lines 75-105 to get context)
echo "=== Lines 75-105 (error handling context) ==="
sed -n '75,105p' "$FILE_PATH" | cat -n | sed 's/^[[:space:]]*//' | awk '{print NR+74": "$0}'
echo ""
echo "=== Full file to identify all hardcoded strings ==="
# Search for hardcoded error messages and Failed patterns
rg -n 'Failed to crawl|error\.message' "$FILE_PATH" -A 2 -B 2
echo ""
echo "=== Check for i18n error handling patterns ==="
# Look for how errors are being handled with translations
rg -n 'setError|toast.*error|t\(' "$FILE_PATH" | head -20Length of output: 2359
Untranslated error messages break the bilingual user experience.
The error handling mixes translated UI strings with raw error.message, which will contain untranslated text. For example:
- Line 83 throws an English-only error:
"Failed to crawl URLs" - Line 97 displays it as:
${t('error_toast_desc')}: ${error.message}— mixing translated and untranslated text
This contradicts the i18n approach used for validation errors elsewhere (lines 43, 50), where translation keys are properly used.
Recommended solutions:
- Create translation keys for backend errors and map them in the catch block
- Use a generic translated error message and log technical details server-side for debugging
🤖 Prompt for AI Agents
In surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx
around lines 95-98 the UI mixes translated strings with raw error.message
(untranslated), breaking bilingual UX; replace usage of error.message in
setError/toast with translation keys by mapping known backend error
codes/messages to i18n keys (or fall back to a generic t('error_generic')
message), add the corresponding translation keys, and send the original error
details to logs/monitoring (or console.error) instead of displaying them to
users so the UI only shows translated text.
|
@unitagain Can you also update dependencies. I think you forgot to add next-intl/plugin in package.json |
|
@unitagain and also getting this err after installing it 
|
unitagain
force-pushed
the
feature/i18n-clean
branch
from
0f6a771 to
378aac7
Compare
|
@MODSetter Thanks for catching that! I've added the missing files and dependencies: Fixed:
Files added in this update:
The Please try again! The build should work now. 🙏 |
There was a problem hiding this comment.
Actionable comments posted: 3
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (5)
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx (1)
184-184: Translate the "Created At" header.Line 184 contains the hardcoded string "Created At" that should be translated for consistency with the other column headers.
Apply this diff:
- Created At + {t('created_at')}Add the corresponding key to your locale JSON files (e.g.,
"created_at": "Created At"in en.json).surfsense_web/app/(home)/login/page.tsx (1)
192-192: Translate the hardcoded loading text in LoadingFallback.Line 192 contains a hardcoded "Loading..." string in the LoadingFallback component. For consistency, this should also use the translated loading text.
Apply this diff:
+// Import at the top with other client-side hooks +const LoadingFallback = () => { + const tCommon = useTranslations('common'); + return ( <div className="relative w-full overflow-hidden"> <AmbientBackground /> <div className="mx-auto flex h-screen max-w-lg flex-col items-center justify-center"> <Logo className="rounded-md" /> <div className="mt-8 flex items-center space-x-2"> <Loader2 className="h-5 w-5 animate-spin text-muted-foreground" /> - <span className="text-muted-foreground">Loading...</span> + <span className="text-muted-foreground">{tCommon('loading')}</span> </div> </div> </div> + ); +}; - </div> -);surfsense_web/components/onboard/add-provider-step.tsx (1)
58-63: Localize the validation toast.Replace hard-coded English with a translation key.
- if (!formData.name || !formData.provider || !formData.model_name || !formData.api_key) { - toast.error("Please fill in all required fields"); + if (!formData.name || !formData.provider || !formData.model_name || !formData.api_key) { + toast.error(t('fill_required_fields')) return; }Aligns with the proposed onboard.fill_required_fields message.
surfsense_web/components/dashboard-breadcrumb.tsx (1)
97-106: Localize breadcrumb labels inside connector-type branch.Two labels are hard-coded; use t() for consistency.
- breadcrumbs.push({ - label: "Connectors", + breadcrumbs.push({ + label: t('connectors'), href: `/dashboard/${segments[1]}/connectors`, }); - breadcrumbs.push({ - label: "Add Connector", + breadcrumbs.push({ + label: t('add_connector'), href: `/dashboard/${segments[1]}/connectors/add`, });surfsense_web/app/(home)/register/page.tsx (1)
70-82: Translate the registration disabled error messages.Lines 71-75 contain hardcoded English strings that are not translated, creating an inconsistent experience for non-English users. These messages should use the translation system like the rest of the file.
Apply this diff:
if (!response.ok && response.status === 403) { - const friendlyMessage = - "Registrations are currently closed. If you need access, contact your administrator."; - setErrorTitle("Registration is disabled"); + const friendlyMessage = t('registration_closed'); + setErrorTitle(t('registration_disabled')); setError(friendlyMessage); - toast.error("Registration is disabled", { + toast.error(t('registration_disabled'), { id: loadingToast, description: friendlyMessage, duration: 6000, });Ensure the corresponding keys (
registration_closed,registration_disabled) exist in your translation files (messages/en.json and messages/zh.json).
♻️ Duplicate comments (3)
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx (1)
6-6: Incomplete localization coverage persists.The search input placeholder and aria-label are translated, but the following user-facing strings remain hardcoded:
- "Type" button text (line 140)
- "Filters" label (line 156)
- "Toggle columns" (line 210)
- Column labels: "Title", "Type", "Content", "Created At" (lines 213-216)
- "Delete" button (line 244)
- Alert dialog: "Are you absolutely sure?", description text, "Cancel", "Delete" (lines 259-268)
- "Clear filter" aria-label (line 110)
For a comprehensive i18n implementation, all user-facing text should use translation keys.
Apply translation keys to the remaining strings following the same pattern used for the search placeholder. Add corresponding keys to your locale JSON files.
Also applies to: 59-59, 95-97
surfsense_web/app/(home)/login/page.tsx (1)
40-41: Translate the hardcoded logout message.Line 41 contains a hardcoded string
"You have been securely logged out"that should be translated for consistency with the rest of the i18n implementation. This was flagged in a previous review and remains unresolved.Apply this diff:
if (logout === "true") { toast.success(tCommon('success'), { - description: "You have been securely logged out", + description: t('logout_description'), duration: 3000, }); }Add
"logout_description": "You have been securely logged out"to the auth namespace in your message files.surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
1000-1004: Fix colSpan to match the actual table columns.This issue was previously flagged. The
colSpanuses the staticcolumns.lengthwhich doesn't reflect the actual rendered columns (some may be hidden). Use the table instance's column count instead.Apply this diff:
-<TableCell colSpan={columns.length} className="h-24 text-center"> +<TableCell colSpan={table.getAllColumns().length} className="h-24 text-center"> {t('no_logs')} </TableCell>Alternatively, use
table.getVisibleFlatColumns().lengthto only span visible columns.
🧹 Nitpick comments (11)
surfsense_web/app/layout.tsx (1)
91-91: Consider SSR-setting the HTML lang for SEO/a11y.You set html lang="en" and update it client-side via LocaleContext. For better SEO/crawlers and a11y, consider deriving the initial lang on the server (from cookie/header) and rendering it on to avoid suppressHydrationWarning reliance.
surfsense_web/messages/en.json (4)
278-283: Use ICU pluralization for delete count.Avoid “document(s)”. Prefer ICU for correct singular/plural handling.
- "delete_success_count": "Successfully deleted {count} document(s)", + "delete_success_count": "Successfully deleted {count, plural, one {# document} other {# documents}}",Usage stays: t('delete_success_count', {count: okCount})
140-142: Standardize “YouTube” casing (brand).Fix inconsistent “Youtube”.
- "add_youtube": "Add Youtube Videos", - "add_youtube_videos": "Add Youtube Videos", + "add_youtube": "Add YouTube Videos", + "add_youtube_videos": "Add YouTube Videos",
151-156: Minor grammar fix in pricing subtitle.Improve readability.
- "subtitle": "Choose that works for you", + "subtitle": "Choose a plan that works for you",
521-571: Add a reusable error string for required fields.Needed by AddProviderStep toast; keeps errors localized.
"onboard": { + "fill_required_fields": "Please fill in all required fields", "welcome_title": "Welcome to SurfSense",surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx (1)
63-68: Add error handling for type count fetch.Prevent unhandled rejections and allow graceful UI.
useEffect(() => { if (searchSpaceId && getDocumentTypeCounts) { - getDocumentTypeCounts().then(setTypeCounts); + void getDocumentTypeCounts() + .then(setTypeCounts) + .catch(() => setTypeCounts({})); } }, [searchSpaceId, getDocumentTypeCounts]);surfsense_web/components/dashboard-breadcrumb.tsx (2)
159-170: Avoid index as React key; use a stable key.Use href or a composite to keep keys stable and predictable.
- {breadcrumbs.map((item, index) => ( - <React.Fragment key={index}> + {breadcrumbs.map((item, index) => ( + <React.Fragment key={item.href ?? `${item.label}-${index}`}>As per coding guidelines.
33-35: Make “Search Space {id}” translatable.Avoid string concatenation so languages can reorder tokens.
- breadcrumbs.push({ label: `${t('search_space')} ${segments[1]}`, href: `/dashboard/${segments[1]}` }); + breadcrumbs.push({ + label: t('search_space_with_id', { id: segments[1] }), + href: `/dashboard/${segments[1]}` + });Add to en.json:
"breadcrumb": { + "search_space_with_id": "Search Space {id}", ... }surfsense_web/components/LanguageSwitcher.tsx (2)
22-25: Consider moving the languages array outside the component.The
languagesarray is currently defined inside the component body, causing it to be recreated on every render. Since this configuration is static, move it outside the component to avoid unnecessary allocations.Apply this diff:
+// Supported languages configuration +const LANGUAGES = [ + {code: 'en' as const, name: 'English', flag: '🇺🇸'}, + {code: 'zh' as const, name: '简体中文', flag: '🇨🇳'}, +] as const; + export function LanguageSwitcher() { const {locale, setLocale} = useLocaleContext(); - // Supported languages configuration - const languages = [ - {code: 'en' as const, name: 'English', flag: '🇺🇸'}, - {code: 'zh' as const, name: '简体中文', flag: '🇨🇳'}, - ];And update the references to use
LANGUAGESinstead oflanguages.
31-33: Wrap handleLanguageChange in useCallback.The handler function is recreated on every render. Wrap it in
useCallbackto maintain referential stability.Apply this diff:
+import {useLocaleContext} from '@/contexts/LocaleContext'; +import {useCallback} from 'react'; + /** * Handle language change * Updates locale in context and localStorage */ -const handleLanguageChange = (newLocale: string) => { +const handleLanguageChange = useCallback((newLocale: string) => { setLocale(newLocale as 'en' | 'zh'); -}; +}, [setLocale]);surfsense_web/components/sidebar/nav-main.tsx (1)
36-54: Move titleMap outside the component and memoize translateTitle.The
titleMapobject is currently recreated on every render. Move it outside the component as a constant. Additionally, thetranslateTitlefunction should be wrapped inuseCallbackor moved outside to avoid unnecessary recreations.Apply this diff:
+// Title to translation key mapping +const TITLE_KEY_MAP: Record<string, string> = { + 'Researcher': 'researcher', + 'Manage LLMs': 'manage_llms', + 'Documents': 'documents', + 'Upload Documents': 'upload_documents', + 'Add Webpages': 'add_webpages', + 'Add Youtube Videos': 'add_youtube', + 'Manage Documents': 'manage_documents', + 'Connectors': 'connectors', + 'Add Connector': 'add_connector', + 'Manage Connectors': 'manage_connectors', + 'Podcasts': 'podcasts', + 'Logs': 'logs', + 'Platform': 'platform', +} as const; + export function NavMain({ items }: { items: NavItem[] }) { const t = useTranslations('nav_menu'); - // Translation function that handles both exact matches and fallback to original - const translateTitle = (title: string): string => { - const titleMap: Record<string, string> = { - 'Researcher': 'researcher', - 'Manage LLMs': 'manage_llms', - 'Documents': 'documents', - 'Upload Documents': 'upload_documents', - 'Add Webpages': 'add_webpages', - 'Add Youtube Videos': 'add_youtube', - 'Manage Documents': 'manage_documents', - 'Connectors': 'connectors', - 'Add Connector': 'add_connector', - 'Manage Connectors': 'manage_connectors', - 'Podcasts': 'podcasts', - 'Logs': 'logs', - 'Platform': 'platform', - }; - - const key = titleMap[title]; + const translateTitle = useCallback((title: string): string => { + const key = TITLE_KEY_MAP[title]; return key ? t(key) : title; - }; + }, [t]);
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (36)
surfsense_web/.gitignore(1 hunks)surfsense_web/app/(home)/login/GoogleLoginButton.tsx(4 hunks)surfsense_web/app/(home)/login/LocalLoginForm.tsx(4 hunks)surfsense_web/app/(home)/login/page.tsx(4 hunks)surfsense_web/app/(home)/register/page.tsx(10 hunks)surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx(7 hunks)surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx(20 hunks)surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx(13 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx(12 hunks)surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx(33 hunks)surfsense_web/app/dashboard/[search_space_id]/onboard/page.tsx(8 hunks)surfsense_web/app/dashboard/page.tsx(13 hunks)surfsense_web/app/layout.tsx(2 hunks)surfsense_web/components/LanguageSwitcher.tsx(1 hunks)surfsense_web/components/dashboard-breadcrumb.tsx(7 hunks)surfsense_web/components/onboard/add-provider-step.tsx(9 hunks)surfsense_web/components/onboard/assign-roles-step.tsx(8 hunks)surfsense_web/components/providers/I18nProvider.tsx(1 hunks)surfsense_web/components/sidebar/AppSidebarProvider.tsx(9 hunks)surfsense_web/components/sidebar/nav-main.tsx(2 hunks)surfsense_web/components/sidebar/nav-projects.tsx(5 hunks)surfsense_web/components/sidebar/nav-secondary.tsx(2 hunks)surfsense_web/contexts/LocaleContext.tsx(1 hunks)surfsense_web/i18n/request.ts(1 hunks)surfsense_web/i18n/routing.ts(1 hunks)surfsense_web/messages/en.json(1 hunks)surfsense_web/messages/zh.json(1 hunks)surfsense_web/middleware.ts(1 hunks)surfsense_web/next.config.ts(2 hunks)surfsense_web/package.json(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (15)
- surfsense_web/i18n/request.ts
- surfsense_web/app/(home)/login/GoogleLoginButton.tsx
- surfsense_web/messages/zh.json
- surfsense_web/contexts/LocaleContext.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx
- surfsense_web/.gitignore
- surfsense_web/app/(home)/login/LocalLoginForm.tsx
- surfsense_web/i18n/routing.ts
- surfsense_web/components/onboard/assign-roles-step.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx
- surfsense_web/components/sidebar/nav-secondary.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx
- surfsense_web/middleware.ts
- surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx
- surfsense_web/app/dashboard/[search_space_id]/onboard/page.tsx
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{jsx,tsx}
📄 CodeRabbit inference engine (.rules/require_unique_id_props.mdc)
**/*.{jsx,tsx}: When mapping arrays to React elements in JSX/TSX, each rendered element must include a unique key prop
Keys used for React list items should be stable, predictable, and unique among siblings
Files:
surfsense_web/components/providers/I18nProvider.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsxsurfsense_web/app/dashboard/page.tsxsurfsense_web/components/sidebar/AppSidebarProvider.tsxsurfsense_web/components/onboard/add-provider-step.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsxsurfsense_web/components/sidebar/nav-main.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsxsurfsense_web/components/LanguageSwitcher.tsxsurfsense_web/app/(home)/register/page.tsxsurfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsxsurfsense_web/app/(home)/login/page.tsxsurfsense_web/app/dashboard/[search_space_id]/client-layout.tsxsurfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsxsurfsense_web/components/dashboard-breadcrumb.tsxsurfsense_web/components/sidebar/nav-projects.tsxsurfsense_web/app/layout.tsx
🧬 Code graph analysis (8)
surfsense_web/components/providers/I18nProvider.tsx (1)
surfsense_web/contexts/LocaleContext.tsx (1)
useLocaleContext(63-69)
surfsense_web/components/sidebar/nav-main.tsx (2)
surfsense_web/components/ui/sidebar.tsx (9)
SidebarGroup(669-669)SidebarGroupLabel(672-672)SidebarMenu(676-676)SidebarMenuItem(680-680)SidebarMenuButton(679-679)SidebarMenuAction(677-677)SidebarMenuSub(682-682)SidebarMenuSubItem(684-684)SidebarMenuSubButton(683-683)surfsense_web/components/ui/collapsible.tsx (3)
Collapsible(21-21)CollapsibleTrigger(21-21)CollapsibleContent(21-21)
surfsense_web/components/LanguageSwitcher.tsx (1)
surfsense_web/contexts/LocaleContext.tsx (1)
useLocaleContext(63-69)
surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx (1)
surfsense_web/contracts/enums/connectorIcons.tsx (1)
getConnectorIcon(22-80)
surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx (1)
surfsense_web/components/LanguageSwitcher.tsx (1)
LanguageSwitcher(18-55)
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
surfsense_web/hooks/use-logs.ts (1)
Log(8-17)
surfsense_web/components/sidebar/nav-projects.tsx (1)
surfsense_web/components/ui/sidebar.tsx (2)
SidebarGroupLabel(672-672)SidebarInput(674-674)
surfsense_web/app/layout.tsx (2)
surfsense_web/contexts/LocaleContext.tsx (1)
LocaleProvider(19-61)surfsense_web/components/providers/I18nProvider.tsx (1)
I18nProvider(10-18)
🪛 GitHub Actions: Code Quality Checks
surfsense_web/messages/en.json
[error] 38-38: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 39-39: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 40-40: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 41-41: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 42-42: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 49-49: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 51-51: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 53-53: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 73-73: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 74-74: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 75-75: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 87-87: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 559-559: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 560-560: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
🔇 Additional comments (13)
surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx (1)
13-13: LGTM! Comprehensive i18n implementation.The internationalization is well-implemented with proper translation key usage throughout the page. React keys for mapped categories and connectors use stable identifiers (category.id and connector.id), which is correct per coding guidelines.
Also applies to: 242-242, 271-274, 296-296, 321-403
surfsense_web/package.json (1)
65-65: Dependency addition is correct.The
next-intldependency at version ^3.28.3 is properly added. Note thatnext-intl/plugin(used in next.config.ts) is a submodule of thenext-intlpackage, not a separate dependency—no additional package.json entry is needed.surfsense_web/next.config.ts (1)
3-6: LGTM! next-intl plugin configuration is correct.The integration of the next-intl plugin is properly configured, with the correct import and wrapping order (next-intl wraps the MDX-enhanced config). The path './i18n/request.ts' aligns with the PR's i18n infrastructure.
Also applies to: 29-29
surfsense_web/components/providers/I18nProvider.tsx (1)
1-19: LGTM! Clean provider integration.The I18nProvider correctly bridges the LocaleContext with NextIntlClientProvider. The implementation is straightforward and follows best practices for context-based provider composition.
surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx (1)
10-10: LGTM! Comprehensive i18n coverage.The YouTube video adder page has thorough internationalization with all user-facing strings (labels, placeholders, hints, tips, button texts, and toast messages) properly translated using the 'add_youtube' namespace.
Also applies to: 27-27, 52-290
surfsense_web/app/layout.tsx (1)
93-107: Provider order looks fine; verify RootProvider assumptions.LocaleProvider → I18nProvider → ThemeProvider → RootProvider is sensible. Please confirm RootProvider doesn’t assume ThemeProvider is outermost or read SSR locale directly.
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx (1)
25-40: LGTM on i18n usage in toasts and scope.Localizations correctly replace previous hard-coded strings; param passing for count is correct.
Also applies to: 123-141
surfsense_web/components/onboard/add-provider-step.tsx (1)
108-147: Good: Stable keys for mapped list items.Using config.id for keys meets our React list-key guideline.
surfsense_web/components/dashboard-breadcrumb.tsx (1)
5-6: next-intl infrastructure is properly configured—no action required.Verification confirms all necessary setup is in place:
next-intl/pluginis imported and configured innext.config.tswith reference to./i18n/request.tsNextIntlClientProvideris wrapped at the root level viaI18nProviderinapp/layout.tsx- The import in
dashboard-breadcrumb.tsxwill function correctlysurfsense_web/app/dashboard/page.tsx (1)
10-10: LGTM! Clean i18n integration.The translation hooks are properly initialized and consistently applied throughout the component. The use of parameter interpolation (e.g., line 323:
t('delete_space_confirm', { name: space.name })) correctly follows next-intl patterns.Also applies to: 65-65, 99-99, 137-139
surfsense_web/components/sidebar/nav-projects.tsx (1)
15-15: LGTM! Proper translation integration.The translations are consistently applied throughout the component, including the conditional logic at line 173 (
searchQuery ? t('no_chats_found') : t('no_recent_chats')), which correctly handles different empty states.Also applies to: 60-60, 150-183
surfsense_web/components/sidebar/AppSidebarProvider.tsx (1)
5-5: LGTM! Comprehensive translation integration.The translations are properly integrated throughout the component, including:
- Dynamic content interpolation (line 273-274: chat name insertion)
- Loading and error states
- Dialog content and actions
- Memoization dependencies updated to include translation hooks
Also applies to: 59-60, 202-299
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
175-320: LGTM! Excellent translation architecture.The approach of creating translation-aware column definitions via
createColumns(t)is well-designed. It:
- Keeps translation logic colocated with column definitions
- Allows columns to be recreated when translations change
- Maintains type safety throughout
The extensive translation wiring across all components (LogsTable, LogsPagination, LogRowActions, FilterDropdown, LogsFilters) is comprehensive and well-executed.
Also applies to: 332-332, 367-368
| const translatedNavMain = useMemo(() => { | ||
| return navMain.map((item) => ({ | ||
| ...item, | ||
| title: tNavMenu(item.title.toLowerCase().replace(/ /g, '_')), | ||
| items: item.items?.map((subItem: any) => ({ | ||
| ...subItem, | ||
| title: tNavMenu(subItem.title.toLowerCase().replace(/ /g, '_')), | ||
| })), | ||
| })); | ||
| }, [navMain, tNavMenu]); | ||
|
|
||
| const translatedNavSecondary = useMemo(() => { | ||
| return navSecondary.map((item) => ({ | ||
| ...item, | ||
| title: item.title === 'All Search Spaces' ? tNavMenu('all_search_spaces') : item.title, | ||
| })); | ||
| }, [navSecondary, tNavMenu]); |
There was a problem hiding this comment.
Refactor navigation translation to use explicit keys.
The current approach derives translation keys from titles using string manipulation (.toLowerCase().replace(/ /g, '_')), which is fragile and error-prone. If navigation titles change or contain unexpected characters, translations will silently fail with no compile-time or runtime warnings.
Consider one of these safer approaches:
Option 1: Add explicit translation keys to the navigation data structure:
navMain.map((item) => ({
...item,
title: tNavMenu(item.translationKey || item.title),
items: item.items?.map((subItem: any) => ({
...subItem,
title: tNavMenu(subItem.translationKey || subItem.title),
})),
}))Option 2: Use a mapping object similar to nav-main.tsx:
const NAV_KEY_MAP: Record<string, string> = {
'Researcher': 'researcher',
'Documents': 'documents',
// ... etc
};
const translatedNavMain = useMemo(() => {
return navMain.map((item) => ({
...item,
title: NAV_KEY_MAP[item.title] ? tNavMenu(NAV_KEY_MAP[item.title]) : item.title,
// ... similar for subitems
}));
}, [navMain, tNavMenu]);This provides better maintainability and makes the relationship between titles and translation keys explicit.
🤖 Prompt for AI Agents
In surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx around lines
41 to 57, the code builds translation keys by munging titles with
.toLowerCase().replace(/ /g, '_'), which is fragile; change to use explicit
translation keys or a mapping: update the nav data shape to include a
translationKey on items and subitems and call tNavMenu(item.translationKey ||
item.title) (and same for subitems), or create a NAV_KEY_MAP that maps visible
titles to translation keys and use NAV_KEY_MAP[item.title] ?
tNavMenu(NAV_KEY_MAP[item.title]) : item.title; ensure useMemo dependencies
remain correct and update any typings for nav item to include optional
translationKey.
| const titleMap: Record<string, string> = { | ||
| 'Researcher': 'researcher', | ||
| 'Manage LLMs': 'manage_llms', | ||
| 'Documents': 'documents', | ||
| 'Upload Documents': 'upload_documents', | ||
| 'Add Webpages': 'add_webpages', | ||
| 'Add Youtube Videos': 'add_youtube', | ||
| 'Manage Documents': 'manage_documents', | ||
| 'Connectors': 'connectors', | ||
| 'Add Connector': 'add_connector', | ||
| 'Manage Connectors': 'manage_connectors', | ||
| 'Podcasts': 'podcasts', | ||
| 'Logs': 'logs', | ||
| 'Platform': 'platform', | ||
| }; | ||
|
|
||
| const key = titleMap[title]; | ||
| return key ? t(key) : title; | ||
| }; |
There was a problem hiding this comment.
Consider passing translation keys explicitly in navigation data.
Similar to the issue in client-layout.tsx, the hardcoded mapping between English titles and translation keys creates a fragile coupling. If a navigation title changes in the data source, the translation will silently fail.
Consider refactoring the navigation data structure to include explicit translation keys:
interface NavItem {
title: string;
translationKey?: string; // Add this field
url: string;
icon: LucideIcon;
// ... other fields
}Then use it directly:
const translatedTitle = item.translationKey ? t(item.translationKey) : item.title;This makes the relationship between navigation items and their translations explicit and maintainable.
| "password": "Password", | ||
| "confirm_password": "Confirm Password", | ||
| "forgot_password": "Forgot Password?", | ||
| "show_password": "Show password", | ||
| "hide_password": "Hide password", |
There was a problem hiding this comment.
🧩 Analysis chain
CI: Secret scanner false positives on i18n strings (“password”, “API Key”).
These are UI labels, not secrets. Mitigate by excluding i18n message files or adding a baseline.
Run to validate and preview an exclusion-based scan:
Also applies to: 559-560
🏁 Script executed:
#!/bin/bash
pip install -q detect-secrets jq
# Scan entire repo but exclude i18n message files
detect-secrets scan --all-files --exclude-files 'surfsense_web/messages/.*\.json' > ds.out
echo "Findings (excluding messages/*.json):"
jq '.results | length' ds.out || cat ds.out
echo "Suggestion: commit a .secrets.baseline and configure pre-commit to exclude surfsense_web/messages/*.json for Secret Keyword plugin only."Length of output: 472
Let me search the codebase for existing secret-scanning configuration to understand the current setup:
🏁 Script executed:
#!/bin/bash
# Check for secret scanning configuration files
echo "=== Looking for secret-scanning config files ==="
fd -t f '\.(pre-commit-config|secrets\.baseline|secrets\.baseline\.json)' --hidden
echo ""
echo "=== Checking for .pre-commit-config.yaml ==="
cat .pre-commit-config.yaml 2>/dev/null || echo "Not found"
echo ""
echo "=== Checking for .secrets.baseline ==="
cat .secrets.baseline 2>/dev/null || echo "Not found"
echo ""
echo "=== Checking for .github/workflows for secret scanning ==="
fd -t f -e 'yml|yaml' '.github/workflows' 2>/dev/null | head -5Length of output: 5458
🏁 Script executed:
#!/bin/bash
echo "=== Lines 38-42 of surfsense_web/messages/en.json ==="
sed -n '38,42p' surfsense_web/messages/en.json
echo ""
echo "=== Lines 559-560 of surfsense_web/messages/en.json ==="
sed -n '559,560p' surfsense_web/messages/en.json
echo ""
echo "=== Full check: grep for 'password' and 'API Key' ==="
grep -n "password\|API Key" surfsense_web/messages/en.json | head -20Length of output: 1060
Update .pre-commit-config.yaml to exclude i18n message files from secret scanning.
The keywords "password" and "API Key" in surfsense_web/messages/en.json (lines 38–42, 559–560) are UI labels, not secrets, and trigger false positives in the detect-secrets KeywordDetector. Add surfsense_web/messages/.*\.json to the detect-secrets exclude pattern in .pre-commit-config.yaml:
- repo: https://github.com/Yelp/detect-secrets
rev: v1.5.0
hooks:
- id: detect-secrets
args: ['--baseline', '.secrets.baseline']
exclude: |
(?x)^(
.*\.env\.example|
.*\.env\.template|
.*/tests/.*|
.*test.*\.py|
test_.*\.py|
.github/workflows/.*\.yml|
.github/workflows/.*\.yaml|
.*pnpm-lock\.yaml|
.*alembic\.ini|
.*alembic/versions/.*\.py|
.*\.mdx$|
surfsense_web/messages/.*\.json
)$This prevents KeywordDetector from scanning i18n translation files where UI labels naturally contain these terms.
🧰 Tools
🪛 GitHub Actions: Code Quality Checks
[error] 38-38: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 39-39: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 40-40: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 41-41: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
[error] 42-42: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword (hook: detect-secrets).
🤖 Prompt for AI Agents
In .pre-commit-config.yaml (affects detect-secrets hook) around where hooks for
https://github.com/Yelp/detect-secrets are defined, add the pattern
surfsense_web/messages/.*\.json to the detect-secrets hook's exclude regex so
i18n JSON files (like surfsense_web/messages/en.json lines 38–42 and 559–560)
are skipped by KeywordDetector; update the multiline exclude block to include
that pattern, ensure proper escaping and that the overall regex remains wrapped
in (?x) and anchored as in the existing exclude block.
|
@unitagain Now this err |
unitagain
force-pushed
the
feature/i18n-clean
branch
from
378aac7 to
cd7022c
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (5)
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (4)
126-173: Translate hardcoded strings in MessageDetails component.The MessageDetails component contains untranslated user-facing strings at lines 145 ("Log details") and 153 ("Close"). These should be localized for consistency with the rest of the i18n implementation.
Consider updating the component to accept the translation function:
function MessageDetails({ message, taskName, metadata, createdAt, children, + t, }: { message: string; taskName?: string; metadata?: any; createdAt?: string; children: React.ReactNode; + t: (key: string) => string; }) { return ( <AlertDialog> <AlertDialogTrigger asChild>{children}</AlertDialogTrigger> <AlertDialogContent className="max-w-3xl w-full"> <div className="flex items-start justify-between gap-4"> <div> - <AlertDialogTitle className="text-lg">Log details</AlertDialogTitle> + <AlertDialogTitle className="text-lg">{t('log_details')}</AlertDialogTitle> {createdAt && ( <p className="text-xs text-muted-foreground mt-1"> {new Date(createdAt).toLocaleString()} </p> )} </div> <div className="shrink-0"> - <AlertDialogCancel className="text-sm">Close</AlertDialogCancel> + <AlertDialogCancel className="text-sm">{t('close')}</AlertDialogCancel> </div> </div>Then update the usage in createColumns (line 275) to pass
tto MessageDetails.
403-429: Translate toast messages in handleDeleteRows.Multiple user-facing toast messages remain hardcoded and should be localized:
- Line 407: "No rows selected"
- Line 418: "Successfully deleted ${selectedRows.length} log(s)"
- Line 420: "Some logs could not be deleted"
- Line 427: "Error deleting logs"
Apply this diff:
if (selectedRows.length === 0) { - toast.error("No rows selected"); + toast.error(t('no_rows_selected')); return; } // ... deletion logic ... if (allSuccessful) { - toast.success(`Successfully deleted ${selectedRows.length} log(s)`); + toast.success(t('delete_success', { count: selectedRows.length })); } else { - toast.error("Some logs could not be deleted"); + toast.error(t('delete_partial_error')); } // ... refresh logic ... } catch (error: any) { console.error("Error deleting logs:", error); - toast.error("Error deleting logs"); + toast.error(t('delete_error')); }
431-434: Translate the refresh success message.The toast message "Logs refreshed" at line 433 should be localized.
Apply this diff:
const handleRefresh = async () => { await Promise.all([refreshLogs(), refreshSummary()]); - toast.success("Logs refreshed"); + toast.success(t('refresh_success')); };
856-891: Translate loading and error state messages.The loading state message at line 866 ("Loading logs...") and error state messages at lines 883 ("Error loading logs") and 885 ("Retry") are hardcoded and should be localized.
Apply this diff:
<div className="flex h-[400px] w-full items-center justify-center"> <div className="flex flex-col items-center gap-2"> <div className="h-8 w-8 animate-spin rounded-full border-b-2 border-primary"></div> - <p className="text-sm text-muted-foreground">Loading logs...</p> + <p className="text-sm text-muted-foreground">{t('loading')}</p> </div> </div> // ... and for error state: <div className="flex flex-col items-center gap-2"> <AlertCircle className="h-8 w-8 text-destructive" /> - <p className="text-sm text-destructive">Error loading logs</p> + <p className="text-sm text-destructive">{t('error_loading')}</p> <Button variant="outline" size="sm" onClick={onRefresh}> - Retry + {t('retry')} </Button> </div>surfsense_web/app/(home)/login/page.tsx (1)
185-196: Translate the hardcoded loading text in LoadingFallback.The
LoadingFallbackcomponent has a hardcoded "Loading..." string on line 192, while the mainLoginContentcomponent correctly usestCommon('loading')on line 99. For consistency, the fallback should also use translations.Apply this diff:
+import { useTranslations } from 'next-intl'; + const LoadingFallback = () => { + const tCommon = useTranslations('common'); return ( <div className="relative w-full overflow-hidden"> <AmbientBackground /> <div className="mx-auto flex h-screen max-w-lg flex-col items-center justify-center"> <Logo className="rounded-md" /> <div className="mt-8 flex items-center space-x-2"> <Loader2 className="h-5 w-5 animate-spin text-muted-foreground" /> - <span className="text-muted-foreground">Loading...</span> + <span className="text-muted-foreground">{tCommon('loading')}</span> </div> </div> </div> ); };
♻️ Duplicate comments (6)
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx (1)
55-55: Incomplete i18n implementation—previous review concerns remain unaddressed.Only the "Rows per page" label was translated. The following user-facing strings remain hardcoded:
- Line 81: The word "of" in the pagination summary
- Line 100: aria-label "Go to first page"
- Line 118: aria-label "Go to previous page"
- Line 136: aria-label "Go to next page"
- Line 154: aria-label "Go to last page"
These hardcoded strings prevent accessibility for non-English users and are inconsistent with the PR's objective of comprehensive bilingual support.
Apply translations to all remaining strings:
- of <span className="text-foreground">{total}</span> + {t('pagination.of')} <span className="text-foreground">{total}</span>- aria-label="Go to first page" + aria-label={t('pagination.go_to_first_page')}- aria-label="Go to previous page" + aria-label={t('pagination.go_to_previous_page')}- aria-label="Go to next page" + aria-label={t('pagination.go_to_next_page')}- aria-label="Go to last page" + aria-label={t('pagination.go_to_last_page')}Also applies to: 81-81, 100-100, 118-118, 136-136, 154-154
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
998-1004: Fix colSpan to use table column count instead of static array.This is a duplicate of the previous review comment. The code still uses
columns.lengthwhich references the static default columns array (line 323), not the actual rendered columns. This can cause incorrect colSpan when column visibility changes.Apply this diff to use the table instance's column count:
- <TableCell colSpan={columns.length} className="h-24 text-center"> + <TableCell colSpan={table.getAllColumns().length} className="h-24 text-center"> {t('no_logs')} </TableCell>surfsense_web/components/sidebar/nav-main.tsx (1)
34-55: Prefer explicit translation keys on nav data over brittle titleMap.Same concern noted previously: pass translationKey with each item to avoid silent breaks when titles change.
Minimal change:
interface NavItem { title: string; + translationKey?: string; url: string; icon: LucideIcon; isActive?: boolean; items?: { title: string; + translationKey?: string; url: string; }[]; } @@ -const translateTitle = (title: string): string => { - const titleMap: Record<string, string> = { ... }; - const key = titleMap[title]; - return key ? t(key) : title; -}; +const translateTitle = (title: string, key?: string): string => + key ? t(key) : title; @@ -const translatedTitle = translateTitle(item.title); +const translatedTitle = translateTitle(item.title, item.translationKey); @@ -const translatedSubTitle = translateTitle(subItem.title); +const translatedSubTitle = translateTitle(subItem.title, subItem.translationKey);Then populate translationKey at source.
surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
69-81: Respect active locale for dates (duplicate of earlier feedback).Date/time formatting is hardcoded to "en-US"; use next-intl’s formatter and apply it also to visible date chips.
-import { format } from "date-fns"; +import { format } from "date-fns"; +import { useFormatter } from "next-intl"; @@ - const formatDateTime = (dateString: string | null): string => { + const formatDateTime = (dateString: string | null): string => { if (!dateString) return t('never'); const date = new Date(dateString); - return new Intl.DateTimeFormat("en-US", { - year: "numeric", - month: "short", - day: "numeric", - hour: "2-digit", - minute: "2-digit", - }).format(date); + const f = formatter; // see below + return f.dateTime(date, {dateStyle: 'medium', timeStyle: 'short'}); }; + const formatter = useFormatter(); @@ - {startDate ? format(startDate, "PPP") : t('pick_date')} + {startDate ? useFormatter().dateTime(startDate, {dateStyle: 'medium'}) : t('pick_date')} @@ - {endDate ? format(endDate, "PPP") : t('pick_date')} + {endDate ? useFormatter().dateTime(endDate, {dateStyle: 'medium'}) : t('pick_date')}Also applies to: 500-502, 526-528
surfsense_web/app/(home)/login/page.tsx (1)
40-41: Translate the hardcoded logout message.The logout description on line 41 is still hardcoded. This should be translated for consistency with the rest of the i18n implementation.
Apply this diff:
toast.success(tCommon('success'), { - description: "You have been securely logged out", + description: t('logout_description'), duration: 3000, });Then add the key to your auth namespace in the message files:
"logout_description": "You have been securely logged out"surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx (1)
41-57: Refactor to use explicit translation keys instead of string manipulation.Deriving translation keys via
.toLowerCase().replace(/ /g, '_')(lines 44, 47) is fragile and error-prone. If navigation titles change or contain unexpected characters, translations will fail silently with no warnings.Consider adding explicit
translationKeyproperties to your navigation data structure:// In your nav data file { title: "Upload Documents", translationKey: "upload_documents", // ... other properties }Then use them directly:
const translatedNavMain = useMemo(() => { return navMain.map((item) => ({ ...item, title: tNavMenu(item.translationKey || item.title), items: item.items?.map((subItem: any) => ({ ...subItem, title: tNavMenu(subItem.translationKey || subItem.title), })), })); }, [navMain, tNavMenu]);This provides type safety and makes the title-to-key relationship explicit and maintainable.
🧹 Nitpick comments (10)
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
322-323: Clarify or remove the default columns.The "backward compatibility" default columns use an identity function that would display translation keys (e.g., "level", "status") instead of translated text. Since the file now uses
translatedColumnsfrom the useMemo (line 371), these default columns appear unused and may cause confusion.Consider removing these lines unless there's a specific use case for untranslated columns:
-// Default columns for backward compatibility -const columns: ColumnDef<Log>[] = createColumns((key) => key); -surfsense_web/components/sidebar/AppSidebarProvider.tsx (1)
101-115: Localize remaining English strings (chat fallback name, action label, error text).A few strings bypass i18n:
- Fallback chat name "Chat ${chat.id}".
- Action label "Delete".
- Error fallback "Unknown error occurred".
Refactor to use translation keys to ensure EN/ZH parity.
Apply diffs:
@@ - const formattedChats = sortedChats.map((chat) => ({ - name: chat.title || `Chat ${chat.id}`, + const formattedChats = sortedChats.map((chat) => ({ + name: chat.title || t('chat_default_name', {id: chat.id}), @@ - name: "Delete", + name: tCommon('delete'), @@ - setChatError(error instanceof Error ? error.message : "Unknown error occurred"); + setChatError(error instanceof Error ? error.message : tCommon('unknown_error')); @@ - setSearchSpaceError(error instanceof Error ? error.message : "Unknown error occurred"); + setSearchSpaceError(error instanceof Error ? error.message : tCommon('unknown_error'));Ensure messages exist:
- dashboard.chat_default_name: "Chat {id}"
- common.unknown_error: "Unknown error"
Also applies to: 108-117, 124-124, 144-144
surfsense_web/components/sidebar/nav-main.tsx (3)
63-67: Replace index-based keys with stable identifiers (e.g., url).index in keys can misorder items on updates. Prefer deterministic keys.
- {memoizedItems.map((item, index) => { + {memoizedItems.map((item) => { @@ - <Collapsible key={`${item.title}-${index}`} asChild defaultOpen={item.isActive}> + <Collapsible key={`nav-${item.url}`} asChild defaultOpen={item.isActive}> @@ - {item.items?.map((subItem, subIndex) => { + {item.items?.map((subItem) => { @@ - <SidebarMenuSubItem key={`${subItem.title}-${subIndex}`}> + <SidebarMenuSubItem key={`sub-${subItem.url}`}>As per coding guidelines.
Also applies to: 96-101
71-76: Localize ARIA/assistive text ("with submenu", "Toggle submenu").These are still English. Add common keys for accessibility text.
- aria-label={`${translatedTitle}${item.items?.length ? " with submenu" : ""}`} + const tCommon = useTranslations('common'); + aria-label={`${translatedTitle}${item.items?.length ? ` ${tCommon('with_submenu')}` : ""}`} @@ - <span className="sr-only">Toggle submenu</span> + <span className="sr-only">{tCommon('toggle_submenu')}</span>Ensure common.with_submenu and common.toggle_submenu exist.
Also applies to: 85-89
56-58: Nits: remove redundant memo and hoist static map.
- useMemo(() => items, [items]) is identity; drop it.
- If retaining titleMap, hoist it outside the component to avoid re-creation.
- const memoizedItems = useMemo(() => items, [items]); + const memoizedItems = items;Also applies to: 36-51
surfsense_web/components/providers/I18nProvider.tsx (1)
10-18: LGTM; consider adding message typing for safety.Current provider is correct. Optionally type messages with AbstractIntlMessages to catch shape issues at compile time.
-import { NextIntlClientProvider } from 'next-intl'; +import { NextIntlClientProvider, type AbstractIntlMessages } from 'next-intl'; @@ -export function I18nProvider({ children }: { children: React.ReactNode }) { - const { locale, messages } = useLocaleContext(); +export function I18nProvider({ children }: { children: React.ReactNode }) { + const { locale, messages } = useLocaleContext() as { locale: string; messages: AbstractIntlMessages };surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
329-347: Localize remaining English UI strings to maintain EN/ZH parity.Verification confirms hardcoded English strings throughout the dialog and UI elements (lines 329, 347, 413, 417, 594, 622–643, 654–670, 684–688) that bypass i18n. Convert these to
t(...)calls using connector namespace keys and reusetCommon('cancel')where applicable, following the examples provided. Note that line 455 already correctly usestCommon('cancel'), so ensure consistency across all cancel buttons.surfsense_web/i18n/request.ts (2)
13-13: Remove theas anytype assertion.The type assertion bypasses TypeScript's type safety. Since
routing.localesis defined as['en', 'zh']in routing.ts, castlocaleproperly or use a type guard.Apply this diff:
- if (!locale || !routing.locales.includes(locale as any)) { + if (!locale || !routing.locales.includes(locale as 'en' | 'zh')) {
17-20: Consider adding error handling for the dynamic import.While the locale is validated, adding a try-catch around the dynamic import would make the configuration more robust against missing or malformed message files.
Example:
return { locale, - messages: (await import(`../messages/${locale}.json`)).default + messages: await (async () => { + try { + return (await import(`../messages/${locale}.json`)).default; + } catch (error) { + console.error(`Failed to load messages for locale: ${locale}`, error); + return (await import(`../messages/${routing.defaultLocale}.json`)).default; + } + })() };surfsense_web/contexts/LocaleContext.tsx (1)
40-54: Remove redundant HTML lang attribute update.The
document.documentElement.langattribute is updated in two places: withinsetLocale(line 45) and in a separateuseEffect(line 52). This creates redundancy—whensetLocaleis called, the attribute is set twice.Consider removing the inline update in
setLocaleand relying solely on theuseEffect:const setLocale = (newLocale: Locale) => { setLocaleState(newLocale); if (typeof window !== 'undefined') { localStorage.setItem(LOCALE_STORAGE_KEY, newLocale); - // Update HTML lang attribute - document.documentElement.lang = newLocale; } };The
useEffecton lines 50-54 will handle the update reactively.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (36)
surfsense_web/.gitignore(1 hunks)surfsense_web/app/(home)/login/GoogleLoginButton.tsx(4 hunks)surfsense_web/app/(home)/login/LocalLoginForm.tsx(4 hunks)surfsense_web/app/(home)/login/page.tsx(4 hunks)surfsense_web/app/(home)/register/page.tsx(10 hunks)surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx(7 hunks)surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx(20 hunks)surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx(13 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx(12 hunks)surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx(33 hunks)surfsense_web/app/dashboard/[search_space_id]/onboard/page.tsx(8 hunks)surfsense_web/app/dashboard/page.tsx(13 hunks)surfsense_web/app/layout.tsx(2 hunks)surfsense_web/components/LanguageSwitcher.tsx(1 hunks)surfsense_web/components/dashboard-breadcrumb.tsx(7 hunks)surfsense_web/components/onboard/add-provider-step.tsx(9 hunks)surfsense_web/components/onboard/assign-roles-step.tsx(8 hunks)surfsense_web/components/providers/I18nProvider.tsx(1 hunks)surfsense_web/components/sidebar/AppSidebarProvider.tsx(9 hunks)surfsense_web/components/sidebar/nav-main.tsx(2 hunks)surfsense_web/components/sidebar/nav-projects.tsx(5 hunks)surfsense_web/components/sidebar/nav-secondary.tsx(2 hunks)surfsense_web/contexts/LocaleContext.tsx(1 hunks)surfsense_web/i18n/request.ts(1 hunks)surfsense_web/i18n/routing.ts(1 hunks)surfsense_web/messages/en.json(1 hunks)surfsense_web/messages/zh.json(1 hunks)surfsense_web/middleware.ts(1 hunks)surfsense_web/next.config.ts(2 hunks)surfsense_web/package.json(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (21)
- surfsense_web/components/sidebar/nav-secondary.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx
- surfsense_web/app/layout.tsx
- surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx
- surfsense_web/messages/zh.json
- surfsense_web/components/onboard/add-provider-step.tsx
- surfsense_web/components/sidebar/nav-projects.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx
- surfsense_web/package.json
- surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx
- surfsense_web/app/(home)/login/GoogleLoginButton.tsx
- surfsense_web/app/(home)/register/page.tsx
- surfsense_web/components/LanguageSwitcher.tsx
- surfsense_web/components/dashboard-breadcrumb.tsx
- surfsense_web/middleware.ts
- surfsense_web/app/(home)/login/LocalLoginForm.tsx
- surfsense_web/.gitignore
- surfsense_web/next.config.ts
- surfsense_web/app/dashboard/[search_space_id]/onboard/page.tsx
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{jsx,tsx}
📄 CodeRabbit inference engine (.rules/require_unique_id_props.mdc)
**/*.{jsx,tsx}: When mapping arrays to React elements in JSX/TSX, each rendered element must include a unique key prop
Keys used for React list items should be stable, predictable, and unique among siblings
Files:
surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsxsurfsense_web/components/providers/I18nProvider.tsxsurfsense_web/components/sidebar/AppSidebarProvider.tsxsurfsense_web/app/dashboard/page.tsxsurfsense_web/components/onboard/assign-roles-step.tsxsurfsense_web/contexts/LocaleContext.tsxsurfsense_web/components/sidebar/nav-main.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsxsurfsense_web/app/dashboard/[search_space_id]/client-layout.tsxsurfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsxsurfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsxsurfsense_web/app/(home)/login/page.tsx
🧬 Code graph analysis (8)
surfsense_web/components/providers/I18nProvider.tsx (1)
surfsense_web/contexts/LocaleContext.tsx (1)
useLocaleContext(63-69)
surfsense_web/app/dashboard/page.tsx (4)
surfsense_web/components/ui/card.tsx (5)
CardTitle(55-55)CardDescription(55-55)CardHeader(55-55)CardContent(55-55)CardFooter(55-55)surfsense_web/components/ui/alert.tsx (3)
Alert(48-48)AlertTitle(48-48)AlertDescription(48-48)surfsense_web/components/ui/button.tsx (1)
Button(56-56)surfsense_web/components/ui/alert-dialog.tsx (6)
AlertDialogTitle(130-130)AlertDialogDescription(131-131)AlertDialogHeader(128-128)AlertDialogFooter(129-129)AlertDialogCancel(133-133)AlertDialogAction(132-132)
surfsense_web/components/onboard/assign-roles-step.tsx (1)
surfsense_web/hooks/use-llm-configs.ts (2)
useLLMConfigs(50-190)useLLMPreferences(192-285)
surfsense_web/components/sidebar/nav-main.tsx (2)
surfsense_web/components/ui/sidebar.tsx (9)
SidebarGroup(669-669)SidebarGroupLabel(672-672)SidebarMenu(676-676)SidebarMenuItem(680-680)SidebarMenuButton(679-679)SidebarMenuAction(677-677)SidebarMenuSub(682-682)SidebarMenuSubItem(684-684)SidebarMenuSubButton(683-683)surfsense_web/components/ui/collapsible.tsx (3)
Collapsible(21-21)CollapsibleTrigger(21-21)CollapsibleContent(21-21)
surfsense_web/i18n/request.ts (1)
surfsense_web/i18n/routing.ts (1)
routing(8-18)
surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx (2)
surfsense_web/components/LanguageSwitcher.tsx (1)
LanguageSwitcher(18-55)surfsense_web/components/theme/theme-toggle.tsx (1)
ThemeTogglerComponent(9-71)
surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
surfsense_web/hooks/use-connectors.ts (1)
deleteConnector(116-131)
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
surfsense_web/hooks/use-logs.ts (1)
Log(8-17)
🔇 Additional comments (14)
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx (1)
5-5: LGTM: i18n setup is correct.The useTranslations hook is properly imported and initialized with the 'documents' namespace.
Also applies to: 42-42
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (5)
175-320: LGTM! Well-structured translation-aware column definitions.The createColumns factory function properly generates translated column definitions, with all headers and cell content localized. The pattern of passing the translation function through to child components (like LogRowActions) is correct.
331-371: LGTM! Proper translation integration with React Table.The use of
useTranslations('logs')combined withuseMemoto create translated columns is the correct pattern. This ensures columns are recreated when the locale changes while avoiding unnecessary re-renders.
538-662: LGTM! Summary dashboard properly localized.The LogsSummaryDashboard component correctly uses
useTranslations('logs')and all user-facing strings (card titles, labels, error messages) are properly translated.
1016-1112: LGTM! Pagination component properly localized.The pagination component correctly receives and uses the translation function for all user-facing labels.
1115-1186: LGTM! Row actions component fully localized.The LogRowActions component properly uses the translation function for all user-facing strings including toast messages, dialog content, and button labels.
surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx (3)
10-10: LGTM! Clean i18n integration.The import and initialization of
useTranslationswith the'add_youtube'namespace is correct and follows next-intl best practices.Also applies to: 27-27
52-52: Excellent translation coverage.All user-facing strings are properly internationalized with appropriate translation keys. The parameterized translation on line 59 correctly uses ICU message format, and error handling preserves localized messages throughout the flow.
Also applies to: 59-59, 67-69, 97-99, 104-107, 117-119, 125-127, 172-172, 175-175, 184-184, 189-189, 205-205, 221-226, 232-232, 268-268, 278-278, 290-290
234-255: Video preview rendering looks good.The mapped video preview elements correctly use
key={tag.id}(line 238), which provides stable and unique keys for each rendered iframe.surfsense_web/i18n/routing.ts (1)
8-18: Routing config looks solid.Locales/default/prefix and exported navigation helpers align with next-intl best practices. Good foundation for locale-aware Links and redirects.
Also applies to: 22-23
surfsense_web/messages/en.json (1)
1-692: LGTM! Well-structured translation file.The translation keys are well-organized into logical namespaces (common, auth, dashboard, navigation, etc.) and provide comprehensive coverage across the application. The structure aligns well with the i18n implementation throughout the codebase.
Note: The secret scanner false positive issue (lines 38-42, 559-560) has been appropriately addressed in previous review comments.
surfsense_web/app/dashboard/page.tsx (1)
137-405: LGTM! Comprehensive i18n integration.The translation implementation is thorough and correct:
- Proper use of
useTranslationshooks for bothdashboardandcommonnamespaces- All user-facing strings are translated
- Interpolation is correctly used (e.g., line 323 with
{ name: space.name })- Good separation between domain-specific (
dashboard) and common UI actions (common)surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx (1)
147-150: LGTM! Clean integration of LanguageSwitcher.The addition of the
LanguageSwitchercomponent alongside the theme toggle in the header provides a good user experience for locale switching. The implementation is clean and consistent with the existing UI patterns.surfsense_web/components/onboard/assign-roles-step.tsx (1)
26-250: LGTM! Excellent i18n implementation.The translation integration is comprehensive and well-executed:
- All user-facing text properly translated including role descriptions, UI labels, and status messages
- Correct use of interpolation for dynamic content (lines 242-245)
- ROLE_DESCRIPTIONS structure maintains clarity while supporting translations
- Translation keys are logically organized within the
onboardnamespace
| <a href={item.url}> | ||
| <item.icon /> | ||
| <span>{translatedTitle}</span> | ||
| </a> |
There was a problem hiding this comment.
Use locale-aware Link to preserve i18n routing and client transitions.
Raw breaks locale-prefixed paths and Next prefetch. Use Link from your i18n routing.
Apply:
@@
-import { useTranslations } from "next-intl";
+import { useTranslations } from "next-intl";
+import { Link } from "@/i18n/routing";
@@
- <a href={item.url}>
+ <Link href={item.url}>
<item.icon />
<span>{translatedTitle}</span>
- </a>
+ </Link>
@@
- <a href={subItem.url}>
+ <Link href={subItem.url}>
<span>{translatedSubTitle}</span>
- </a>
+ </Link>Also localize ARIA copy (see next comment).
Also applies to: 98-101
🤖 Prompt for AI Agents
In surfsense_web/components/sidebar/nav-main.tsx around lines 74-77 (and
similarly update lines 98-101), replace the raw <a href={item.url}> anchor with
your framework's locale-aware Link component so Next/i18n routing and
prefetching remain intact; render the icon and translatedTitle inside the Link
and pass the href to Link (leave any inner element as a semantic element if
needed), ensure you forward any className/aria props to the visible element, and
replace hardcoded ARIA copy with the localized string from your i18n provider
for accessible labels.
- Implement next-intl framework for scalable i18n - Add complete Chinese (Simplified) localization - Support 400+ translated strings across all pages - Add language switcher with persistent preference - Zero breaking changes to existing functionality Framework additions: - i18n routing and middleware - LocaleContext for client-side state - LanguageSwitcher component - Translation files (en.json, zh.json) Translated components: - Homepage: Hero, features, CTA, navbar - Auth: Login, register - Dashboard: Main page, layout - Connectors: Management, add page (all categories) - Documents: Upload, manage, filters - Settings: LLM configs, role assignments - Onboarding: Add provider, assign roles - Logs: Task logs viewer Adding a new language now requires only: 1. Create messages/<locale>.json 2. Add locale to i18n/routing.ts
unitagain
force-pushed
the
feature/i18n-clean
branch
from
cd7022c to
f58c7e4
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx (2)
92-92: Translate the hardcoded error message.The error message at line 92 is hardcoded in English, while other error messages throughout the file use translation keys. Since this error surfaces to users via
error.messageat lines 104 and 106, it should be translated for consistency.Apply this diff to use a translation key:
if (!response.ok) { - throw new Error("Failed to process YouTube videos"); + throw new Error(t('error_processing_failed')); }
248-248: Translate the iframe title for accessibility.The iframe
titleattribute is hardcoded in English, which affects accessibility for users with screen readers in other languages. For complete i18n coverage, this should be translated.Apply this diff to use a translation key:
<iframe width="100%" height="100%" src={`https://www.youtube.com/embed/${videoId}`} - title="YouTube video player" + title={t('video_player_title')} allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen ></iframe>
♻️ Duplicate comments (8)
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx (1)
140-140: Incomplete localization coverage.While the search input placeholder is translated, numerous other user-facing strings remain hardcoded:
- "Type" button text (line 140)
- "Filters" label (line 156)
- "Toggle columns" and column labels (lines 210, 213-216)
- "Delete" button (line 244)
- Alert dialog content (lines 259-268)
For comprehensive i18n, all user-facing text should use translation keys.
Also applies to: 156-156, 210-216, 244-244, 259-268
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx (1)
81-81: Incomplete localization coverage.The "rows per page" label is translated, but other user-facing strings remain hardcoded:
- "of" text in the pagination summary (line 81)
- Aria-labels for navigation buttons (lines 100, 118, 136, 154)
For comprehensive i18n and accessibility in multiple languages, these strings should also use translation keys.
Also applies to: 100-100, 118-118, 136-136, 154-154
surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
69-81: Respect current locale in date/time formatting.The
formatDateTimehelper still hardcodes"en-US"on line 74, which means date/time displays won't reflect the user's selected language. Consider usinguseLocale()from next-intl oruseFormatter()to ensure dates format according to the active locale.surfsense_web/app/(home)/login/page.tsx (1)
40-41: Translate the hardcoded logout message.Line 41 still contains the hardcoded string
"You have been securely logged out"which should be replaced with a translation key (e.g.,t('logout_description')) for consistency with the rest of the i18n implementation.surfsense_web/app/(home)/login/GoogleLoginButton.tsx (1)
72-79: Make the Docs link locale-aware.The plain
<a href="/docs">anchor won't respect locale prefixes. Users viewing the page in a non-default locale (e.g.,/zh/login) will be taken to/docsinstead of/zh/docs, breaking their language context. Replace with the locale-awareLinkcomponent from@/i18n/routing.surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx (1)
39-57: Avoid deriving translation keys from visible titles; pass explicit keys.String-munging titles to keys is fragile and breaks silently. Prefer item.translationKey (and same for subitems), with a small fallback map if needed. This mirrors prior feedback.
Apply:
// Translate navigation items - const tNavMenu = useTranslations('nav_menu'); - const translatedNavMain = useMemo(() => { - return navMain.map((item) => ({ - ...item, - title: tNavMenu(item.title.toLowerCase().replace(/ /g, '_')), - items: item.items?.map((subItem: any) => ({ - ...subItem, - title: tNavMenu(subItem.title.toLowerCase().replace(/ /g, '_')), - })), - })); - }, [navMain, tNavMenu]); + const tNavMenu = useTranslations('nav_menu'); + const NAV_KEY_MAP: Record<string, string> = { + Researcher: 'researcher', + 'Manage LLMs': 'manage_llms', + Documents: 'documents', + 'Upload Documents': 'upload_documents', + 'Add Webpages': 'add_webpages', + 'Add Youtube Videos': 'add_youtube_videos', + Connectors: 'connectors', + 'Add Connector': 'add_connector', + 'Manage Connectors': 'manage_connectors', + Podcasts: 'podcasts', + Logs: 'logs', + }; + const translatedNavMain = useMemo(() => { + return navMain.map((item: any) => ({ + ...item, + title: item.translationKey ? tNavMenu(item.translationKey) : tNavMenu(NAV_KEY_MAP[item.title] ?? item.title), + items: item.items?.map((subItem: any) => ({ + ...subItem, + title: subItem.translationKey + ? tNavMenu(subItem.translationKey) + : tNavMenu(NAV_KEY_MAP[subItem.title] ?? subItem.title), + })), + })); + }, [navMain, tNavMenu]); - const translatedNavSecondary = useMemo(() => { - return navSecondary.map((item) => ({ - ...item, - title: item.title === 'All Search Spaces' ? tNavMenu('all_search_spaces') : item.title, - })); - }, [navSecondary, tNavMenu]); + const translatedNavSecondary = useMemo(() => { + return navSecondary.map((item: any) => ({ + ...item, + title: item.translationKey ? tNavMenu(item.translationKey) : (item.title === 'All Search Spaces' + ? tNavMenu('all_search_spaces') + : item.title), + })); + }, [navSecondary, tNavMenu]);surfsense_web/components/sidebar/nav-main.tsx (1)
65-78: Use locale-aware Link and stable keys (avoid index).Raw breaks locale-prefixed routes and prefetch; keys using index can re-mount items. Use Link from your i18n routing and URL-based keys.
Apply:
+import { Link } from "@/i18n/routing"; @@ - return ( + return ( <SidebarGroup> @@ - {memoizedItems.map((item, index) => { + {memoizedItems.map((item) => { const translatedTitle = translateTitle(item.title); return ( - <Collapsible key={`${item.title}-${index}`} asChild defaultOpen={item.isActive}> + <Collapsible key={item.url} asChild defaultOpen={item.isActive}> <SidebarMenuItem> <SidebarMenuButton asChild tooltip={translatedTitle} isActive={item.isActive} aria-label={`${translatedTitle}${item.items?.length ? " with submenu" : ""}`} > - <a href={item.url}> + <Link href={item.url}> <item.icon /> <span>{translatedTitle}</span> - </a> + </Link> </SidebarMenuButton>surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
998-1004: Fix incorrect colSpan to reflect visible columns.Static columns.length can desync from the table instance. Use the table API.
- <TableRow> - <TableCell colSpan={columns.length} className="h-24 text-center"> + <TableRow> + <TableCell colSpan={table.getVisibleLeafColumns().length} className="h-24 text-center"> {t('no_logs')} </TableCell> </TableRow>
🧹 Nitpick comments (9)
surfsense_web/components/sidebar/nav-main.tsx (2)
80-101: Localize ARIA copy and subitem links; use stable key.Replace hardcoded ARIA strings and with Link; key by URL.
Apply:
- <SidebarMenuAction - className="data-[state=open]:rotate-90 transition-transform duration-200" - aria-label={`Toggle ${translatedTitle} submenu`} - > + <SidebarMenuAction + className="data-[state=open]:rotate-90 transition-transform duration-200" + aria-label={translatedTitle} + > @@ - {item.items?.map((subItem, subIndex) => { + {item.items?.map((subItem) => { const translatedSubTitle = translateTitle(subItem.title); return ( - <SidebarMenuSubItem key={`${subItem.title}-${subIndex}`}> + <SidebarMenuSubItem key={subItem.url}> <SidebarMenuSubButton asChild aria-label={translatedSubTitle}> - <a href={subItem.url}> + <Link href={subItem.url}> <span>{translatedSubTitle}</span> - </a> + </Link> </SidebarMenuSubButton> </SidebarMenuSubItem> ); })}
34-54: Make translation key mapping explicit in data model, not by English title.Current titleMap still couples to English strings and can drift. Prefer adding an optional translationKey to NavItem and subitems and consuming that directly.
interface NavItem { title: string; url: string; icon: LucideIcon; isActive?: boolean; items?: { - title: string; + title: string; + translationKey?: string; url: string; }[]; + translationKey?: string; } @@ - const translateTitle = (title: string): string => { + const translateTitle = (title: string, key?: string): string => { - const titleMap: Record<string, string> = { /* ... */ }; - const key = titleMap[title]; - return key ? t(key) : title; + return key ? t(key) : title; }; @@ - const translatedTitle = translateTitle(item.title); + const translatedTitle = translateTitle(item.title, (item as any).translationKey);Also applies to: 61-65
surfsense_web/app/dashboard/page.tsx (3)
6-6: Use locale-aware Link to preserve i18n routing.Swap Next’s Link for your i18n-aware Link.
-import Link from "next/link"; +import { Link } from "@/i18n/routing";
10-10: Format dates using the active locale.Avoid hardcoding "en-US". Use useLocale and pass it to formatter.
-import { useTranslations } from "next-intl"; +import { useTranslations, useLocale } from "next-intl"; @@ -const formatDate = (dateString: string): string => { - return new Date(dateString).toLocaleDateString("en-US", { +const formatDate = (dateString: string, locale: string): string => { + return new Date(dateString).toLocaleDateString(locale, { year: "numeric", month: "short", day: "numeric", }); }; @@ -const DashboardPage = () => { +const DashboardPage = () => { + const locale = useLocale(); @@ - <span>{t('created')} {formatDate(space.created_at)}</span> + <span>{t('created')} {formatDate(space.created_at, locale)}</span>Also applies to: 53-59, 248-251, 350-351
221-234: Localize toast messages for delete flow.Hardcoded English toasts break i18n. Use translations and add keys if missing.
- if (!response.ok) { - toast.error("Failed to delete search space"); - throw new Error("Failed to delete search space"); - } + if (!response.ok) { + toast.error(t('error_deleting_space')); + throw new Error('error_deleting_space'); + } @@ - } catch (error) { + } catch (error) { console.error("Error deleting search space:", error); - toast.error("An error occurred while deleting the search space"); + toast.error(t('error_deleting_space')); return; } - toast.success("Search space deleted successfully"); + toast.success(t('delete_search_space_success'));Ensure the corresponding keys exist in messages/en.json and messages/zh.json.
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (4)
866-887: Localize loading/error UI in LogsTable.Replace hardcoded strings to keep logs UI bilingual.
- <div className="h-8 w-8 animate-spin rounded-full border-b-2 border-primary"></div> - <p className="text-sm text-muted-foreground">Loading logs...</p> + <div className="h-8 w-8 animate-spin rounded-full border-b-2 border-primary"></div> + <p className="text-sm text-muted-foreground">{t('loading')}</p> @@ - <p className="text-sm text-destructive">Error loading logs</p> + <p className="text-sm text-destructive">{t('error_loading')}</p> @@ - <Button variant="outline" size="sm" onClick={onRefresh}> - Retry - </Button> + <Button variant="outline" size="sm" onClick={onRefresh}> + {t('retry')} + </Button>
391-401: Stabilize memo dependencies for unique filters.Depending on table.getColumn function references is brittle. Depend on table or the column objects.
-const uniqueLevels = useMemo(() => { - const levelColumn = table.getColumn("level"); - if (!levelColumn) return []; - return Array.from(levelColumn.getFacetedUniqueValues().keys()).sort(); -}, [table.getColumn]); +const uniqueLevels = useMemo(() => { + const levelColumn = table.getColumn("level"); + if (!levelColumn) return []; + return Array.from(levelColumn.getFacetedUniqueValues().keys()).sort(); +}, [table]); @@ -const uniqueStatuses = useMemo(() => { +const uniqueStatuses = useMemo(() => { const statusColumn = table.getColumn("status"); if (!statusColumn) return []; return Array.from(statusColumn.getFacetedUniqueValues().keys()).sort(); -}, [table.getColumn]); +}, [table]);Also applies to: 397-401
175-198: Localize ARIA labels for selection and actions.“Select all”, “Select row”, and sr-only “Actions” headers should be translated for accessibility.
-aria-label="Select all" +aria-label={t('select_all')} @@ -aria-label="Select row" +aria-label={t('select_row')} @@ -<span className="sr-only">{t('actions')}</span> +<span className="sr-only">{t('actions')}</span>Add select_all/select_row keys to logs namespace if absent.
Also applies to: 314-319
1121-1180: Localize row action labels and metadata title.“Log details”, “Close”, “Metadata”, and delete dialog strings should use t().
-<AlertDialogTitle className="text-lg">Log details</AlertDialogTitle> +<AlertDialogTitle className="text-lg">{t('log_details')}</AlertDialogTitle> @@ -<AlertDialogCancel className="text-sm">Close</AlertDialogCancel> +<AlertDialogCancel className="text-sm">{t('close')}</AlertDialogCancel> @@ - title={`Log ${log.id} - Metadata`} + title={`${t('log')} ${log.id} - ${t('metadata')}`}Ensure new keys exist across en/zh.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (37)
surfsense_web/.gitignore(1 hunks)surfsense_web/app/(home)/login/GoogleLoginButton.tsx(4 hunks)surfsense_web/app/(home)/login/LocalLoginForm.tsx(4 hunks)surfsense_web/app/(home)/login/page.tsx(4 hunks)surfsense_web/app/(home)/register/page.tsx(10 hunks)surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx(7 hunks)surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx(20 hunks)surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx(3 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx(13 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx(8 hunks)surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx(12 hunks)surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx(33 hunks)surfsense_web/app/dashboard/[search_space_id]/onboard/page.tsx(8 hunks)surfsense_web/app/dashboard/page.tsx(13 hunks)surfsense_web/app/layout.tsx(2 hunks)surfsense_web/components/LanguageSwitcher.tsx(1 hunks)surfsense_web/components/dashboard-breadcrumb.tsx(7 hunks)surfsense_web/components/onboard/add-provider-step.tsx(9 hunks)surfsense_web/components/onboard/assign-roles-step.tsx(8 hunks)surfsense_web/components/providers/I18nProvider.tsx(1 hunks)surfsense_web/components/sidebar/AppSidebarProvider.tsx(9 hunks)surfsense_web/components/sidebar/nav-main.tsx(2 hunks)surfsense_web/components/sidebar/nav-projects.tsx(5 hunks)surfsense_web/components/sidebar/nav-secondary.tsx(2 hunks)surfsense_web/content/docs/meta.json(1 hunks)surfsense_web/contexts/LocaleContext.tsx(1 hunks)surfsense_web/i18n/request.ts(1 hunks)surfsense_web/i18n/routing.ts(1 hunks)surfsense_web/messages/en.json(1 hunks)surfsense_web/messages/zh.json(1 hunks)surfsense_web/middleware.ts(1 hunks)surfsense_web/next.config.ts(2 hunks)surfsense_web/package.json(1 hunks)
✅ Files skipped from review due to trivial changes (1)
- surfsense_web/content/docs/meta.json
🚧 Files skipped from review as they are similar to previous changes (21)
- surfsense_web/components/providers/I18nProvider.tsx
- surfsense_web/middleware.ts
- surfsense_web/components/sidebar/nav-secondary.tsx
- surfsense_web/components/sidebar/AppSidebarProvider.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx
- surfsense_web/messages/en.json
- surfsense_web/app/dashboard/[search_space_id]/onboard/page.tsx
- surfsense_web/i18n/request.ts
- surfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsx
- surfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsx
- surfsense_web/app/(home)/login/LocalLoginForm.tsx
- surfsense_web/components/onboard/assign-roles-step.tsx
- surfsense_web/components/sidebar/nav-projects.tsx
- surfsense_web/components/onboard/add-provider-step.tsx
- surfsense_web/app/(home)/register/page.tsx
- surfsense_web/contexts/LocaleContext.tsx
- surfsense_web/i18n/routing.ts
- surfsense_web/components/dashboard-breadcrumb.tsx
- surfsense_web/app/layout.tsx
- surfsense_web/package.json
- surfsense_web/components/LanguageSwitcher.tsx
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{jsx,tsx}
📄 CodeRabbit inference engine (.rules/require_unique_id_props.mdc)
**/*.{jsx,tsx}: When mapping arrays to React elements in JSX/TSX, each rendered element must include a unique key prop
Keys used for React list items should be stable, predictable, and unique among siblings
Files:
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsxsurfsense_web/app/dashboard/[search_space_id]/client-layout.tsxsurfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsxsurfsense_web/components/sidebar/nav-main.tsxsurfsense_web/app/dashboard/page.tsxsurfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsxsurfsense_web/app/(home)/login/page.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsxsurfsense_web/app/(home)/login/GoogleLoginButton.tsxsurfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx
**/.gitignore
📄 CodeRabbit inference engine (.rules/no_env_files_in_repo.mdc)
Add .env and similar environment/config files to .gitignore
Files:
surfsense_web/.gitignore
🧬 Code graph analysis (5)
surfsense_web/app/dashboard/[search_space_id]/client-layout.tsx (1)
surfsense_web/components/LanguageSwitcher.tsx (1)
LanguageSwitcher(18-55)
surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx (1)
surfsense_web/contracts/enums/connectorIcons.tsx (1)
getConnectorIcon(22-80)
surfsense_web/components/sidebar/nav-main.tsx (2)
surfsense_web/components/ui/sidebar.tsx (9)
SidebarGroup(669-669)SidebarGroupLabel(672-672)SidebarMenu(676-676)SidebarMenuItem(680-680)SidebarMenuButton(679-679)SidebarMenuAction(677-677)SidebarMenuSub(682-682)SidebarMenuSubItem(684-684)SidebarMenuSubButton(683-683)surfsense_web/components/ui/collapsible.tsx (3)
Collapsible(21-21)CollapsibleTrigger(21-21)CollapsibleContent(21-21)
surfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsx (1)
surfsense_web/hooks/use-connectors.ts (1)
deleteConnector(116-131)
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx (1)
surfsense_web/hooks/use-logs.ts (1)
Log(8-17)
🪛 GitHub Actions: Code Quality Checks
surfsense_web/messages/zh.json
[error] 87-87: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword
[error] 559-559: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword
[error] 560-560: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword
🔇 Additional comments (7)
surfsense_web/.gitignore (1)
51-52: Good addition—cache directory properly ignored.Adding
.pnpm-store/to.gitignoreis appropriate; this pnpm cache directory should not be committed. Placement and formatting align with the file's existing structure.surfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsx (2)
10-10: LGTM: i18n framework properly initialized.The next-intl integration follows the standard pattern with the appropriate namespace for this component.
Also applies to: 27-27
234-254: LGTM: React keys properly implemented.The mapped video preview elements correctly use
key={tag.id}with stable, unique identifiers as required by the coding guidelines.surfsense_web/next.config.ts (1)
3-6: LGTM!The next-intl plugin integration is correctly configured, referencing the i18n request configuration and properly wrapping the Next.js config.
Also applies to: 29-29
surfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsx (1)
13-13: LGTM!The i18n implementation is clean and consistent. All user-facing strings properly use translation keys from the
add_connectornamespace.Also applies to: 242-242, 270-276
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsx (1)
7-7: LGTM!The i18n implementation is correct. Toast messages properly use translation keys, including the success message with count interpolation on line 132.
Also applies to: 26-26, 125-139
surfsense_web/messages/zh.json (1)
87-87: Allowlist i18n message files in gitleaks to resolve false positives on translation labels.Verification confirms the diagnosis: all "API 密钥" occurrences (lines 87, 559–560) are benign UI translation strings. The entropy check found no actual high-entropy tokens—all 67 flagged strings are legitimate Chinese UI text. The Secret Keyword rule is incorrectly flagging
api_key_*patterns in i18n keys.Recommended fix: Add a gitleaks allowlist for
surfsense_web/messages/*.jsontargeting the Secret Keyword rule. This prevents false positives on i18n labels without renaming keys or breaking parity withen.json.
| { | ||
| "common": { | ||
| "app_name": "SurfSense", | ||
| "welcome": "欢迎", | ||
| "loading": "加载中...", | ||
| "save": "保存", | ||
| "cancel": "取消", | ||
| "delete": "删除", | ||
| "edit": "编辑", | ||
| "create": "创建", | ||
| "update": "更新", | ||
| "search": "搜索", | ||
| "close": "关闭", | ||
| "confirm": "确认", | ||
| "back": "返回", | ||
| "next": "下一步", | ||
| "submit": "提交", | ||
| "yes": "是", | ||
| "no": "否", | ||
| "add": "添加", | ||
| "remove": "移除", | ||
| "select": "选择", | ||
| "all": "全部", | ||
| "none": "无", | ||
| "error": "错误", | ||
| "success": "成功", | ||
| "warning": "警告", | ||
| "info": "信息", | ||
| "required": "必填", | ||
| "optional": "可选", | ||
| "retry": "重试" | ||
| }, | ||
| "auth": { | ||
| "login": "登录", | ||
| "register": "注册", | ||
| "logout": "登出", | ||
| "email": "电子邮箱", | ||
| "password": "密码", | ||
| "confirm_password": "确认密码", | ||
| "forgot_password": "忘记密码？", | ||
| "show_password": "显示密码", | ||
| "hide_password": "隐藏密码", | ||
| "remember_me": "记住我", | ||
| "sign_in": "登录", | ||
| "sign_up": "注册", | ||
| "sign_in_with": "使用 {provider} 登录", | ||
| "dont_have_account": "还没有账户？", | ||
| "already_have_account": "已有账户？", | ||
| "reset_password": "重置密码", | ||
| "email_required": "请输入电子邮箱", | ||
| "password_required": "请输入密码", | ||
| "invalid_email": "电子邮箱格式不正确", | ||
| "password_too_short": "密码至少需要 8 个字符", | ||
| "welcome_back": "欢迎回来", | ||
| "create_account": "创建您的账户", | ||
| "login_subtitle": "输入您的凭据以访问您的账户", | ||
| "register_subtitle": "注册以开始使用 SurfSense", | ||
| "or_continue_with": "或继续使用", | ||
| "by_continuing": "继续即表示您同意我们的", | ||
| "terms_of_service": "服务条款", | ||
| "and": "和", | ||
| "privacy_policy": "隐私政策", | ||
| "full_name": "全名", | ||
| "username": "用户名", | ||
| "continue": "继续", | ||
| "back_to_login": "返回登录", | ||
| "login_success": "登录成功", | ||
| "register_success": "账户创建成功", | ||
| "continue_with_google": "使用 Google 继续", | ||
| "cloud_dev_notice": "SurfSense 云版本正在开发中。查看", | ||
| "docs": "文档", | ||
| "cloud_dev_self_hosted": "以获取有关自托管版本的更多信息。", | ||
| "passwords_no_match": "密码不匹配", | ||
| "password_mismatch": "密码不匹配", | ||
| "passwords_no_match_desc": "您输入的密码不一致", | ||
| "creating_account": "正在创建您的账户...", | ||
| "creating_account_btn": "创建中...", | ||
| "redirecting_login": "正在跳转到登录页面..." | ||
| }, | ||
| "dashboard": { | ||
| "title": "仪表盘", | ||
| "search_spaces": "搜索空间", | ||
| "documents": "文档", | ||
| "connectors": "连接器", | ||
| "settings": "设置", | ||
| "researcher": "AI 研究", | ||
| "api_keys": "API 密钥", | ||
| "profile": "个人资料", | ||
| "loading_dashboard": "正在加载仪表盘", | ||
| "checking_auth": "正在检查身份验证...", | ||
| "loading_config": "正在加载配置", | ||
| "checking_llm_prefs": "正在检查您的 LLM 偏好设置...", | ||
| "config_error": "配置错误", | ||
| "failed_load_llm_config": "无法加载您的 LLM 配置", | ||
| "error_loading_chats": "加载对话失败", | ||
| "no_recent_chats": "暂无最近对话", | ||
| "error_loading_space": "加载搜索空间失败", | ||
| "unknown_search_space": "未知搜索空间", | ||
| "delete_chat": "删除对话", | ||
| "delete_chat_confirm": "您确定要删除", | ||
| "action_cannot_undone": "此操作无法撤销。", | ||
| "deleting": "删除中...", | ||
| "surfsense_dashboard": "SurfSense 仪表盘", | ||
| "welcome_message": "欢迎来到您的 SurfSense 仪表盘。", | ||
| "your_search_spaces": "您的搜索空间", | ||
| "create_search_space": "创建搜索空间", | ||
| "add_new_search_space": "添加新的搜索空间", | ||
| "loading": "加载中", | ||
| "fetching_spaces": "正在获取您的搜索空间...", | ||
| "may_take_moment": "这可能需要一些时间", | ||
| "error": "错误", | ||
| "something_wrong": "出现错误", | ||
| "error_details": "错误详情", | ||
| "try_again": "重试", | ||
| "go_home": "返回首页", | ||
| "delete_search_space": "删除搜索空间", | ||
| "delete_space_confirm": "您确定要删除\"{name}\"吗？此操作无法撤销。此搜索空间中的所有文档、对话和播客将被永久删除。", | ||
| "no_spaces_found": "未找到搜索空间", | ||
| "create_first_space": "创建您的第一个搜索空间以开始使用", | ||
| "created": "创建于" | ||
| }, | ||
| "navigation": { | ||
| "home": "首页", | ||
| "docs": "文档", | ||
| "pricing": "定价", | ||
| "contact": "联系我们", | ||
| "login": "登录", | ||
| "register": "注册", | ||
| "dashboard": "仪表盘", | ||
| "sign_in": "登录", | ||
| "book_a_call": "预约咨询" | ||
| }, | ||
| "nav_menu": { | ||
| "platform": "平台", | ||
| "researcher": "AI 研究", | ||
| "manage_llms": "管理 LLM", | ||
| "documents": "文档", | ||
| "upload_documents": "上传文档", | ||
| "add_webpages": "添加网页", | ||
| "add_youtube": "添加 YouTube 视频", | ||
| "add_youtube_videos": "添加 YouTube 视频", | ||
| "manage_documents": "管理文档", | ||
| "connectors": "连接器", | ||
| "add_connector": "添加连接器", | ||
| "manage_connectors": "管理连接器", | ||
| "podcasts": "播客", | ||
| "logs": "日志", | ||
| "all_search_spaces": "所有搜索空间" | ||
| }, | ||
| "pricing": { | ||
| "title": "SurfSense 定价", | ||
| "subtitle": "选择适合您的方案", | ||
| "community_name": "社区版", | ||
| "enterprise_name": "企业版", | ||
| "forever": "永久", | ||
| "contact_us": "联系我们", | ||
| "feature_llms": "支持 100+ 种 LLM", | ||
| "feature_ollama": "支持本地 Ollama 或 vLLM 部署", | ||
| "feature_embeddings": "6000+ 种嵌入模型", | ||
| "feature_files": "支持 50+ 种文件扩展名", | ||
| "feature_podcasts": "支持播客与本地 TTS 提供商", | ||
| "feature_sources": "连接 15+ 种外部数据源", | ||
| "feature_extension": "跨浏览器扩展支持动态网页，包括需要身份验证的内容", | ||
| "upcoming_mindmaps": "即将推出：可合并思维导图", | ||
| "upcoming_notes": "即将推出：笔记管理", | ||
| "community_desc": "开源版本，功能强大", | ||
| "get_started": "开始使用", | ||
| "everything_community": "包含社区版所有功能", | ||
| "priority_support": "优先支持", | ||
| "access_controls": "访问控制", | ||
| "collaboration": "协作和多人功能", | ||
| "video_gen": "视频生成", | ||
| "advanced_security": "高级安全功能", | ||
| "enterprise_desc": "为有特定需求的大型组织提供", | ||
| "contact_sales": "联系销售" | ||
| }, | ||
| "contact": { | ||
| "title": "联系我们", | ||
| "subtitle": "我们很乐意听到您的声音", | ||
| "we_are_here": "我们在这里", | ||
| "full_name": "全名", | ||
| "email_address": "电子邮箱地址", | ||
| "company": "公司", | ||
| "message": "留言", | ||
| "optional": "可选", | ||
| "name_placeholder": "张三", | ||
| "email_placeholder": "[email protected]", | ||
| "company_placeholder": "示例公司", | ||
| "message_placeholder": "在此输入您的留言", | ||
| "submit": "提交", | ||
| "submitting": "提交中...", | ||
| "name_required": "请输入姓名", | ||
| "name_too_long": "姓名过长", | ||
| "invalid_email": "电子邮箱格式不正确", | ||
| "email_too_long": "电子邮箱过长", | ||
| "company_required": "请输入公司名称", | ||
| "company_too_long": "公司名称过长", | ||
| "message_sent": "消息已成功发送！", | ||
| "we_will_contact": "我们会尽快与您联系。", | ||
| "send_failed": "发送消息失败", | ||
| "try_again_later": "请稍后重试。", | ||
| "something_wrong": "出错了" | ||
| }, | ||
| "researcher": { | ||
| "loading": "加载中...", | ||
| "select_documents": "选择文档", | ||
| "select_documents_desc": "选择要包含在研究上下文中的文档", | ||
| "loading_documents": "正在加载文档...", | ||
| "select_connectors": "选择连接器", | ||
| "select_connectors_desc": "选择要包含在研究中的数据源", | ||
| "clear_all": "全部清除", | ||
| "select_all": "全部选择", | ||
| "scope": "范围", | ||
| "documents": "文档", | ||
| "docs": "文档", | ||
| "chunks": "块", | ||
| "mode": "模式", | ||
| "research_mode": "研究模式", | ||
| "mode_qna": "问答", | ||
| "mode_general": "通用报告", | ||
| "mode_general_short": "通用", | ||
| "mode_deep": "深度报告", | ||
| "mode_deep_short": "深度", | ||
| "mode_deeper": "更深度报告", | ||
| "mode_deeper_short": "更深", | ||
| "fast_llm": "快速 LLM", | ||
| "select_llm": "选择 LLM", | ||
| "fast_llm_selection": "快速 LLM 选择", | ||
| "no_llm_configs": "未配置 LLM", | ||
| "configure_llm_to_start": "配置 AI 模型以开始使用", | ||
| "open_settings": "打开设置", | ||
| "start_surfing": "开始探索", | ||
| "through_knowledge_base": "您的知识库。", | ||
| "all_connectors": "所有连接器", | ||
| "connectors_selected": "{count} 个连接器", | ||
| "placeholder": "问我任何问题..." | ||
| }, | ||
| "connectors": { | ||
| "title": "连接器", | ||
| "subtitle": "管理您的已连接服务和数据源。", | ||
| "add_connector": "添加连接器", | ||
| "your_connectors": "您的连接器", | ||
| "view_manage": "查看和管理您的所有已连接服务。", | ||
| "no_connectors": "未找到连接器", | ||
| "no_connectors_desc": "您还没有添加任何连接器。添加一个来增强您的搜索能力。", | ||
| "add_first": "添加您的第一个连接器", | ||
| "name": "名称", | ||
| "type": "类型", | ||
| "last_indexed": "最后索引", | ||
| "periodic": "定期", | ||
| "actions": "操作", | ||
| "never": "从未", | ||
| "not_indexable": "不可索引", | ||
| "index_date_range": "按日期范围索引", | ||
| "quick_index": "快速索引", | ||
| "quick_index_auto": "快速索引（自动日期范围）", | ||
| "delete_connector": "删除连接器", | ||
| "delete_confirm": "您确定要删除此连接器吗？此操作无法撤销。", | ||
| "select_date_range": "选择索引日期范围", | ||
| "select_date_range_desc": "选择索引内容的开始和结束日期。留空以使用默认范围。", | ||
| "start_date": "开始日期", | ||
| "end_date": "结束日期", | ||
| "pick_date": "选择日期", | ||
| "clear_dates": "清除日期", | ||
| "last_30_days": "最近 30 天", | ||
| "last_year": "去年", | ||
| "start_indexing": "开始索引", | ||
| "failed_load": "加载连接器失败", | ||
| "delete_success": "连接器删除成功", | ||
| "delete_failed": "删除连接器失败", | ||
| "indexing_started": "连接器内容索引已开始", | ||
| "indexing_failed": "索引连接器内容失败" | ||
| }, | ||
| "documents": { | ||
| "title": "文档", | ||
| "subtitle": "管理您的文档和文件。", | ||
| "no_rows_selected": "未选择任何行", | ||
| "delete_success_count": "成功删除 {count} 个文档", | ||
| "delete_partial_failed": "部分文档无法删除", | ||
| "delete_error": "删除文档时出错", | ||
| "filter_by_title": "按标题筛选...", | ||
| "bulk_delete": "删除所选", | ||
| "filter_types": "筛选类型", | ||
| "columns": "列", | ||
| "confirm_delete": "确认删除", | ||
| "confirm_delete_desc": "您确定要删除 {count} 个文档吗？此操作无法撤销。", | ||
| "uploading": "上传中...", | ||
| "upload_success": "文档上传成功", | ||
| "upload_failed": "上传文档失败", | ||
| "loading": "正在加载文档...", | ||
| "error_loading": "加载文档时出错", | ||
| "retry": "重试", | ||
| "no_documents": "未找到文档", | ||
| "type": "类型", | ||
| "content_summary": "内容摘要", | ||
| "view_full": "查看完整内容", | ||
| "filter_placeholder": "按标题筛选...", | ||
| "rows_per_page": "每页行数" | ||
| }, | ||
| "add_connector": { | ||
| "title": "连接您的工具", | ||
| "subtitle": "集成您喜欢的服务以增强研究能力。", | ||
| "search_engines": "搜索引擎", | ||
| "team_chats": "团队聊天", | ||
| "project_management": "项目管理", | ||
| "knowledge_bases": "知识库", | ||
| "communication": "通讯", | ||
| "connect": "连接", | ||
| "coming_soon": "即将推出", | ||
| "connected": "已连接", | ||
| "manage": "管理", | ||
| "tavily_desc": "使用 Tavily API 搜索网络", | ||
| "searxng_desc": "使用您自己的 SearxNG 元搜索实例获取网络结果。", | ||
| "linkup_desc": "使用 Linkup API 搜索网络", | ||
| "elasticsearch_desc": "连接到 Elasticsearch 以索引和搜索文档、日志和指标。", | ||
| "baidu_desc": "使用百度 AI 搜索 API 搜索中文网络", | ||
| "slack_desc": "连接到您的 Slack 工作区以访问消息和频道。", | ||
| "teams_desc": "连接到 Microsoft Teams 以访问团队对话。", | ||
| "discord_desc": "连接到 Discord 服务器以访问消息和频道。", | ||
| "linear_desc": "连接到 Linear 以搜索问题、评论和项目数据。", | ||
| "jira_desc": "连接到 Jira 以搜索问题、工单和项目数据。", | ||
| "clickup_desc": "连接到 ClickUp 以搜索任务、评论和项目数据。", | ||
| "notion_desc": "连接到您的 Notion 工作区以访问页面和数据库。", | ||
| "github_desc": "连接 GitHub PAT 以索引可访问存储库的代码和文档。", | ||
| "confluence_desc": "连接到 Confluence 以搜索页面、评论和文档。", | ||
| "airtable_desc": "连接到 Airtable 以搜索记录、表格和数据库内容。", | ||
| "luma_desc": "连接到 Luma 以搜索活动", | ||
| "calendar_desc": "连接到 Google 日历以搜索活动、会议和日程。", | ||
| "gmail_desc": "连接到您的 Gmail 账户以搜索您的电子邮件。", | ||
| "zoom_desc": "连接到 Zoom 以访问会议录制和转录。" | ||
| }, | ||
| "upload_documents": { | ||
| "title": "上传文档", | ||
| "subtitle": "上传您的文件，使其可通过 AI 对话进行搜索和访问。", | ||
| "file_size_limit": "最大文件大小：每个文件 50MB。支持的格式因您的 ETL 服务配置而异。", | ||
| "drop_files": "放下文件到这里", | ||
| "drag_drop": "拖放文件到这里", | ||
| "or_browse": "或点击浏览", | ||
| "browse_files": "浏览文件", | ||
| "selected_files": "已选择的文件 ({count})", | ||
| "total_size": "总大小", | ||
| "clear_all": "全部清除", | ||
| "uploading_files": "正在上传文件...", | ||
| "uploading": "上传中...", | ||
| "upload_button": "上传 {count} 个文件", | ||
| "upload_initiated": "上传任务已启动", | ||
| "upload_initiated_desc": "文件上传已开始", | ||
| "upload_error": "上传错误", | ||
| "upload_error_desc": "上传文件时出错", | ||
| "supported_file_types": "支持的文件类型", | ||
| "file_types_desc": "根据您当前的 ETL 服务配置支持这些文件类型。" | ||
| }, | ||
| "add_webpage": { | ||
| "title": "添加网页爬取", | ||
| "subtitle": "输入要爬取的 URL 并添加到您的文档集合", | ||
| "label": "输入要爬取的 URL", | ||
| "placeholder": "输入 URL 并按 Enter", | ||
| "hint": "按 Enter 键添加多个 URL", | ||
| "tips_title": "URL 爬取提示：", | ||
| "tip_1": "输入完整的 URL，包括 http:// 或 https://", | ||
| "tip_2": "确保网站允许爬取", | ||
| "tip_3": "公开网页效果最佳", | ||
| "tip_4": "爬取时间可能会根据网站大小而有所不同", | ||
| "cancel": "取消", | ||
| "submit": "提交 URL 进行爬取", | ||
| "submitting": "提交中...", | ||
| "error_no_url": "请至少添加一个 URL", | ||
| "error_invalid_urls": "检测到无效的 URL：{urls}", | ||
| "crawling_toast": "URL 爬取", | ||
| "crawling_toast_desc": "开始 URL 爬取过程...", | ||
| "success_toast": "爬取成功", | ||
| "success_toast_desc": "URL 已提交爬取", | ||
| "error_toast": "爬取错误", | ||
| "error_toast_desc": "爬取 URL 时出错", | ||
| "error_generic": "爬取 URL 时发生错误", | ||
| "invalid_url_toast": "无效的 URL", | ||
| "invalid_url_toast_desc": "请输入有效的 URL", | ||
| "duplicate_url_toast": "重复的 URL", | ||
| "duplicate_url_toast_desc": "此 URL 已添加" | ||
| }, | ||
| "add_youtube": { | ||
| "title": "添加 YouTube 视频", | ||
| "subtitle": "输入 YouTube 视频 URL 以添加到您的文档集合", | ||
| "label": "输入 YouTube 视频 URL", | ||
| "placeholder": "输入 YouTube URL 并按 Enter", | ||
| "hint": "按 Enter 键添加多个 YouTube URL", | ||
| "tips_title": "添加 YouTube 视频的提示：", | ||
| "tip_1": "使用标准 YouTube URL（youtube.com/watch?v= 或 youtu.be/）", | ||
| "tip_2": "确保视频可公开访问", | ||
| "tip_3": "支持的格式：youtube.com/watch?v=VIDEO_ID 或 youtu.be/VIDEO_ID", | ||
| "tip_4": "处理时间可能会根据视频长度而有所不同", | ||
| "preview": "预览", | ||
| "cancel": "取消", | ||
| "submit": "提交 YouTube 视频", | ||
| "processing": "处理中...", | ||
| "error_no_video": "请至少添加一个 YouTube 视频 URL", | ||
| "error_invalid_urls": "检测到无效的 YouTube URL：{urls}", | ||
| "processing_toast": "YouTube 视频处理", | ||
| "processing_toast_desc": "开始 YouTube 视频处理...", | ||
| "success_toast": "处理成功", | ||
| "success_toast_desc": "YouTube 视频已提交处理", | ||
| "error_toast": "处理错误", | ||
| "error_toast_desc": "处理 YouTube 视频时出错", | ||
| "error_generic": "处理 YouTube 视频时发生错误", | ||
| "invalid_url_toast": "无效的 YouTube URL", | ||
| "invalid_url_toast_desc": "请输入有效的 YouTube 视频 URL", | ||
| "duplicate_url_toast": "重复的 URL", | ||
| "duplicate_url_toast_desc": "此 YouTube 视频已添加" | ||
| }, | ||
| "settings": { | ||
| "title": "设置", | ||
| "subtitle": "管理此搜索空间的 LLM 配置和角色分配。", | ||
| "back_to_dashboard": "返回仪表盘", | ||
| "model_configs": "模型配置", | ||
| "models": "模型", | ||
| "llm_roles": "LLM 角色", | ||
| "roles": "角色", | ||
| "llm_role_management": "LLM 角色管理", | ||
| "llm_role_desc": "为不同用途分配您的 LLM 配置到特定角色。", | ||
| "no_llm_configs_found": "未找到 LLM 配置。在分配角色之前，请在模型配置选项卡中至少添加一个 LLM 提供商。", | ||
| "select_llm_config": "选择 LLM 配置", | ||
| "long_context_llm": "长上下文 LLM", | ||
| "fast_llm": "快速 LLM", | ||
| "strategic_llm": "战略 LLM", | ||
| "long_context_desc": "处理需要广泛上下文理解和推理的复杂任务", | ||
| "long_context_examples": "文档分析、研究综合、复杂问答", | ||
| "large_context_window": "大型上下文窗口", | ||
| "deep_reasoning": "深度推理", | ||
| "complex_analysis": "复杂分析", | ||
| "fast_llm_desc": "针对快速响应和实时交互进行优化", | ||
| "fast_llm_examples": "快速搜索、简单问题、即时响应", | ||
| "low_latency": "低延迟", | ||
| "quick_responses": "快速响应", | ||
| "real_time_chat": "实时对话", | ||
| "strategic_llm_desc": "用于规划和战略决策的高级推理", | ||
| "strategic_llm_examples": "规划工作流、战略分析、复杂问题解决", | ||
| "strategic_thinking": "战略思维", | ||
| "long_term_planning": "长期规划", | ||
| "complex_reasoning": "复杂推理", | ||
| "use_cases": "使用场景", | ||
| "assign_llm_config": "分配 LLM 配置", | ||
| "unassigned": "未分配", | ||
| "assigned": "已分配", | ||
| "model": "模型", | ||
| "base": "基础地址", | ||
| "all_roles_assigned": "所有角色已分配并准备使用！您的 LLM 配置已完成。", | ||
| "save_changes": "保存更改", | ||
| "saving": "保存中...", | ||
| "reset": "重置", | ||
| "status": "状态", | ||
| "status_ready": "就绪", | ||
| "status_setup": "设置中", | ||
| "complete_role_assignments": "完成所有角色分配以启用完整功能。每个角色在您的工作流中都有不同的用途。", | ||
| "all_roles_saved": "所有角色已分配并保存！", | ||
| "progress": "进度", | ||
| "roles_assigned_count": "{assigned} / {total} 个角色已分配" | ||
| }, | ||
| "podcasts": { | ||
| "title": "播客", | ||
| "subtitle": "收听生成的播客。", | ||
| "search_placeholder": "搜索播客...", | ||
| "sort_order": "排序方式", | ||
| "newest_first": "最新优先", | ||
| "oldest_first": "最旧优先", | ||
| "loading": "正在加载播客...", | ||
| "error_loading": "加载播客时出错", | ||
| "no_podcasts": "未找到播客", | ||
| "adjust_filters": "尝试调整搜索条件", | ||
| "generate_hint": "从您的聊天中生成播客以开始使用", | ||
| "loading_podcast": "正在加载播客...", | ||
| "now_playing": "正在播放", | ||
| "delete_podcast": "删除播客", | ||
| "delete_confirm_1": "您确定要删除", | ||
| "delete_confirm_2": "此操作无法撤销。", | ||
| "cancel": "取消", | ||
| "delete": "删除", | ||
| "deleting": "删除中..." | ||
| }, | ||
| "logs": { | ||
| "title": "任务日志", | ||
| "subtitle": "监控和分析所有任务执行日志", | ||
| "refresh": "刷新", | ||
| "delete_selected": "删除所选", | ||
| "confirm_title": "您确定要这样做吗？", | ||
| "confirm_delete_desc": "此操作无法撤销。这将永久删除 {count} 个所选日志。", | ||
| "cancel": "取消", | ||
| "delete": "删除", | ||
| "level": "级别", | ||
| "status": "状态", | ||
| "source": "来源", | ||
| "message": "消息", | ||
| "created_at": "创建时间", | ||
| "actions": "操作", | ||
| "system": "系统", | ||
| "filter_by_message": "按消息筛选...", | ||
| "filter_by": "筛选", | ||
| "total_logs": "总日志数", | ||
| "active_tasks": "活动任务", | ||
| "success_rate": "成功率", | ||
| "recent_failures": "最近失败", | ||
| "last_hours": "最近 {hours} 小时", | ||
| "currently_running": "当前运行中", | ||
| "successful": "成功", | ||
| "need_attention": "需要注意", | ||
| "no_logs": "未找到日志", | ||
| "loading": "正在加载日志...", | ||
| "error_loading": "加载日志时出错", | ||
| "columns": "列", | ||
| "failed_load_summary": "加载摘要失败", | ||
| "retry": "重试", | ||
| "view": "查看", | ||
| "toggle_columns": "切换列", | ||
| "rows_per_page": "每页行数", | ||
| "view_metadata": "查看元数据", | ||
| "log_deleted_success": "日志已成功删除", | ||
| "log_deleted_error": "删除日志失败", | ||
| "confirm_delete_log_title": "确定要删除吗？", | ||
| "confirm_delete_log_desc": "此操作无法撤销。这将永久删除该日志条目。", | ||
| "deleting": "删除中..." | ||
| }, | ||
| "onboard": { | ||
| "welcome_title": "欢迎来到 SurfSense", | ||
| "welcome_subtitle": "让我们配置您的 LLM 以开始使用", | ||
| "step_of": "第 {current} 步，共 {total} 步", | ||
| "percent_complete": "已完成 {percent}%", | ||
| "add_llm_provider": "添加 LLM 提供商", | ||
| "assign_llm_roles": "分配 LLM 角色", | ||
| "setup_complete": "设置完成", | ||
| "configure_first_provider": "配置您的第一个模型提供商", | ||
| "assign_specific_roles": "为您的 LLM 配置分配特定角色", | ||
| "all_set": "您已准备好开始使用 SurfSense！", | ||
| "loading_config": "正在加载您的配置...", | ||
| "previous": "上一步", | ||
| "next": "下一步", | ||
| "complete_setup": "完成设置", | ||
| "add_provider_instruction": "至少添加一个 LLM 提供商才能继续。您可以配置多个提供商，并在下一步为每个提供商选择特定角色。", | ||
| "your_llm_configs": "您的 LLM 配置", | ||
| "model": "模型", | ||
| "language": "语言", | ||
| "base": "基础地址", | ||
| "add_provider_title": "添加 LLM 提供商", | ||
| "add_provider_subtitle": "配置您的第一个模型提供商以开始使用", | ||
| "add_provider_button": "添加提供商", | ||
| "add_new_llm_provider": "添加新的 LLM 提供商", | ||
| "configure_new_provider": "为您的 AI 助手配置新的语言模型提供商", | ||
| "config_name": "配置名称", | ||
| "config_name_required": "配置名称 *", | ||
| "config_name_placeholder": "例如：我的 OpenAI GPT-4", | ||
| "provider": "提供商", | ||
| "provider_required": "提供商 *", | ||
| "provider_placeholder": "选择提供商", | ||
| "language_optional": "语言（可选）", | ||
| "language_placeholder": "选择语言", | ||
| "custom_provider_name": "自定义提供商名称 *", | ||
| "custom_provider_placeholder": "例如：my-custom-provider", | ||
| "model_name_required": "模型名称 *", | ||
| "model_name_placeholder": "例如：gpt-4", | ||
| "examples": "示例", | ||
| "api_key_required": "API 密钥 *", | ||
| "api_key_placeholder": "您的 API 密钥", | ||
| "api_base_optional": "API 基础 URL（可选）", | ||
| "api_base_placeholder": "例如：https://api.openai.com/v1", | ||
| "adding": "添加中...", | ||
| "add_provider": "添加提供商", | ||
| "cancel": "取消", | ||
| "assign_roles_instruction": "为您的 LLM 配置分配特定角色。每个角色在您的工作流程中有不同的用途。", | ||
| "no_llm_configs_found": "未找到 LLM 配置", | ||
| "add_provider_before_roles": "在分配角色之前，请先在上一步中添加至少一个 LLM 提供商。", | ||
| "long_context_llm_title": "长上下文 LLM", | ||
| "long_context_llm_desc": "处理需要广泛上下文理解和推理的复杂任务", | ||
| "long_context_llm_examples": "文档分析、研究综合、复杂问答", | ||
| "fast_llm_title": "快速 LLM", | ||
| "fast_llm_desc": "针对快速响应和实时交互进行优化", | ||
| "fast_llm_examples": "快速搜索、简单问题、即时响应", | ||
| "strategic_llm_title": "战略 LLM", | ||
| "strategic_llm_desc": "用于规划和战略决策的高级推理", | ||
| "strategic_llm_examples": "规划工作流、战略分析、复杂问题解决", | ||
| "use_cases": "使用场景", | ||
| "assign_llm_config": "分配 LLM 配置", | ||
| "select_llm_config": "选择 LLM 配置", | ||
| "assigned": "已分配", | ||
| "all_roles_assigned_saved": "所有角色已分配并保存！", | ||
| "progress": "进度", | ||
| "roles_assigned": "{assigned}/{total} 个角色已分配" | ||
| }, | ||
| "model_config": { | ||
| "title": "模型配置", | ||
| "subtitle": "管理您的 LLM 提供商配置和 API 设置。", | ||
| "refresh": "刷新", | ||
| "loading": "正在加载配置...", | ||
| "total_configs": "配置总数", | ||
| "unique_providers": "独立提供商", | ||
| "system_status": "系统状态", | ||
| "active": "活跃", | ||
| "your_configs": "您的配置", | ||
| "manage_configs": "管理和配置您的 LLM 提供商", | ||
| "add_config": "添加配置", | ||
| "no_configs": "暂无配置", | ||
| "no_configs_desc": "开始添加您的第一个 LLM 提供商配置以开始使用系统。", | ||
| "add_first_config": "添加首个配置", | ||
| "created": "创建于" | ||
| }, | ||
| "breadcrumb": { | ||
| "dashboard": "仪表盘", | ||
| "search_space": "搜索空间", | ||
| "researcher": "AI 研究", | ||
| "documents": "文档", | ||
| "connectors": "连接器", | ||
| "podcasts": "播客", | ||
| "logs": "日志", | ||
| "chats": "聊天", | ||
| "settings": "设置", | ||
| "upload_documents": "上传文档", | ||
| "add_youtube": "添加 YouTube 视频", | ||
| "add_webpages": "添加网页", | ||
| "add_connector": "添加连接器", | ||
| "manage_connectors": "管理连接器", | ||
| "edit_connector": "编辑连接器", | ||
| "manage": "管理" | ||
| }, | ||
| "sidebar": { | ||
| "recent_chats": "最近对话", | ||
| "search_chats": "搜索对话...", | ||
| "no_chats_found": "未找到对话", | ||
| "no_recent_chats": "暂无最近对话", | ||
| "view_all_chats": "查看所有对话", | ||
| "search_space": "搜索空间" | ||
| }, | ||
| "errors": { | ||
| "something_went_wrong": "出错了", | ||
| "try_again": "请重试", | ||
| "not_found": "未找到", | ||
| "unauthorized": "未授权", | ||
| "forbidden": "禁止访问", | ||
| "server_error": "服务器错误", | ||
| "network_error": "网络错误" | ||
| }, | ||
| "homepage": { | ||
| "hero_title_part1": "AI 工作空间", | ||
| "hero_title_part2": "为团队而生", | ||
| "hero_description": "将任何 LLM 连接到您的内部知识库，与团队实时协作对话。", | ||
| "cta_start_trial": "开始免费试用", | ||
| "cta_explore": "探索更多", | ||
| "integrations_title": "集成", | ||
| "integrations_subtitle": "与您团队最重要的工具集成", | ||
| "features_title": "团队的 AI 驱动知识中心", | ||
| "features_subtitle": "强大的功能，旨在增强协作、提升生产力并简化您的工作流程。", | ||
| "feature_workflow_title": "简化工作流程", | ||
| "feature_workflow_desc": "在一个智能工作空间中集中管理所有知识和资源。即时找到所需内容，加速决策制定。", | ||
| "feature_collaboration_title": "无缝协作", | ||
| "feature_collaboration_desc": "通过实时协作工具轻松协同工作，保持整个团队同步一致。", | ||
| "feature_customizable_title": "完全可定制", | ||
| "feature_customizable_desc": "从 100 多个领先的 LLM 中选择，按需无缝调用任何模型。", | ||
| "cta_transform": "转变团队的", | ||
| "cta_transform_bold": "发现和协作方式", | ||
| "cta_unite_start": "将您的", | ||
| "cta_unite_knowledge": "团队知识", | ||
| "cta_unite_middle": "集中在一个协作空间，配备", | ||
| "cta_unite_search": "智能搜索", | ||
| "cta_talk_to_us": "联系我们", | ||
| "features": { | ||
| "find_ask_act": { | ||
| "title": "查找、提问、行动", | ||
| "description": "跨公司和个人知识库获取即时信息、详细更新和引用答案。" | ||
| }, | ||
| "real_time_collab": { | ||
| "title": "实时协作", | ||
| "description": "将您的公司文档转变为多人协作空间，支持实时编辑、同步内容和在线状态。" | ||
| }, | ||
| "beyond_text": { | ||
| "title": "超越文本的协作", | ||
| "description": "创建播客和多媒体内容，您的团队可以一起评论、分享和完善。" | ||
| }, | ||
| "context_counts": { | ||
| "title": "关键时刻的上下文", | ||
| "description": "直接在聊天和文档中添加评论，获得清晰、即时的反馈。" | ||
| }, | ||
| "citation_illustration_title": "引用功能图示，显示可点击的来源参考", | ||
| "referenced_chunk": "引用片段", | ||
| "collab_illustration_label": "文本编辑器中实时协作的图示。", | ||
| "real_time": "实时", | ||
| "collab_part1": "协", | ||
| "collab_part2": "作", | ||
| "collab_part3": "", | ||
| "annotation_illustration_label": "带注释评论的文本编辑器图示。", | ||
| "add_context_with": "添加上下文", | ||
| "comments": "评论", | ||
| "example_comment": "我们明天讨论这个！" | ||
| } | ||
| } | ||
| } |
There was a problem hiding this comment.
🧩 Analysis chain
Verify en/zh key parity and placeholder variables.
Avoid runtime “missing translation” by ensuring zh.json keys and ICU variables match en.json.
🏁 Script executed:
#!/bin/bash
# Compare nested keys and ICU placeholders between en.json and zh.json
python - << 'PY'
import json, re
from pathlib import Path
def flatten(d, prefix=""):
out={}
if isinstance(d, dict):
for k,v in d.items():
out.update(flatten(v, f"{prefix}.{k}" if prefix else k))
else:
out[prefix]=d
return out
def placeholders(s:str):
return set(re.findall(r"\{([a-zA-Z0-9_]+)\}", s)) if isinstance(s,str) else set()
en = json.loads(Path("surfsense_web/messages/en.json").read_text(encoding="utf-8"))
zh = json.loads(Path("surfsense_web/messages/zh.json").read_text(encoding="utf-8"))
en_f = flatten(en); zh_f = flatten(zh)
en_keys=set(en_f.keys()); zh_keys=set(zh_f.keys())
missing_in_zh = sorted(en_keys - zh_keys)
extra_in_zh = sorted(zh_keys - en_keys)
print("Missing in zh:", len(missing_in_zh))
for k in missing_in_zh[:50]: print("-", k)
print("\nExtra in zh:", len(extra_in_zh))
for k in extra_in_zh[:50]: print("-", k)
mismatch=[]
for k in en_keys & zh_keys:
if placeholders(en_f[k]) != placeholders(zh_f[k]):
mismatch.append((k, placeholders(en_f[k]), placeholders(zh_f[k])))
print("\nPlaceholder mismatches:", len(mismatch))
for k,a,b in mismatch[:50]:
print(f"- {k} :: en={sorted(a)} zh={sorted(b)}")
PYLength of output: 138
I found a placeholder mismatch. Let me retrieve the English version to see the exact pattern:Now let me check the actual en.json file to see the exact pattern:Let me run a script to inspect the actual en.json file to see the exact placeholder structure:
Fix missing placeholder variables in zh.json upload_documents.upload_button
The verification found one critical mismatch: upload_documents.upload_button in zh.json is missing the file and files placeholders that exist in en.json. The English version uses ICU MessageFormat pluralization syntax (e.g., {count, plural, file {…} files {…}}), but the Chinese translation only has {count} and uses a generic form: "上传 {count} 个文件".
This will cause runtime errors or incorrect display when the formatter attempts to substitute the missing file and files variables. Update zh.json to include these placeholders to match the English structure.
🧰 Tools
🪛 GitHub Actions: Code Quality Checks
[error] 87-87: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword
[error] 559-559: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword
[error] 560-560: Detect secrets: Potential secrets about to be committed to git repo! Secret Type: Secret Keyword
🤖 Prompt for AI Agents
In surfsense_web/messages/zh.json around lines 1-691 (specifically
upload_documents.upload_button), the translation is missing the ICU plural
placeholders present in en.json—en.json uses a pluralized form with nested
placeholders for "file" and "files" (e.g., {count, plural, one {…file {file}…}
other {…files {files}…}}); update the zh.json key to use the same ICU
MessageFormat pattern and include the required "file" and "files" placeholder
variables so the formatter receives the same parameters as en.json and avoids
runtime errors.
|
@unitagain Thanks. Looks good to me. Thanks for your work. |
|
@MODSetter Just to clarify the state on my end:
So the i18n changes themselves are fully validated via Docker; the docs build error remains the upstream quirk we talked about. |
2 participants
feat(i18n): Add next-intl framework with full bilingual support (EN/ZH)
Description
Implements a scalable internationalization framework using
next-intlfor Next.js 14 App Router. Includes complete Chinese (Simplified) localization with 400+ translated strings across the application.Adding a new language now requires only creating a JSON file and adding one line to the config.
Key Features
next-intl(server/client component support)Changes Overview
Frontend - i18n Framework
Core Infrastructure
i18n/routing.ts- Locale configurationi18n/request.ts- Server-side i18n setupmiddleware.ts- Locale detection and routingnext.config.ts- next-intl plugin integrationcontexts/LocaleContext.tsx- Client-side locale statecomponents/LanguageSwitcher.tsx- Language selector UIcomponents/providers/I18nProvider.tsx- i18n provider wrapperTranslation Files
messages/en.json- English (400+ keys)messages/zh.json- Chinese (400+ keys)Frontend - Component Updates (48 files)
All major components refactored to use
useTranslations()hook:Namespace organization:
common.*- Shared UI elementsdashboard.*,researcher.*,connectors.*,documents.*,settings.*,onboard.*,homepage.*,auth.*, etc.Backend - Code Quality
app/routes/documents_routes.py- Cleaned up merge conflictsapp/users.py- Removed unused importsConfiguration
surfsense_web/.gitignore- Added.pnpm-store/exclusionAPI Changes
☐ This PR includes API changes
No API changes. Frontend-only modifications.
Types of changes
Testing
Environment: Windows 11, Docker Compose, PostgreSQL 15, Next.js 14, Edge
Framework:
Localization:
Regression:
Coverage: Homepage 100%, Auth 100%, Dashboard 100%, Researcher 100%, Connectors 100%, Documents 90%, Settings 95%, Onboarding 100%
Migration Guide
End Users: Use language switcher (🌐) in navigation bar. No other action needed.
Adding a new language:
Using translations in code:
Additional Notes
Technical choices:
next-intl: Best Next.js 14+ integration, server component supportScreenshots
2_20251026_05512346.mp4
3_20251026_05525302.mp4
This establishes a production-ready i18n framework. Adding new languages now takes ~30 minutes of translation work.
High-level PR Summary
This PR implements comprehensive internationalization (i18n) support for the SurfSense application, adding English/Chinese bilingual functionality across 50+ components. The implementation uses
next-intlfor Next.js 14 with client-side locale management, includes 400+ translated strings organized into namespaces, and provides a LanguageSwitcher component with persistent user preferences stored inlocalStorage. The framework is designed for scalability, allowing new languages to be added by simply creating a JSON file and updating a config line. The changes are frontend-focused with zero breaking changes and include two minor backend cleanups (merge conflict resolution and unused import removal).⏱️ Estimated Review Time: 30-90 minutes
💡 Review Order Suggestion
surfsense_web/i18n/routing.tssurfsense_web/i18n/request.tssurfsense_web/contexts/LocaleContext.tsxsurfsense_web/components/providers/I18nProvider.tsxsurfsense_web/components/LanguageSwitcher.tsxsurfsense_web/messages/en.jsonsurfsense_web/messages/zh.jsonsurfsense_web/next.config.tssurfsense_web/middleware.tssurfsense_web/app/layout.tsxsurfsense_web/app/(home)/login/GoogleLoginButton.tsxsurfsense_web/app/(home)/login/LocalLoginForm.tsxsurfsense_web/app/(home)/login/page.tsxsurfsense_web/app/(home)/register/page.tsxsurfsense_web/app/dashboard/layout.tsxsurfsense_web/app/dashboard/page.tsxsurfsense_web/app/dashboard/[search_space_id]/client-layout.tsxsurfsense_web/components/sidebar/AppSidebarProvider.tsxsurfsense_web/components/sidebar/nav-main.tsxsurfsense_web/components/sidebar/nav-projects.tsxsurfsense_web/components/sidebar/nav-secondary.tsxsurfsense_web/components/dashboard-breadcrumb.tsxsurfsense_web/app/dashboard/[search_space_id]/researcher/[[...chat_id]]/page.tsxsurfsense_web/components/chat/ChatInputGroup.tsxsurfsense_web/components/chat/ConnectorComponents.tsxsurfsense_web/components/chat/AnimatedEmptyState.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/page.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsFilters.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/PaginationControls.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/upload/page.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/webpage/page.tsxsurfsense_web/app/dashboard/[search_space_id]/documents/youtube/page.tsxsurfsense_web/app/dashboard/[search_space_id]/connectors/(manage)/page.tsxsurfsense_web/app/dashboard/[search_space_id]/connectors/add/page.tsxsurfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsxsurfsense_web/app/dashboard/[search_space_id]/podcasts/podcasts-client.tsxsurfsense_web/app/dashboard/[search_space_id]/settings/page.tsxsurfsense_web/components/settings/llm-role-manager.tsxsurfsense_web/components/settings/model-config-manager.tsxsurfsense_web/app/dashboard/[search_space_id]/onboard/page.tsxsurfsense_web/components/onboard/add-provider-step.tsxsurfsense_web/components/onboard/assign-roles-step.tsxsurfsense_web/components/homepage/navbar.tsxsurfsense_web/components/homepage/hero-section.tsxsurfsense_web/components/homepage/features-card.tsxsurfsense_web/components/homepage/features-bento-grid.tsxsurfsense_web/components/homepage/integrations.tsxsurfsense_web/components/homepage/cta.tsxsurfsense_web/components/pricing/pricing-section.tsxsurfsense_web/components/contact/contact-form.tsxsurfsense_web/.gitignoresurfsense_backend/app/routes/documents_routes.pysurfsense_backend/app/users.pysurfsense_backend/app/routes/documents_routes.pysurfsense_backend/app/users.pySummary by CodeRabbit
New Features
Bug Fixes / Improvements
Chores