ceos/opencode
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor(tui): compact settings values

Browse source
This commit is contained in:
Dax Raad 2026-07-13 03:46:38 +00:00 • committed by 𝓛𝓲𝓽𝓽𝓵𝓮 𝓕𝓻𝓪𝓷𝓴
commit 20af1f5e79
1 changed files with 16 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

55
packages/tui/src/component/dialog-config.tsx
View file

@ -269,8 +269,12 @@ export function DialogConfig() {
setting.path.join(".") === "theme.name" setting.path.join(".") === "theme.name"
? Object.keys(themeState.all()).sort((a, b) => a.localeCompare(b, undefined, { sensitivity: "base" })) ? Object.keys(themeState.all()).sort((a, b) => a.localeCompare(b, undefined, { sensitivity: "base" }))
: setting.values : setting.values
const compact = (setting: Setting) => setting.path.join(".") === "theme.name" || !setting.values const display = (setting: Setting) => {
const display = (setting: Setting) => setting.format?.(value(setting)) ?? String(value(setting)) const current = value(setting)
if (setting.format) return setting.format(current)
const index = setting.values?.indexOf(current)
return index === undefined || index < 0 ? String(current) : (setting.labels?.[index] ?? String(current))
}
const rows = createMemo(() => const rows = createMemo(() =>
settings.map((setting, index) => ({ settings.map((setting, index) => ({
setting, setting,
@ -368,43 +372,16 @@ export function DialogConfig() {
{row.setting.title} {row.setting.title}
</text> </text>
<box flexGrow={1} flexDirection="row" justifyContent="flex-end"> <box flexGrow={1} flexDirection="row" justifyContent="flex-end">
<Show <box flexDirection="row">
when={!compact(row.setting) && values(row.setting)} <text fg={theme.textMuted}>{row.index === selected() ? "‹ " : " "}</text>
fallback={ <text
<box flexDirection="row"> fg={row.index === selected() ? theme.primary : theme.textMuted}
<Show when={row.index === selected()}> attributes={row.index === selected() ? TextAttributes.BOLD : undefined}
<text fg={theme.textMuted}>‹ </text> >
</Show> {display(row.setting)}
<text </text>
fg={row.index === selected() ? theme.primary : theme.textMuted} <text fg={theme.textMuted}>{row.index === selected() ? " ›" : " "}</text>
attributes={row.index === selected() ? TextAttributes.BOLD : undefined} </box>
>
{display(row.setting)}
</text>
<Show when={row.index === selected()}>
<text fg={theme.textMuted}> ›</text>
</Show>
</box>
}
>
<box flexDirection="row" gap={2}>
<For each={values(row.setting)!}>
{(option, optionIndex) => {
const active = () => value(row.setting) === option
return (
<text
fg={
active() ? (row.index === selected() ? theme.primary : theme.text) : theme.textMuted
}
attributes={active() ? TextAttributes.BOLD : undefined}
>
{row.setting.labels?.[optionIndex()] ?? String(option)}
</text>
)
}}
</For>
</box>
</Show>
</box> </box>
</box> </box>
</> </>