mirror of
https://github.com/hellodigua/ChatLab.git
synced 2026-10-25 17:54:34 +08:00
feat(electron): add persistent UI scale setting
This commit is contained in:
1 parent
220f9902be
commit
eadadda071
21 files changed
+136
-4
No files matched your search
@@ -4,7 +4,8 @@
|
||||
|
||||
import { ipcMain, app, dialog, clipboard, shell, nativeTheme } from 'electron'
|
||||
import * as fs from 'fs/promises'
|
||||
import { loadConfig, setConfigField } from '@openchatlab/config'
|
||||
import { desktopConfigSchema, loadConfig, setConfigField } from '@openchatlab/config'
|
||||
import { appLogger } from '@openchatlab/node-runtime'
|
||||
import type { DesktopCloseBehavior } from '@openchatlab/shared-types'
|
||||
import type { IpcContext } from './types'
|
||||
import { simulateUpdateDialog, manualCheckForUpdates } from '../update/manager'
|
||||
@@ -224,6 +225,26 @@ export function registerWindowHandlers(ctx: IpcContext): void {
|
||||
}
|
||||
})
|
||||
|
||||
// ==================== Desktop UI scale ====================
|
||||
ipcMain.handle('app:getDesktopUiScale', () => loadConfig().desktop.ui_scale)
|
||||
|
||||
ipcMain.handle('app:setDesktopUiScale', (_, scale: number) => {
|
||||
const parsed = desktopConfigSchema.shape.ui_scale.safeParse(scale)
|
||||
if (typeof scale !== 'number' || !parsed.success) {
|
||||
return { success: false, error: 'Unsupported desktop UI scale' }
|
||||
}
|
||||
|
||||
try {
|
||||
setConfigField('desktop.ui_scale', String(parsed.data))
|
||||
win.webContents.setZoomFactor(parsed.data)
|
||||
appLogger.info('window', `Desktop UI scale changed to ${parsed.data}`)
|
||||
return { success: true }
|
||||
} catch (error) {
|
||||
appLogger.error('window', 'Failed to change desktop UI scale', error)
|
||||
return { success: false, error: error instanceof Error ? error.message : String(error) }
|
||||
}
|
||||
})
|
||||
|
||||
// ==================== Windows 关闭行为 ====================
|
||||
ipcMain.handle('app:getDesktopCloseBehavior', () => {
|
||||
return loadConfig().desktop.close_behavior
|
||||
|
||||
@@ -28,6 +28,7 @@ export async function createMainWindow(paths: MainWindowPaths): Promise<BrowserW
|
||||
preload: paths.preloadPath,
|
||||
sandbox: false,
|
||||
devTools: true,
|
||||
zoomFactor: loadConfig().desktop.ui_scale,
|
||||
},
|
||||
}
|
||||
|
||||
@@ -100,6 +101,8 @@ function handleWindowsClose(win: BrowserWindow): void {
|
||||
|
||||
function registerMainWindowEvents(win: BrowserWindow): void {
|
||||
win.webContents.on('did-finish-load', () => {
|
||||
// Reapply the preference after navigation, overriding Chromium's per-origin zoom cache.
|
||||
win.webContents.setZoomFactor(loadConfig().desktop.ui_scale)
|
||||
setTimeout(() => {
|
||||
currentMainWindow?.webContents.send('app-started')
|
||||
}, 500)
|
||||
|
||||
@@ -123,5 +123,9 @@ export const extendedApi = {
|
||||
setDesktopCloseBehavior: (behavior: DesktopCloseBehavior): Promise<{ success: boolean; error?: string }> => {
|
||||
return ipcRenderer.invoke('app:setDesktopCloseBehavior', behavior)
|
||||
},
|
||||
getDesktopUiScale: (): Promise<number> => ipcRenderer.invoke('app:getDesktopUiScale'),
|
||||
setDesktopUiScale: (scale: number): Promise<{ success: boolean; error?: string }> => {
|
||||
return ipcRenderer.invoke('app:setDesktopUiScale', scale)
|
||||
},
|
||||
},
|
||||
}
|
||||
Vendored
+2
@@ -194,6 +194,8 @@ interface Api {
|
||||
setOpenAtLogin: (enabled: boolean) => Promise<{ success: boolean; error?: string }>
|
||||
getDesktopCloseBehavior: () => Promise<DesktopCloseBehavior>
|
||||
setDesktopCloseBehavior: (behavior: DesktopCloseBehavior) => Promise<{ success: boolean; error?: string }>
|
||||
getDesktopUiScale: () => Promise<number>
|
||||
setDesktopUiScale: (scale: number) => Promise<{ success: boolean; error?: string }>
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -48,6 +48,7 @@ export const cliConfigSchema = z.object({
|
||||
|
||||
export const desktopConfigSchema = z.object({
|
||||
close_behavior: z.enum(['background', 'quit']).default('background'),
|
||||
ui_scale: z.number().min(0.9).max(1.5).default(1),
|
||||
})
|
||||
|
||||
export const configSchema = z.object({
|
||||
|
||||
@@ -45,6 +45,23 @@ describe('cli config section', () => {
|
||||
})
|
||||
|
||||
describe('setConfigField', () => {
|
||||
it('defaults old desktop configs to 100% and persists UI scale without changing other preferences', () => {
|
||||
mkdirSync(join(tempHome, '.chatlab'), { recursive: true })
|
||||
writeFileSync(configToml, '[desktop]\nclose_behavior = "quit"\n[locale]\nlang = "en-US"\n', 'utf-8')
|
||||
|
||||
assert.equal(loadConfig().desktop.ui_scale, 1)
|
||||
setConfigField('desktop.ui_scale', '1.25')
|
||||
|
||||
const config = loadConfig()
|
||||
assert.equal(config.desktop.ui_scale, 1.25)
|
||||
assert.equal(config.desktop.close_behavior, 'quit')
|
||||
assert.equal(config.locale.lang, 'en-US')
|
||||
|
||||
const saved = readFileSync(configToml, 'utf-8')
|
||||
assert.throws(() => setConfigField('desktop.ui_scale', '0'))
|
||||
assert.equal(readFileSync(configToml, 'utf-8'), saved)
|
||||
})
|
||||
|
||||
it('persists the Windows close behavior', () => {
|
||||
const result = setConfigField('desktop.close_behavior', 'background')
|
||||
|
||||
|
||||
@@ -273,8 +273,8 @@ onUnmounted(() => {
|
||||
{{ session.name }}
|
||||
</h2>
|
||||
|
||||
<div class="mt-4 flex flex-col gap-5 sm:flex-row sm:items-start sm:gap-24">
|
||||
<div class="min-w-0 flex flex-col gap-2 text-sm font-medium text-gray-500 dark:text-gray-400">
|
||||
<div class="mt-4 flex flex-col gap-5 sm:flex-row sm:flex-wrap sm:items-start sm:gap-x-24">
|
||||
<div class="min-w-0 flex shrink-0 flex-col gap-2 text-sm font-medium text-gray-500 dark:text-gray-400">
|
||||
<div class="flex items-center gap-2">
|
||||
<div class="flex h-6 w-6 shrink-0 items-center justify-center">
|
||||
<UIcon v-if="session.type === 'group'" name="i-heroicons-user-group" class="h-4 w-4 opacity-70" />
|
||||
|
||||
@@ -4,6 +4,8 @@ import { computed, ref, onMounted } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useLayoutStore } from '@/stores/layout'
|
||||
import { useSettingsStore } from '@/stores/settings'
|
||||
import { useToast } from '@/composables/useToast'
|
||||
import { reportError } from '@/services/log-report'
|
||||
import { useColorMode } from '@vueuse/core'
|
||||
import { availableLocales, type LocaleType } from '@/i18n'
|
||||
import NetworkSettingsSection from './NetworkSettingsSection.vue'
|
||||
@@ -14,6 +16,7 @@ import { INSIGHT_CARD_THEMES, type InsightCardThemeId } from '@/utils/insight-ca
|
||||
import type { DesktopCloseBehavior } from '@openchatlab/shared-types'
|
||||
|
||||
const { t } = useI18n()
|
||||
const toast = useToast()
|
||||
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
@@ -39,6 +42,12 @@ const isWindowsDesktop =
|
||||
IS_ELECTRON && typeof navigator !== 'undefined' && navigator.platform.toLowerCase().includes('win')
|
||||
const desktopCloseBehavior = ref<DesktopCloseBehavior>('background')
|
||||
let savedDesktopCloseBehavior: DesktopCloseBehavior = 'background'
|
||||
const desktopUiScale = ref(1)
|
||||
const savingUiScale = ref(false)
|
||||
const uiScaleOptions = [0.9, 1, 1.1, 1.25, 1.5].map((value) => ({
|
||||
label: `${Math.round(value * 100)}%`,
|
||||
value,
|
||||
}))
|
||||
|
||||
onMounted(async () => {
|
||||
if (!IS_ELECTRON) {
|
||||
@@ -52,6 +61,13 @@ onMounted(async () => {
|
||||
isPackaged.value = false
|
||||
}
|
||||
|
||||
try {
|
||||
desktopUiScale.value = await usePlatformService().getDesktopUiScale()
|
||||
} catch (error) {
|
||||
reportError(`Failed to load desktop UI scale: ${error}`, error instanceof Error ? error.stack : undefined)
|
||||
toast.fail(t('common.loadFailed'))
|
||||
}
|
||||
|
||||
if (isWindowsDesktop) {
|
||||
try {
|
||||
savedDesktopCloseBehavior = await usePlatformService().getDesktopCloseBehavior()
|
||||
@@ -84,6 +100,20 @@ async function handleDesktopCloseBehaviorChange(value: string | number) {
|
||||
}
|
||||
}
|
||||
|
||||
async function handleDesktopUiScaleChange(value: number) {
|
||||
savingUiScale.value = true
|
||||
try {
|
||||
const result = await usePlatformService().setDesktopUiScale(value)
|
||||
if (!result.success) throw new Error(result.error || 'Failed to save desktop UI scale')
|
||||
desktopUiScale.value = value
|
||||
} catch (error) {
|
||||
reportError(`Failed to save desktop UI scale: ${error}`, error instanceof Error ? error.stack : undefined)
|
||||
toast.fail(t('common.saveFailed'))
|
||||
} finally {
|
||||
savingUiScale.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// Color Mode
|
||||
const colorMode = useColorMode({
|
||||
emitAuto: true,
|
||||
@@ -215,6 +245,22 @@ const desktopCloseBehaviorOptions = computed(() => [
|
||||
<UTabs v-model="colorMode" size="sm" class="gap-0" :items="colorModeOptions"></UTabs>
|
||||
</div>
|
||||
</div>
|
||||
<template v-if="IS_ELECTRON">
|
||||
<div class="border-t border-gray-200 dark:border-gray-700"></div>
|
||||
<div class="flex items-center justify-between p-4">
|
||||
<label for="desktop-ui-scale" class="pr-4 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{{ t('settings.basic.appearance.uiScale') }}
|
||||
</label>
|
||||
<USelect
|
||||
id="desktop-ui-scale"
|
||||
:model-value="desktopUiScale"
|
||||
:items="uiScaleOptions"
|
||||
:disabled="savingUiScale"
|
||||
class="w-28"
|
||||
@update:model-value="handleDesktopUiScaleChange"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<div class="border-t border-gray-200 dark:border-gray-700"></div>
|
||||
<div class="flex items-center justify-between p-4">
|
||||
<div class="flex-1 pr-4">
|
||||
|
||||
@@ -38,7 +38,7 @@ const currentTab = computed({
|
||||
@update:open="emit('update:open', $event)"
|
||||
>
|
||||
<template #content>
|
||||
<div class="flex h-[100dvh] min-h-0 flex-col overflow-hidden sm:h-[85vh] sm:min-h-[650px]">
|
||||
<div class="flex h-[100dvh] min-h-0 flex-col overflow-hidden sm:h-[85vh] sm:min-h-[min(650px,calc(100dvh-4rem))]">
|
||||
<div class="shrink-0 border-b border-gray-200 px-4 pt-4 sm:px-6 sm:pt-5 dark:border-gray-800">
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center gap-3">
|
||||
|
||||
@@ -21,6 +21,8 @@
|
||||
"presentationFallback": "Appearance preferences couldn't be loaded in time. System theme and the built-in language are in use for this session.",
|
||||
"webWasmWorkspaceBusy": "The local workspace is temporarily in use by another tab. Wait a moment and retry.",
|
||||
"loading": "Loading...",
|
||||
"loadFailed": "Failed to load",
|
||||
"saveFailed": "Failed to save",
|
||||
"initializing": "Initializing...",
|
||||
"noResults": "No results found",
|
||||
"export": "Export",
|
||||
|
||||
@@ -34,6 +34,7 @@
|
||||
"appearance": {
|
||||
"title": "Appearance",
|
||||
"themeMode": "Theme Mode",
|
||||
"uiScale": "UI scale",
|
||||
"insightCardTheme": "Insight card colors",
|
||||
"insightCardThemeOption": "Color scheme {index}",
|
||||
"auto": "System",
|
||||
|
||||
@@ -21,6 +21,8 @@
|
||||
"presentationFallback": "表示設定を時間内に読み込めなかったため、このセッションではシステムテーマと組み込み言語を使用します。",
|
||||
"webWasmWorkspaceBusy": "ローカルワークスペースは一時的に別のタブで使用されています。しばらく待ってから再試行してください。",
|
||||
"loading": "読み込み中...",
|
||||
"loadFailed": "読み込みに失敗しました",
|
||||
"saveFailed": "保存に失敗しました",
|
||||
"initializing": "初期化中...",
|
||||
"noResults": "結果が見つかりません",
|
||||
"export": "エクスポート",
|
||||
|
||||
@@ -34,6 +34,7 @@
|
||||
"appearance": {
|
||||
"title": "外観設定",
|
||||
"themeMode": "テーマモード",
|
||||
"uiScale": "表示倍率",
|
||||
"insightCardTheme": "インサイトカードの配色",
|
||||
"insightCardThemeOption": "配色 {index}",
|
||||
"auto": "システムに従う",
|
||||
|
||||
@@ -21,6 +21,8 @@
|
||||
"presentationFallback": "外观偏好未能及时加载,本次启动已使用系统主题和内置语言。",
|
||||
"webWasmWorkspaceBusy": "本地工作区暂时正由另一个标签页使用。请稍候后重试。",
|
||||
"loading": "加载中...",
|
||||
"loadFailed": "加载失败",
|
||||
"saveFailed": "保存失败",
|
||||
"initializing": "初始化中...",
|
||||
"noResults": "无匹配结果",
|
||||
"export": "导出",
|
||||
|
||||
@@ -34,6 +34,7 @@
|
||||
"appearance": {
|
||||
"title": "外观设置",
|
||||
"themeMode": "主题模式",
|
||||
"uiScale": "界面缩放",
|
||||
"insightCardTheme": "洞察卡片配色",
|
||||
"insightCardThemeOption": "配色 {index}",
|
||||
"auto": "跟随系统",
|
||||
|
||||
@@ -21,6 +21,8 @@
|
||||
"presentationFallback": "外觀偏好未能及時載入,本次啟動已使用系統主題和內建語言。",
|
||||
"webWasmWorkspaceBusy": "本機工作區暫時正由另一個分頁使用。請稍候後重試。",
|
||||
"loading": "載入中...",
|
||||
"loadFailed": "載入失敗",
|
||||
"saveFailed": "儲存失敗",
|
||||
"initializing": "初始化中...",
|
||||
"noResults": "無匹配結果",
|
||||
"export": "匯出",
|
||||
|
||||
@@ -34,6 +34,7 @@
|
||||
"appearance": {
|
||||
"title": "外觀設定",
|
||||
"themeMode": "主題模式",
|
||||
"uiScale": "介面縮放",
|
||||
"insightCardTheme": "洞察卡片配色",
|
||||
"insightCardThemeOption": "配色 {index}",
|
||||
"auto": "依系統設定",
|
||||
|
||||
@@ -49,6 +49,14 @@ export class BrowserPlatformAdapter implements PlatformAdapter {
|
||||
return { success: false, error: 'Desktop close behavior is not available in Web WASM' }
|
||||
}
|
||||
|
||||
async getDesktopUiScale(): Promise<number> {
|
||||
return 1
|
||||
}
|
||||
|
||||
async setDesktopUiScale(_scale: number): Promise<{ success: boolean; error?: string }> {
|
||||
return { success: false, error: 'Desktop UI scale is not available in Web WASM' }
|
||||
}
|
||||
|
||||
async getAnalyticsEnabled(): Promise<boolean> {
|
||||
return false
|
||||
}
|
||||
|
||||
@@ -56,6 +56,14 @@ export class CliWebPlatformAdapter implements PlatformAdapter {
|
||||
return { success: false, error: 'Not available in CLI Web' }
|
||||
}
|
||||
|
||||
async getDesktopUiScale(): Promise<number> {
|
||||
return 1
|
||||
}
|
||||
|
||||
async setDesktopUiScale(_scale: number): Promise<{ success: boolean; error?: string }> {
|
||||
return { success: false, error: 'Not available in CLI Web' }
|
||||
}
|
||||
|
||||
async getAnalyticsEnabled(): Promise<boolean> {
|
||||
try {
|
||||
const resp = await fetchWithAuth('/_web/telemetry/enabled')
|
||||
|
||||
@@ -34,6 +34,14 @@ export class ElectronPlatformAdapter implements PlatformAdapter {
|
||||
return window.api.app.setDesktopCloseBehavior(behavior)
|
||||
}
|
||||
|
||||
getDesktopUiScale(): Promise<number> {
|
||||
return window.api.app.getDesktopUiScale()
|
||||
}
|
||||
|
||||
setDesktopUiScale(scale: number): Promise<{ success: boolean; error?: string }> {
|
||||
return window.api.app.setDesktopUiScale(scale)
|
||||
}
|
||||
|
||||
getAnalyticsEnabled(): Promise<boolean> {
|
||||
return window.api.app.getAnalyticsEnabled()
|
||||
}
|
||||
|
||||
@@ -48,6 +48,8 @@ export interface PlatformAdapter {
|
||||
setOpenAtLogin(enabled: boolean): Promise<{ success: boolean; error?: string }>
|
||||
getDesktopCloseBehavior(): Promise<DesktopCloseBehavior>
|
||||
setDesktopCloseBehavior(behavior: DesktopCloseBehavior): Promise<{ success: boolean; error?: string }>
|
||||
getDesktopUiScale(): Promise<number>
|
||||
setDesktopUiScale(scale: number): Promise<{ success: boolean; error?: string }>
|
||||
|
||||
getAnalyticsEnabled(): Promise<boolean>
|
||||
setAnalyticsEnabled(enabled: boolean): Promise<{ success: boolean }>
|
||||
|
||||
Reference in new issue
Block a user