alexei.dolgolyov/tiny-forge
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: extract hardcoded English strings to i18n system with Russian translations

Browse Source 
- Extract ~40 hardcoded strings from project detail, deploy, settings, credentials, registries, auth, env editor pages
- Add corresponding Russian translations
- Replace native confirm() default labels with i18n keys in ConfirmDialog
- Fix InstanceCard pluralization to use i18n
This commit is contained in:
Admin
2026-04-04 13:03:05 +03:00
parent 3f6858513f
commit 04c1411f5d
12 changed files with 129 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/routes/deploy/+page.svelte
+1 -1
View File
@@ -227,7 +227,7 @@
<p class="mb-4 text-sm text-[var(--text-secondary)]">{$t('quickDeploy.reviewDesc')}</p>
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
<FormField label={$t('quickDeploy.projectName')} name="projectName" bind:value={projectName} placeholder="my-app" required error={errors.projectName ?? ''} helpText="Lowercase with hyphens" />
<FormField label={$t('quickDeploy.projectName')} name="projectName" bind:value={projectName} placeholder="my-app" required error={errors.projectName ?? ''} helpText={$t('quickDeploy.lowercaseHint')} />
<FormField label={$t('quickDeploy.port')} name="port" type="number" bind:value={port} placeholder="3000" required error={errors.port ?? ''} helpText={$t('quickDeploy.portHelp')} />
<FormField label={$t('quickDeploy.healthCheckPath')} name="healthcheck" bind:value={healthcheck} placeholder="/api/health" helpText={$t('quickDeploy.healthCheckHelp')} />
<div class="flex flex-col gap-1.5">
web/src/routes/projects/+page.svelte
+3 -3
View File
@@ -48,7 +48,7 @@
description: alreadyAdded ? undefined : reg.name,
group: reg.name,
disabled: alreadyAdded,
disabledHint: alreadyAdded ? 'Already added' : undefined
disabledHint: alreadyAdded ? $t('projects.alreadyAdded') : undefined
});
}
} catch {
@@ -184,8 +184,8 @@
onselect={selectPickedImage}
onclose={() => { showImagePicker = false; }}
/>
<FormField label={$t('projects.port')} name="port" type="number" bind:value={formPort} helpText="Auto-detected from EXPOSE if empty" />
<FormField label={$t('projects.healthcheck')} name="healthcheck" bind:value={formHealthcheck} placeholder="/api/health" helpText="Auto-detected from image if empty" />
<FormField label={$t('projects.port')} name="port" type="number" bind:value={formPort} helpText={$t('projects.portHelpText')} />
<FormField label={$t('projects.healthcheck')} name="healthcheck" bind:value={formHealthcheck} placeholder="/api/health" helpText={$t('projects.healthcheckHelpText')} />
</div>
<div class="mt-6 flex justify-end">
web/src/routes/projects/[id]/+page.svelte
+23 -23
View File
@@ -47,12 +47,12 @@
enable_proxy: stageEnableProxy,
max_instances: parseInt(stageMaxInstances) || 1,
});
toasts.success(`Stage "${stageName}" created`);
toasts.success($t('projectDetail.stageCreated', { name: stageName }));
stageName = ''; stageTagPattern = '*'; stageAutoDeploy = true; stageEnableProxy = true; stageMaxInstances = '1';
showAddStage = false;
await loadProject();
} catch (e) {
toasts.error(e instanceof Error ? e.message : 'Failed to create stage');
toasts.error(e instanceof Error ? e.message : $t('projectDetail.stageCreateFailed'));
} finally {
addingStage = false;
}
@@ -85,11 +85,11 @@
port: parseInt(editPort) || 0,
healthcheck: editHealthcheck.trim(),
});
toasts.success('Project updated');
toasts.success($t('projectDetail.projectUpdated'));
editing = false;
await loadProject();
} catch (e) {
toasts.error(e instanceof Error ? e.message : 'Failed to update project');
toasts.error(e instanceof Error ? e.message : $t('projectDetail.updateFailed'));
} finally {
saving = false;
}
@@ -98,10 +98,10 @@
async function handleDeleteStage(stageId: string, name: string) {
try {
await api.deleteStage(projectId, stageId);
toasts.success(`Stage "${name}" deleted`);
toasts.success($t('projectDetail.stageDeleted', { name }));
await loadProject();
} catch (e) {
toasts.error(e instanceof Error ? e.message : 'Failed to delete stage');
toasts.error(e instanceof Error ? e.message : $t('projectDetail.stageDeleteFailed'));
}
}
let tagsLoading = $state(false);
@@ -268,10 +268,10 @@
<div class="rounded-xl border border-[var(--border-primary)] bg-[var(--surface-card)] p-5 shadow-[var(--shadow-sm)]">
{#if editing}
<div class="grid grid-cols-1 gap-3 sm:grid-cols-2">
<FormField label="Name *" name="editName" bind:value={editName} />
<FormField label="Image *" name="editImage" bind:value={editImage} />
<FormField label="Port" name="editPort" type="number" bind:value={editPort} />
<FormField label="Healthcheck Path" name="editHealthcheck" bind:value={editHealthcheck} placeholder="/api/health" />
<FormField label={$t('projectDetail.nameLabel')} name="editName" bind:value={editName} />
<FormField label={$t('projectDetail.imageLabel')} name="editImage" bind:value={editImage} />
<FormField label={$t('projectDetail.portLabel')} name="editPort" type="number" bind:value={editPort} />
<FormField label={$t('projectDetail.healthcheckLabel')} name="editHealthcheck" bind:value={editHealthcheck} placeholder="/api/health" />
</div>
<div class="mt-4 flex items-center gap-2 justify-end">
<button
@@ -289,7 +289,7 @@
class="inline-flex items-center gap-1.5 rounded-lg bg-[var(--color-brand-600)] px-3 py-1.5 text-sm font-medium text-white hover:bg-[var(--color-brand-700)] disabled:opacity-50 transition-colors"
>
<IconCheck size={14} />
{saving ? 'Saving...' : $t('common.save')}
{saving ? $t('projectDetail.saving') : $t('common.save')}
</button>
</div>
{:else}
@@ -334,26 +334,26 @@
class="inline-flex items-center gap-1.5 rounded-lg {showAddStage ? 'border border-[var(--border-primary)] text-[var(--text-secondary)]' : 'bg-[var(--color-brand-600)] text-white'} px-3 py-1.5 text-xs font-medium transition-all hover:opacity-90"
>
{#if !showAddStage}<IconPlus size={14} />{/if}
{showAddStage ? $t('projects.cancel') : 'Add Stage'}
{showAddStage ? $t('projects.cancel') : $t('projectDetail.addStage')}
</button>
</div>
{#if showAddStage}
<div class="mt-3 rounded-xl border border-[var(--border-primary)] bg-[var(--surface-card)] p-4 animate-scale-in">
<div class="grid grid-cols-2 gap-3 sm:grid-cols-5">
<FormField label="Name *" name="stageName" bind:value={stageName} placeholder="dev" />
<FormField label="Tag Pattern" name="stagePattern" bind:value={stageTagPattern} placeholder="dev-*" helpText="Glob pattern (e.g., dev-*, v*)" />
<FormField label="Max Instances" name="stageMax" type="number" bind:value={stageMaxInstances} />
<FormField label={$t('projectDetail.nameLabel')} name="stageName" bind:value={stageName} placeholder="dev" />
<FormField label={$t('projectDetail.tagPattern')} name="stagePattern" bind:value={stageTagPattern} placeholder="dev-*" helpText={$t('projectDetail.tagPatternHelp')} />
<FormField label={$t('projectDetail.maxInstances')} name="stageMax" type="number" bind:value={stageMaxInstances} />
<div class="flex flex-col gap-1.5">
<label class="text-sm font-medium text-[var(--text-primary)]">Auto Deploy</label>
<label class="text-sm font-medium text-[var(--text-primary)]">{$t('projectDetail.autoDeployLabel')}</label>
<div class="flex items-center h-[38px]">
<ToggleSwitch bind:checked={stageAutoDeploy} label="Auto Deploy" />
<ToggleSwitch bind:checked={stageAutoDeploy} label={$t('projectDetail.autoDeployLabel')} />
</div>
</div>
<div class="flex flex-col gap-1.5">
<label class="text-sm font-medium text-[var(--text-primary)]">NPM Proxy</label>
<label class="text-sm font-medium text-[var(--text-primary)]">{$t('projectDetail.npmProxy')}</label>
<div class="flex items-center h-[38px]">
<ToggleSwitch bind:checked={stageEnableProxy} label="NPM Proxy" />
<ToggleSwitch bind:checked={stageEnableProxy} label={$t('projectDetail.npmProxy')} />
</div>
</div>
</div>
@@ -364,7 +364,7 @@
disabled={addingStage || !stageName.trim()}
class="rounded-lg bg-[var(--color-brand-600)] px-4 py-2 text-sm font-medium text-white hover:bg-[var(--color-brand-700)] disabled:opacity-50 transition-all"
>
{addingStage ? 'Creating...' : 'Create Stage'}
{addingStage ? $t('projectDetail.creating') : $t('projectDetail.createStage')}
</button>
</div>
</div>
@@ -391,7 +391,7 @@
<span class="rounded-full bg-amber-50 px-2 py-0.5 text-xs font-medium text-amber-700">{$t('projectDetail.requiresConfirm')}</span>
{/if}
{#if !stage.enable_proxy}
<span class="rounded-full bg-gray-100 px-2 py-0.5 text-xs font-medium text-gray-600">No Proxy</span>
<span class="rounded-full bg-gray-100 px-2 py-0.5 text-xs font-medium text-gray-600">{$t('projectDetail.noProxy')}</span>
{/if}
</div>
<div class="flex items-center gap-3">
@@ -408,8 +408,8 @@
</button>
<button
type="button"
title="Delete stage"
onclick={() => { if (confirm(`Delete stage "${stage.name}"?`)) handleDeleteStage(stage.id, stage.name); }}
title={$t('projectDetail.deleteStage')}
onclick={() => { if (confirm($t('projectDetail.deleteStageConfirm', { name: stage.name }))) handleDeleteStage(stage.id, stage.name); }}
class="rounded-lg p-1.5 text-[var(--text-tertiary)] hover:bg-[var(--color-danger-light)] hover:text-[var(--color-danger)] transition-colors"
>
<IconTrash size={14} />
web/src/routes/projects/[id]/env/+page.svelte
Vendored
+3 -3
View File
@@ -250,10 +250,10 @@
<input type="text" bind:value={editKey} class="block w-full rounded-lg border border-[var(--border-input)] bg-[var(--surface-input)] px-2 py-1 font-mono text-sm text-[var(--text-primary)] focus:border-[var(--color-brand-500)] focus:ring-1 focus:ring-[var(--color-brand-500)] focus:outline-none" />
</td>
<td class="px-4 py-2.5">
<input type={editEncrypted ? 'password' : 'text'} bind:value={editValue} placeholder={env.encrypted ? 'Leave empty to keep current' : ''} class="block w-full rounded-lg border border-[var(--border-input)] bg-[var(--surface-input)] px-2 py-1 font-mono text-sm text-[var(--text-primary)] focus:border-[var(--color-brand-500)] focus:ring-1 focus:ring-[var(--color-brand-500)] focus:outline-none" />
<input type={editEncrypted ? 'password' : 'text'} bind:value={editValue} placeholder={env.encrypted ? $t('envEditor.leaveEmptyToKeep') : ''} class="block w-full rounded-lg border border-[var(--border-input)] bg-[var(--surface-input)] px-2 py-1 font-mono text-sm text-[var(--text-primary)] focus:border-[var(--color-brand-500)] focus:ring-1 focus:ring-[var(--color-brand-500)] focus:outline-none" />
</td>
<td class="px-4 py-2.5">
<ToggleSwitch bind:checked={editEncrypted} label="Secret" />
<ToggleSwitch bind:checked={editEncrypted} label={$t('envEditor.secret')} />
</td>
<td class="px-4 py-2.5"></td>
<td class="px-4 py-2.5 text-right">
@@ -311,7 +311,7 @@
<input type={newEncrypted ? 'password' : 'text'} bind:value={newValue} placeholder="value" class="block w-full rounded-lg border border-[var(--border-input)] bg-[var(--surface-input)] px-2 py-1 font-mono text-sm text-[var(--text-primary)] focus:border-[var(--color-brand-500)] focus:ring-1 focus:ring-[var(--color-brand-500)] focus:outline-none" />
</td>
<td class="px-4 py-2.5">
<ToggleSwitch bind:checked={newEncrypted} label="Secret" />
<ToggleSwitch bind:checked={newEncrypted} label={$t('envEditor.secret')} />
</td>
<td class="px-4 py-2.5"></td>
<td class="px-4 py-2.5 text-right">
web/src/routes/settings/+page.svelte
+1 -1
View File
@@ -290,7 +290,7 @@
<FormField label={$t('settingsGeneral.dockerNetwork')} name="network" bind:value={network} placeholder="staging-net" helpText={$t('settingsGeneral.dockerNetworkHelp')} />
<FormField label={$t('settingsGeneral.subdomainPattern')} name="subdomainPattern" bind:value={subdomainPattern} placeholder="stage-{'{stage}'}-{'{project}'}" helpText={$t('settingsGeneral.subdomainPatternHelp')} />
<FormField label={$t('settingsGeneral.pollingInterval')} name="pollingInterval" type="number" bind:value={pollingInterval} placeholder="60" error={errors.pollingInterval ?? ''} helpText={$t('settingsGeneral.pollingIntervalHelp')} />
<FormField label="Base Volume Path" name="baseVolumePath" bind:value={baseVolumePath} placeholder="/data" helpText="Prepended to relative volume sources (e.g., /data + my-app/uploads = /data/my-app/uploads)" />
<FormField label={$t('settingsGeneral.baseVolumePath')} name="baseVolumePath" bind:value={baseVolumePath} placeholder="/data" helpText={$t('settingsGeneral.baseVolumePathHelp')} />
<FormField label={$t('settingsGeneral.notificationUrl')} name="notificationUrl" bind:value={notificationUrl} placeholder="https://notify.example.com/webhook" error={errors.notificationUrl ?? ''} helpText={$t('settingsGeneral.notificationUrlHelp')} />
</div>
<!-- SSL Certificate -->
web/src/routes/settings/auth/+page.svelte
+2 -2
View File
@@ -57,7 +57,7 @@
const res = await fetch('/api/auth/settings', { method: 'PUT', headers: authHeaders(), body: JSON.stringify(settings) });
const envelope = await res.json();
if (envelope.success) message = $t('settingsAuth.saved'); else error = envelope.error ?? $t('settingsAuth.saveFailed');
} catch (err: unknown) { error = err instanceof Error ? err.message : 'Network error'; } finally { saving = false; }
} catch (err: unknown) { error = err instanceof Error ? err.message : $t('settingsAuth.networkError'); } finally { saving = false; }
}
async function addUser() {
@@ -67,7 +67,7 @@
const envelope = await res.json();
if (envelope.success) { newUsername = ''; newPassword = ''; newEmail = ''; newRole = 'viewer'; await loadUsers(); message = $t('settingsAuth.userCreated'); }
else error = envelope.error ?? $t('settingsAuth.createFailed');
} catch (err: unknown) { error = err instanceof Error ? err.message : 'Network error'; }
} catch (err: unknown) { error = err instanceof Error ? err.message : $t('settingsAuth.networkError'); }
}
async function deleteUser(id: string) {
web/src/routes/settings/credentials/+page.svelte
+1 -1
View File
@@ -85,7 +85,7 @@
<div class="flex items-center justify-between rounded-lg bg-[var(--surface-card-hover)] px-4 py-2.5">
<div>
<p class="text-xs font-medium text-[var(--text-tertiary)]">{item.label}</p>
<p class="text-sm text-[var(--text-secondary)] {item.label === $t('settingsCredentials.password') ? 'font-mono' : ''}">{item.value || 'Not set'}</p>
<p class="text-sm text-[var(--text-secondary)] {item.label === $t('settingsCredentials.password') ? 'font-mono' : ''}">{item.value || $t('settingsCredentials.notSet')}</p>
</div>
</div>
{/each}
web/src/routes/settings/registries/+page.svelte
+3 -3
View File
@@ -159,11 +159,11 @@
<div>
<div class="flex items-center gap-2">
{#if healthStatus[registry.id] === 'checking'}
<span class="h-2.5 w-2.5 shrink-0 rounded-full bg-yellow-400 animate-pulse" title="Checking..."></span>
<span class="h-2.5 w-2.5 shrink-0 rounded-full bg-yellow-400 animate-pulse" title={$t('settingsRegistries.healthChecking')}></span>
{:else if healthStatus[registry.id] === 'healthy'}
<span class="h-2.5 w-2.5 shrink-0 rounded-full bg-emerald-500" title="Connected"></span>
<span class="h-2.5 w-2.5 shrink-0 rounded-full bg-emerald-500" title={$t('settingsRegistries.healthConnected')}></span>
{:else if healthStatus[registry.id] === 'unhealthy'}
<span class="h-2.5 w-2.5 shrink-0 rounded-full bg-red-500" title="Unreachable"></span>
<span class="h-2.5 w-2.5 shrink-0 rounded-full bg-red-500" title={$t('settingsRegistries.healthUnreachable')}></span>
{/if}
<h3 class="text-sm font-semibold text-[var(--text-primary)]">{registry.name}</h3>
<span class="rounded-full bg-[var(--surface-card-hover)] px-2 py-0.5 text-xs font-medium text-[var(--text-tertiary)]">{registry.type}</span>