mirror of
https://github.com/binaricat/Netcatty.git
synced 2026-09-24 15:49:09 +00:00
LAPTOP-O016UC3M\Qi Chen
4e9e5da13c
Integrates all user-facing strings into the translation system and expands locale files for comprehensive coverage, enabling dynamic i18n across the interface. Replaces hardcoded labels, button texts, and prompts with translation keys, benefiting maintainability and future language support. Improves translation ergonomics in forms, dialogs, wizards, and settings, ensuring consistent user experience in both English and Chinese.
69 lines
2.5 KiB
TypeScript
69 lines
2.5 KiB
TypeScript
/**
|
|
* View Key Panel - Display SSH key details
|
|
*/
|
|
|
|
import { Copy,Info } from 'lucide-react';
|
|
import React from 'react';
|
|
import { useI18n } from '../../application/i18n/I18nProvider';
|
|
import { SSHKey } from '../../types';
|
|
import { Button } from '../ui/button';
|
|
import { Label } from '../ui/label';
|
|
import { copyToClipboard } from './utils';
|
|
|
|
interface ViewKeyPanelProps {
|
|
keyItem: SSHKey;
|
|
onExport: () => void;
|
|
}
|
|
|
|
export const ViewKeyPanel: React.FC<ViewKeyPanelProps> = ({
|
|
keyItem,
|
|
onExport,
|
|
}) => {
|
|
const { t } = useI18n();
|
|
return (
|
|
<>
|
|
<div className="space-y-2">
|
|
<Label className="text-muted-foreground">{t('keychain.field.label')}</Label>
|
|
<p className="text-sm">{keyItem.label}</p>
|
|
</div>
|
|
|
|
{keyItem.publicKey && (
|
|
<div className="space-y-2">
|
|
<Label className="text-muted-foreground">{t('keychain.field.publicKey')}</Label>
|
|
<div className="relative">
|
|
<div className="p-3 bg-card border border-border/80 rounded-lg font-mono text-xs break-all max-h-32 overflow-y-auto">
|
|
{keyItem.publicKey}
|
|
</div>
|
|
<Button
|
|
size="icon"
|
|
variant="ghost"
|
|
className="absolute top-2 right-2 h-7 w-7"
|
|
onClick={() => copyToClipboard(keyItem.publicKey || '')}
|
|
>
|
|
<Copy size={12} />
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
)}
|
|
|
|
<div className="space-y-1">
|
|
<Label className="text-muted-foreground">{t('field.type')}</Label>
|
|
<p className="text-sm">{keyItem.type}</p>
|
|
</div>
|
|
|
|
{/* Key Export section */}
|
|
<div className="pt-4 mt-4 border-t border-border/60">
|
|
<div className="flex items-center gap-2 mb-3">
|
|
<span className="text-sm font-medium">{t('keychain.export.title')}</span>
|
|
<div className="h-4 w-4 rounded-full bg-muted flex items-center justify-center">
|
|
<Info size={10} className="text-muted-foreground" />
|
|
</div>
|
|
</div>
|
|
<Button className="w-full h-11" onClick={onExport}>
|
|
{t('keychain.export.exportToHost')}
|
|
</Button>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|