feat(pi-config): add history panels, locale strings, and UI coverage

Author: ymkiux

tests/unit/config-tabs-ui.test.mjs

@@ -1,4 +1,5 @@
 import assert from 'assert';
+import { DICT } from '../../web-ui/modules/i18n.dict.mjs';
 import {
     readBundledWebUiCss,
     readBundledWebUiHtml,
@@ -703,3 +704,27 @@ test('docs panel uses segmented package manager control and drops summary strip'
         /<div class="docs-toolbar-card">\s*<label class="form-label">\{\{ t\('common\.packageManager'\) \}\}<\/label>\s*<div class="install-action-tabs">/
     );
 });
+
+test('pi config file-JSON sections expose history panels with locale copy in every language', () => {
+    const piPanel = readProjectFile('web-ui/partials/index/panel-config-pi.html');
+
+    assert.match(piPanel, /@click="openPiConfigHistory\('settings'\)"/);
+    assert.match(piPanel, /@click="openPiConfigHistory\('models'\)"/);
+    assert.match(piPanel, /v-if="piHistoryTarget === 'settings'"/);
+    assert.match(piPanel, /v-if="piHistoryTarget === 'models'"/);
+    for (const section of ['settings', 'models']) {
+        const historyPanel = piPanel.match(
+            new RegExp(`<details v-if="piHistoryTarget === '${section}'"[\\s\\S]*?</details>`)
+        )?.[0] || '';
+        assert.ok(historyPanel, `pi ${section} history panel should exist`);
+        assert.match(historyPanel, /@click="applyPiConfigHistory" :disabled="piHistoryApplying \|\| !isToolConfigWriteAllowed\('pi'\)"/);
+        assert.match(historyPanel, /t\('pi\.history\.apply'\)/);
+    }
+
+    for (const code of ['zh', 'zh-tw', 'en', 'ja', 'vi']) {
+        for (const key of ['pi.history.apply', 'pi.history.applied', 'pi.history.applyFailed', 'pi.history.confirm']) {
+            assert.strictEqual(typeof DICT[code][key], 'string', `${code} should define ${key}`);
+            assert(DICT[code][key].trim(), `${code} ${key} should not be empty`);
+        }
+    }
+});

web-ui/modules/i18n/locales/en.mjs

