feat(client): add i18n with i18next and react-i18next

- install i18next and react-i18next
- create src/i18n/index.ts bootstrapping i18next with initReactI18next
- add src/i18n/locales/en.json with keys for nav, all pages, and ThemeSwitcher
- replace hardcoded English strings in App, all pages, and ThemeSwitcher with t()
- move static column definitions inside components where useTranslation is available

client/src/pages/KeysPage.tsx

@@ -1,19 +1,21 @@
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { keys } from '../api';
 import { Table, type TableColumn } from '../ui';
 import styles from './Page.module.css';
 
 interface KeyRow { name: string }
 
-const columns: TableColumn<KeyRow>[] = [
-  { key: 'name', header: 'Key name', render: (k) => k.name },
-];
-
 export function KeysPage() {
+  const { t } = useTranslation();
   const [items, setItems] = useState<KeyRow[]>([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
+  const columns: TableColumn<KeyRow>[] = [
+    { key: 'name', header: t('keys.col_name'), render: (k) => k.name },
+  ];
+
   useEffect(() => {
     setLoading(true);
     keys.list()
@@ -24,14 +26,14 @@ export function KeysPage() {
 
   return (
     <div>
-      <h1 className={styles.heading}>Keys</h1>
+      <h1 className={styles.heading}>{t('keys.title')}</h1>
       {error && <p className={styles.error}>{error}</p>}
       <Table
         columns={columns}
         data={items}
         rowKey={(k) => k.name}
         loading={loading}
-        emptyMessage="No key files found."
+        emptyMessage={t('keys.empty')}
       />
     </div>
   );