Standardize Settings layout and save feedback (#2122)

* Group settings navigation menu

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Revert "Group settings navigation menu"

This reverts commit 5983a4e82074b8dab1084af1cadd803ba28ea65d.

* Standardize settings layout feedback

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Fix settings save status timer typing

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Retain settings save status

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Report color mode save state

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Match Appearance settings to two-column layout

Rebuild Appearance into Color mode & Theme, Localization, and Density & type sections with responsive two-column grids, consistent section headers, page description, and green save status.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Migrate settings pages to SettingsPageLayout and SettingsSection

Replace ScrollableOverlay/max-w-3xl shells with the shared settings
layout primitives across entity and static settings pages, normalize
section headers, and add settings.page.behavior.description locales.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Unify remaining settings pages on shared section chrome

Wire Appearance, Projects, and Remote Instances through SettingsSection/SettingsPageLayout so every settings surface shares the same header, divider, and page shell treatment.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Align settings UI with OpenChamber design system kit

Apply kit geometry and control specs: 840px content width, 32/48 padding, fixed 260/280 sidebars, radius/spacing tokens, settings select height, stepper dimensions, and shared field/link typography.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Migrate OpenChamberVisualSettings to shared settings primitives

Replace ad-hoc radio/checkbox/chip/field layouts with SettingsSection
shared chrome for Appearance, Density, Navigation, Chat/behavior, and
Privacy while preserving handlers and data-settings-item anchors.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Migrate settings pages to shared field/checkbox/radio primitives

Unify Defaults, Notifications, Behavior, Git, Session Retention, Passkeys,
OpenCode CLI, Commands, About, Keyboard Shortcuts, and Desktop Network on
SettingsFieldRow / SettingsCheckboxRow / SettingsRadioGroup / SettingsChipGroup
for consistent grid, spacing, and DRY layout. Also remove the GitPage double
SettingsSection wrap around GitHubSettings.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Unify remaining settings pages onto shared field primitives

Migrate Agents, Snippets, Skills, Usage, MCP identity rows and selects to
SettingsFieldRow/CheckboxRow/ChipGroup and SETTINGS_SELECT_*; align page
titles; light-touch Voice/Tunnel/Providers/Plugins without rewriting
complex OAuth, permissions, or tunnel flows.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Polish settings section dividers and transport helper text

Slightly stronger section borders for clearer group separation, and keep
message-stream transport description under the chip control.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Fix settings grid alignment, control heights, and Chat section titles

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Tighten settings grid: flat Chat 2x2 and full-width stacked selects

Message options use a flat two-column grid so row headers share a baseline.
Stacked selects fill their column; field-row selects keep a fixed sm:w-56 width.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Align mixed settings controls to shared FieldRow/CheckboxRow grid

Separate FieldRows from CheckboxRows with SettingsInset, move enum
radios into ControlGroups, and convert misplaced StackedFields to
full-width FieldRows so left edges no longer clash.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Translate Behavior response-style preset labels for es and pl

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Group settings nav into categories and improve icons/order

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Fix settings layout: fewer hrs, shared control widths, chat transport section

Remove SettingsInset top borders, align App install/Density controls to full cluster width, give Message Stream Transport its own Chat section, and fold Sessions Small Model into the first section to cut extra dividers.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Align Voice and MCP settings labels with shared heading classes

Swap form field labels to SETTINGS_FIELD_LABEL_CLASS and use
SettingsGroupTitle for MCP control-group headings (manual auth fallback,
request headers).

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Differentiate settings heading levels by context

Page titles are larger and quieter than section titles; group and field
labels use dedicated shared classes so hierarchy is consistent across
settings surfaces without ad-hoc typography mixes.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Use shared settings title classes in SettingsView home

Wire home and unavailable headings through the shared L1/L2 class
constants so they stay aligned with SettingsPageLayout.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Keep settings number steppers from stretching +/- buttons

Density & type NumberInputs no longer flex-grow across the row, and
NumberInput locks minus/plus to fixed width so the plus side cannot
inflate when the control is placed in a full-width cluster.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Place spacing and input-bar offset on their own row

Density & type now lays out as font families, then font sizes, then
Spacing Density / Input Bar Offset on the row below.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Regroup settings nav and improve Voice layout

Drop Advanced/Usage/Git nav categories: Voice and About under
Interface, Usage under OpenCode, Git under Workspace. Voice provider
chips and STT model cards use shared settings primitives with roomier
spacing and a two-column model grid.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* Space out chat feature groups in visual settings

* Polish settings: save-state wiring, container-query layouts, unified dropdown triggers

- Wire shared save indicator into Behavior page saves and git identity CRUD
- Convert settings layout primitives and page rows from viewport to container
  queries so narrow panes stack instead of clipping
- Unify custom dropdown triggers (model/agent/provider pickers) and remaining
  page selects on the settings control size
- Bump global radius scale by 1px; align variant input with select size
- Migrate stray raw controls (MCP OAuth checkbox, worktree remove button,
  git identity dialog rows, skills dialog labels) onto shared primitives
- Make settings nav items span full sidebar width; trim nav to 240px

* Add General settings page, regroup nav, cap control widths, promote chat feature headers

* Mobile settings nav: plain background and touch-sized rows

* Hide secondary settings descriptions behind clickable info hints

* Move quota credentials to Usage, navigation settings to General, rename External Tunnel

* Quiet settings save indicator: silent success, delayed spinner, visible errors

* Rewrite settings-ui-patterns skill around shared primitives and refactored conventions

* Remove settings starter page; open last visited page, defaulting to General

* Settings polish: spacing, control sizes, trigger widths, readable model names, device dates

* Centralize dropdown trigger chrome, settings nav polish, mobile-only input bar offset

* Fix global line-height regression, auto-hide first-section divider, shortcut row spacing

* Global line-height 1.45, align scheduled tasks header button with select

* Hide editor toolbar and About in VS Code, animate chat render preview outside desktop dialog

* Rebuild agent tool permissions on source-of-truth model

Edit the agent's own permission map verbatim (inherit vs explicit actions, pattern rules only for pattern-capable keys), save permission-only, drop the server-side non-wildcard re-merge that resurrected deleted rules, and surface session-granted rules as read-only.

* Agents model parameters polish: row spacing, variant dropdown, unified widths, dash for unset numbers

---------

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
Co-authored-by: Bohdan Triapitsyn <artmore@protonmail.com>

packages/ui/src/lib/i18n/messages/ko.settings.ts

@@ -47,6 +47,10 @@ export const settingsDict = {
   'settings.view.search.aria': '설정 검색',
   'settings.view.search.clear': '설정 검색 지우기',
   'settings.view.search.noResults': '일치하는 설정이 없습니다',
+  'settings.view.nav.group.general': 'OpenChamber',
+  'settings.view.nav.group.projects': '워크스페이스',
+  'settings.view.nav.group.opencode': 'OpenCode',
+  'settings.view.nav.group.content': '라이브러리',
   'settings.page.projects.title': '프로젝트',
   'settings.page.remoteInstances.title': '원격 인스턴스',
   'settings.page.providers.title': '프로바이더',
@@ -59,13 +63,22 @@ export const settingsDict = {
   'settings.page.skillsCatalog.title': '스킬 카탈로그',
   'settings.page.git.title': 'Git',
   'settings.page.appearance.title': '외관',
+  'settings.page.appearance.description': 'OpenChamber의 모양과 느낌을 맞춤 설정하세요.',
   'settings.page.chat.title': '채팅',
+  'settings.page.chat.description': '메시지와 도구가 표시되는 방식을 구성합니다.',
   'settings.page.shortcuts.title': '단축키',
+  'settings.page.shortcuts.description': '키보드 단축키를 맞춤 설정합니다.',
+  'settings.page.general.title': '일반',
+  'settings.page.general.description': '앱 시작, 보안, 연결 및 개인정보.',
   'settings.page.sessions.title': '세션',
+  'settings.page.sessions.description': '세션 기본값과 보관 기간을 설정합니다.',
   'settings.page.magicPrompts.title': '매직 프롬프트',
   'settings.page.notifications.title': '알림',
+  'settings.page.notifications.description': '알림을 받을 시점과 방식을 선택합니다.',
   'settings.page.voice.title': '음성',
-  'settings.page.tunnel.title': '원격 터널',
+  'settings.page.voice.description': '음성 및 받아쓰기를 구성합니다.',
+  'settings.page.tunnel.title': '외부 터널',
+  'settings.page.tunnel.description': '원격 터널로 이 인스턴스를 노출합니다.',
   'settings.page.about.title': '정보',
   'settings.page.snippets.title': '스니펫',
   'settings.snippets.sidebar.title': '스니펫',
@@ -90,7 +103,7 @@ export const settingsDict = {
   'settings.snippets.page.toast.contentRequired': '스니펫 내용은 필수입니다',
   'settings.snippets.page.toast.saveFailed': '스니펫 저장 실패',
   'settings.snippets.page.toast.saved': '스니펫이 저장되었습니다',
-  'settings.openchamber.tunnel.title': '원격 터널',
+  'settings.openchamber.tunnel.title': '외부 터널',
   'settings.openchamber.tunnel.description': '퀵 링크나 직접 관리하는 Cloudflare 터널로 안전한 원격 접속을 설정하세요.',
   'settings.openchamber.tunnel.note.serverSideEnforced': '보안 터널 접근은 서버 측에서 강제됩니다.',
   'settings.openchamber.tunnel.note.connectLinksOneTime': '접속 링크는 일회용이며, 터널이 중지되거나 링크 TTL이 만료되면 폐기됩니다.',
@@ -366,6 +379,7 @@ export const settingsDict = {
   'settings.remoteInstances.page.logsDialog.selectedInstanceFallback': '선택한 인스턴스',
   'settings.remoteInstances.page.patternDialog.descriptionWithHost': '{host}에는 구체적인 대상이 필요합니다.',
   'settings.remoteInstances.page.patternDialog.description': '대상을 입력하세요.',
+  'settings.common.infoAria': '자세한 정보',
   'settings.common.actions.cancel': '취소',
   'settings.common.actions.create': '생성',
   'settings.common.actions.delete': '삭제',
@@ -376,6 +390,8 @@ export const settingsDict = {
   'settings.common.actions.copyAll': '모두 복사',
   'settings.common.actions.clear': '지우기',
   'settings.common.actions.saving': '저장 중...',
+  'settings.common.status.saved': '저장됨',
+  'settings.common.status.saveFailed': '저장 실패',
   'settings.common.actions.saveChanges': '변경 사항 저장',
   'settings.common.scope.global': '전역',
   'settings.common.scope.project': '프로젝트',
@@ -460,6 +476,33 @@ export const settingsDict = {
   'settings.agents.page.section.identityRole': '정체성 및 역할',
   'settings.agents.page.section.modelParameters': '모델 및 파라미터',
   'settings.agents.page.section.systemPrompt': '시스템 프롬프트',
+  'settings.agents.page.permissionsEditor.sectionInfo': '이 에이전트 자체의 권한 규칙을 설정 파일에 저장된 그대로 편집합니다. "상속"은 키를 설정하지 않은 상태로 두어 전역 설정과 기본값이 적용됩니다.',
+  'settings.agents.page.permissionsEditor.defaultLabel': '모든 도구 기본값',
+  'settings.agents.page.permissionsEditor.defaultAria': '모든 도구의 기본 권한',
+  'settings.agents.page.permissionsEditor.defaultInfo': '에이전트 수준 폴백(* 키)입니다. 자체 규칙이 없는 도구에 적용됩니다.',
+  'settings.agents.page.permissionsEditor.effectiveHint': '→ {action}',
+  'settings.agents.page.permissionsEditor.ruleCount': '규칙 {count}개',
+  'settings.agents.page.permissionsEditor.keyAria': '{key} 권한',
+  'settings.agents.page.permissionsEditor.patternPlaceholder': '패턴, 예: rm -rf * 또는 /path/**',
+  'settings.agents.page.permissionsEditor.patternActionAria': '{key} 패턴의 동작',
+  'settings.agents.page.permissionsEditor.customKeyPlaceholder': '사용자 지정 권한 키…',
+  'settings.agents.page.permissionsEditor.sessionRulesTitle': '세션에서 허용됨(저장 안 됨)',
+  'settings.agents.page.permissionsEditor.sessionRulesInfo': '라이브 세션 중 허용된 규칙("항상 허용" 응답 등)입니다. 지금은 적용되지만 저장된 설정에는 포함되지 않으며 재시작 시 사라집니다.',
+  'settings.agents.page.permissionsEditor.action.default': '기본값',
+  'settings.agents.page.permissionsEditor.action.inherit': '상속',
+  'settings.agents.page.permissionsEditor.action.allow': '허용',
+  'settings.agents.page.permissionsEditor.action.ask': '확인',
+  'settings.agents.page.permissionsEditor.action.deny': '거부',
+  'settings.agents.page.permissionsEditor.actions.save': '권한 저장',
+  'settings.agents.page.permissionsEditor.actions.discard': '취소',
+  'settings.agents.page.permissionsEditor.actions.addRule': '규칙 추가',
+  'settings.agents.page.permissionsEditor.actions.addKey': '키 추가',
+  'settings.agents.page.permissionsEditor.actions.removeRuleAria': '규칙 삭제',
+  'settings.agents.page.permissionsEditor.actions.retry': '다시 시도',
+  'settings.agents.page.permissionsEditor.state.loadFailed': '에이전트 권한 설정을 불러오지 못했습니다.',
+  'settings.agents.page.permissionsEditor.toast.saved': '권한이 저장되었습니다',
+  'settings.agents.page.permissionsEditor.toast.savedRestartRequired': '권한이 저장되었습니다 — 적용하려면 OpenCode 서버를 재시작하세요',
+  'settings.agents.page.permissionsEditor.toast.saveFailed': '권한 저장에 실패했습니다',
   'settings.agents.page.section.toolPermissions': '도구 권한',
   'settings.agents.page.field.agentName': '에이전트 이름',
   'settings.agents.page.field.agentNamePlaceholder': 'agent-name (예: code-reviewer)',
@@ -495,6 +538,7 @@ export const settingsDict = {
   'settings.agents.page.permissions.permissionPlaceholder': '권한...',
   'settings.agents.page.permissions.patternPlaceholder': '패턴(예: *)',
   'settings.page.behavior.title': '동작',
+  'settings.page.behavior.description': '에이전트의 응답 방식을 안내합니다.',
   'settings.behavior.page.title': '동작',
   'settings.behavior.page.warning.title': '전역 규칙은 프로젝트 규칙과 함께 사용됩니다',
   'settings.behavior.page.warning.description': '여기에서 변경한 내용은 {path}를 업데이트합니다. 프로젝트 수준의 AGENTS.md가 있으면 OpenCode도 함께 포함합니다.',
@@ -880,6 +924,8 @@ export const settingsDict = {
   'settings.openchamber.desktopNetwork.field.allowLanAccessDescription': '휴대폰, 태블릿, Wi-Fi의 다른 컴퓨터에서 열 수 있도록 앱을 다시 시작합니다.',
   'settings.openchamber.desktopNetwork.field.warning': '경고: 활성화된 동안 같은 로컬 네트워크의 누구나 앱에 접속할 수 있습니다.',
   'settings.openchamber.desktopNetwork.field.passwordRequiredWarning': 'LAN 접속에는 Desktop UI 비밀번호가 필요합니다. 설정하기 전까지 desktop 앱은 로컬 전용으로 시작됩니다.',
+  'settings.openchamber.desktopPassword.actions.showPassword': '비밀번호 표시',
+  'settings.openchamber.desktopPassword.actions.hidePassword': '비밀번호 숨기기',
   'settings.openchamber.desktopPassword.field.password': 'Desktop UI 비밀번호',
   'settings.openchamber.desktopPassword.field.passwordPlaceholder': '비밀번호 필요 없음',
   'settings.openchamber.desktopPassword.field.passwordDescription': 'OpenChamber는 다시 시작 후 비밀번호를 요청하고, 이후 로그인 세션이 만료되면 다시 요청합니다. 기본 12시간, 이 디바이스 신뢰 선택 시 7일입니다. 로그인을 끄려면 비워 두세요.',
@@ -1585,6 +1631,7 @@ export const settingsDict = {
   'settings.voice.page.section.playbackAndSummary': '재생',
   'settings.voice.page.field.provider': '프로바이더',
   'settings.voice.page.provider.browser': '브라우저',
+  'settings.voice.page.provider.openai': 'OpenAI',
   'settings.voice.page.provider.custom': '사용자 정의',
   'settings.voice.page.provider.say': 'Say',
   'settings.voice.page.provider.server': '서버',
@@ -1664,18 +1711,24 @@ export const settingsDict = {
   'settings.voice.page.field.ttsInputModeRaw': '원본 Markdown',
   'settings.voice.page.field.ttsInputModeSummarized': '요약',
   'settings.openchamber.visual.section.colorMode': '색상 모드',
+  'settings.openchamber.visual.section.colorModeAndTheme': '색상 모드 및 테마',
   'settings.openchamber.visual.section.mobileLayout': '모바일 레이아웃',
   'settings.openchamber.visual.option.mobileLayout.default': '이전',
   'settings.openchamber.visual.option.mobileLayout.new': '새로움',
   'settings.openchamber.visual.section.localization': '지역화',
   'settings.openchamber.visual.section.spacingAndLayout': '간격 및 레이아웃',
+  'settings.openchamber.visual.section.densityAndType': '밀도 및 서체',
+  'settings.openchamber.visual.section.appInstall': '앱 설치',
   'settings.openchamber.visual.section.navigation': '내비게이션',
   'settings.openchamber.visual.section.chatRenderMode': '채팅 렌더링 모드',
   'settings.openchamber.visual.section.chatRenderModeAria': '채팅 렌더링 모드',
+  'settings.openchamber.visual.section.chatDisplay': '표시',
+  'settings.openchamber.visual.section.chatMessageOptions': '메시지 옵션',
+  'settings.openchamber.visual.section.chatFeatures': '기능',
   'settings.openchamber.visual.section.messageStreamTransport': '메시지 스트림 전송',
   'settings.openchamber.visual.section.activityDefault': 'Activity 기본값',
   'settings.openchamber.visual.section.activityDefaultAria': 'Activity 기본 모드',
-  'settings.openchamber.visual.section.showToolsOpenedByDefault': '도구를 기본으로 펼쳐 표시:',
+  'settings.openchamber.visual.section.showToolsOpenedByDefault': '도구를 기본으로 펼쳐 표시',
   'settings.openchamber.visual.section.sessionAssistance': '세션 지원',
   'settings.openchamber.visual.section.reasoning': '추론',
   'settings.openchamber.visual.section.messageAppearance': '메시지 모양',
@@ -1806,8 +1859,11 @@ export const settingsDict = {
   'settings.openchamber.visual.field.sendAnonymousUsageReports': '익명 사용량 보고서 보내기',
   'settings.openchamber.visual.field.sendAnonymousUsageReportsHint': '활성 사용 앱 버전을 파악해 개선 우선순위를 정하는 데 도움이 됩니다. 앱 버전, 플랫폼, 런타임만 수집되며 개인 데이터나 코드는 수집되지 않습니다.',
   'settings.openchamber.visual.option.themeMode.system': 'System',
+  'settings.openchamber.visual.option.themeMode.system.description': '시스템 설정 따르기',
   'settings.openchamber.visual.option.themeMode.light': 'Light',
+  'settings.openchamber.visual.option.themeMode.light.description': '항상 라이트 모양 사용',
   'settings.openchamber.visual.option.themeMode.dark': 'Dark',
+  'settings.openchamber.visual.option.themeMode.dark.description': '항상 다크 모양 사용',
   'settings.openchamber.visual.option.diffLayout.dynamic.label': '동적',
   'settings.openchamber.visual.option.diffLayout.dynamic.description': '새 항목은 inline, 수정 항목은 side-by-side로 표시합니다.',
   'settings.openchamber.visual.option.diffLayout.inline.label': '항상 inline',