@@ -1364,6 +1364,10 @@ const en = Object.freeze({
     'pi.files.desc': 'View and edit Pi settings.json and models.json in full; JSON validity is checked before saving and invalid content is never written.',
     'pi.files.settingsTitle': 'settings.json (active settings)',
     'pi.files.modelsTitle': 'models.json (providers and models)',
+    'pi.history.apply': 'Apply this record',
+    'pi.history.applied': 'History record applied',
+    'pi.history.applyFailed': 'Failed to apply history record',
+    'pi.history.confirm': 'Apply this history record to the file? The current file content will be snapshotted first.',
     'pi.providers.models.remove': 'Remove',
     'pi.providers.models.search': 'Search available models…',
     'pi.providers.models.remoteCount': '{count} models available, click to add',

web-ui/modules/i18n/locales/ja.mjs

@@ -1365,6 +1365,10 @@ const ja = Object.freeze({
     'pi.files.desc': 'Pi の settings.json と models.json を全文表示して直接編集します。保存前に JSON の正当性を検証し、不正な内容は書き込みません。',
     'pi.files.settingsTitle': 'settings.json（有効な設定）',
     'pi.files.modelsTitle': 'models.json（プロバイダーとモデル）',
+    'pi.history.apply': 'この履歴を適用',
+    'pi.history.applied': '履歴を適用しました',
+    'pi.history.applyFailed': '履歴の適用に失敗しました',
+    'pi.history.confirm': 'この履歴をファイルに適用しますか？現在の内容は先にスナップショット保存されます。',
     'pi.providers.models.remove': '削除',
     'pi.providers.models.search': '利用可能なモデルを検索…',
     'pi.providers.models.remoteCount': '{count} 個のモデルを取得しました。クリックで追加',

web-ui/modules/i18n/locales/vi.mjs

@@ -1333,6 +1333,10 @@ const vi = Object.freeze({
     'pi.files.desc': 'Hiển thị đầy đủ và chỉnh sửa trực tiếp settings.json và models.json của Pi; kiểm tra tính hợp lệ của JSON trước khi lưu, nội dung không hợp lệ sẽ không được ghi.',
     'pi.files.settingsTitle': 'settings.json (cài đặt đang dùng)',
     'pi.files.modelsTitle': 'models.json (nhà cung cấp và mô hình)',
+    'pi.history.apply': 'Áp dụng bản ghi này',
+    'pi.history.applied': 'Đã áp dụng lịch sử',
+    'pi.history.applyFailed': 'Áp dụng lịch sử thất bại',
+    'pi.history.confirm': 'Áp dụng bản ghi lịch sử này vào tệp? Nội dung hiện tại sẽ được chụp nhanh trước.',
     'pi.providers.models.remove': 'Xóa',
     'pi.providers.models.search': 'Tìm kiếm mô hình khả dụng…',
     'pi.providers.models.remoteCount': 'Đã lấy {count} mô hình, bấm để thêm',

web-ui/modules/i18n/locales/zh-tw.mjs

@@ -1362,6 +1362,10 @@ const zhTw = Object.freeze({
     'pi.files.desc': '完整展示並直接編輯 Pi 的 settings.json 與 models.json；儲存前校驗 JSON 合法性，非法內容不會寫入。',
     'pi.files.settingsTitle': 'settings.json（生效設定）',
     'pi.files.modelsTitle': 'models.json（供應商與模型）',
+    'pi.history.apply': '套用此紀錄',
+    'pi.history.applied': '已套用歷史紀錄',
+    'pi.history.applyFailed': '套用歷史紀錄失敗',
+    'pi.history.confirm': '將此歷史紀錄套用到檔案？目前檔案內容會先被快照儲存。',
     'pi.providers.models.remove': '刪除',
     'pi.providers.models.search': '搜尋可用模型…',
     'pi.providers.models.remoteCount': '已取得 {count} 個可用模型，點擊新增',

web-ui/modules/i18n/locales/zh.mjs

@@ -1362,6 +1362,10 @@ const zh = Object.freeze({
     'pi.files.desc': '完整展示并直接编辑 Pi 的 settings.json 与 models.json；保存前校验 JSON 合法性，非法内容不会写入。',
     'pi.files.settingsTitle': 'settings.json（生效设置）',
     'pi.files.modelsTitle': 'models.json（供应商与模型）',
+    'pi.history.apply': '应用此记录',
+    'pi.history.applied': '已应用历史记录',
+    'pi.history.applyFailed': '应用历史记录失败',
+    'pi.history.confirm': '将此历史记录应用到文件？当前文件内容会先被快照保存。',
     'pi.providers.models.remove': '删除',
     'pi.providers.models.search': '搜索可用模型…',
     'pi.providers.models.remoteCount': '已拉取 {count} 个可用模型，点击添加',

web-ui/partials/index/panel-config-pi.html

@@ -195,7 +195,29 @@
                             <p v-if="piSettingsJsonError" class="config-template-hint error-text">{{ piSettingsJsonError }}</p>
                             <div class="settings-tab-actions">
                                 <button type="button" class="btn-tool" @click="savePiSettingsJson" :disabled="!isToolConfigWriteAllowed('pi') || piSaving || piFileJsonSaving || !!piSettingsJsonError">{{ t('common.save') }}</button>
+                                <button type="button" class="btn-mini" @click="openPiConfigHistory('settings')" :disabled="piHistoryLoading">{{ t('common.history') }}</button>
                             </div>
+                            <details v-if="piHistoryTarget === 'settings'" class="prompt-history-panel" open>
+                                <summary class="prompt-history-summary">
+                                    <span>{{ t('common.history') }}</span>
+                                    <button type="button" class="btn-mini prompt-history-close" @click="closePiConfigHistory" :title="t('common.close')">✕</button>
+                                </summary>
+                                <div class="prompt-history-body">
+                                    <ul v-if="!piHistoryLoading && !piHistoryError && piHistoryItems.length" class="prompt-history-list">
+                                        <li v-for="item in piHistoryItems" :key="item.id" :class="['prompt-history-item', { active: piHistoryPreviewId === item.id }]" @click="viewPiConfigHistoryItem(item)">
+                                            <span class="prompt-history-time">{{ item.id }}</span>
+                                            <span class="prompt-history-size">{{ Math.round(item.size / 1024 * 10) / 10 }} KB</span>
+                                        </li>
+                                    </ul>
+                                    <div v-if="piHistoryLoading" class="state-message">{{ t('diff.generating') }}</div>
+                                    <div v-else-if="piHistoryError" class="state-message error">{{ piHistoryError }}</div>
+                                    <div v-else-if="!piHistoryItems.length" class="state-message">{{ t('toast.history.empty') }}</div>
+                                    <div v-if="piHistoryPreviewContent" class="prompt-history-preview-wrap">
+                                        <pre class="prompt-history-preview">{{ piHistoryPreviewContent }}</pre>
+                                        <button type="button" class="btn-mini btn-confirm-mini" @click="applyPiConfigHistory" :disabled="piHistoryApplying || !isToolConfigWriteAllowed('pi')">{{ t('pi.history.apply') }}</button>
+                                    </div>
+                                </div>
+                            </details>
                             <label class="form-label">{{ t('pi.files.modelsTitle') }}</label>
                             <textarea
                                 class="template-textarea config-json-editor"
@@ -208,7 +230,29 @@
                             <p v-if="piModelsJsonError" class="config-template-hint error-text">{{ piModelsJsonError }}</p>
                             <div class="settings-tab-actions">
                                 <button type="button" class="btn-tool" @click="savePiModelsJson" :disabled="!isToolConfigWriteAllowed('pi') || piSaving || piFileJsonSaving || !!piModelsJsonError">{{ t('common.save') }}</button>
+                                <button type="button" class="btn-mini" @click="openPiConfigHistory('models')" :disabled="piHistoryLoading">{{ t('common.history') }}</button>
                             </div>
+                            <details v-if="piHistoryTarget === 'models'" class="prompt-history-panel" open>
+                                <summary class="prompt-history-summary">
+                                    <span>{{ t('common.history') }}</span>
+                                    <button type="button" class="btn-mini prompt-history-close" @click="closePiConfigHistory" :title="t('common.close')">✕</button>
+                                </summary>
+                                <div class="prompt-history-body">
+                                    <ul v-if="!piHistoryLoading && !piHistoryError && piHistoryItems.length" class="prompt-history-list">
+                                        <li v-for="item in piHistoryItems" :key="item.id" :class="['prompt-history-item', { active: piHistoryPreviewId === item.id }]" @click="viewPiConfigHistoryItem(item)">
+                                            <span class="prompt-history-time">{{ item.id }}</span>
+                                            <span class="prompt-history-size">{{ Math.round(item.size / 1024 * 10) / 10 }} KB</span>
+                                        </li>
+                                    </ul>
+                                    <div v-if="piHistoryLoading" class="state-message">{{ t('diff.generating') }}</div>
+                                    <div v-else-if="piHistoryError" class="state-message error">{{ piHistoryError }}</div>
+                                    <div v-else-if="!piHistoryItems.length" class="state-message">{{ t('toast.history.empty') }}</div>
+                                    <div v-if="piHistoryPreviewContent" class="prompt-history-preview-wrap">
+                                        <pre class="prompt-history-preview">{{ piHistoryPreviewContent }}</pre>
+                                        <button type="button" class="btn-mini btn-confirm-mini" @click="applyPiConfigHistory" :disabled="piHistoryApplying || !isToolConfigWriteAllowed('pi')">{{ t('pi.history.apply') }}</button>
+                                    </div>
+                                </div>
+                            </details>
                         </section>
                         <div v-if="!isToolConfigWriteAllowed('pi')" class="tool-config-write-overlay">
                             <div class="tool-config-write-overlay-card">