Skip to content

Commit 93d141c

Browse files
author
Eric Wheeler
committed
feat: hide terminal settings when shell integration disabled
Hide terminal shell integration settings when shell integration is disabled to reduce confusion and improve UX by only showing relevant options. Signed-off-by: Eric Wheeler <[email protected]>
1 parent fe581bd commit 93d141c

File tree

1 file changed

+127
-108
lines changed

1 file changed

+127
-108
lines changed

‎webview-ui/src/components/settings/TerminalSettings.tsx‎

Lines changed: 127 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,9 @@ export const TerminalSettings = ({
113113
<div>
114114
<VSCodeCheckbox
115115
checked={terminalCompressProgressBar ?? true}
116-
onChange={(e: any) => setCachedStateField("terminalCompressProgressBar", e.target.checked)}
116+
onChange={(e: any) =>
117+
setCachedStateField("terminalCompressProgressBar", e.target.checked)
118+
}
117119
data-testid="terminal-compress-progress-bar-checkbox">
118120
<span className="font-medium">{t("settings:terminal.compressProgressBar.label")}</span>
119121
</VSCodeCheckbox>
@@ -124,7 +126,6 @@ export const TerminalSettings = ({
124126
</div>
125127
</div>
126128

127-
128129
{/* Advanced Settings */}
129130
<div className="flex flex-col gap-3 mt-6">
130131
<div className="flex items-center gap-4 font-bold">
@@ -135,62 +136,6 @@ export const TerminalSettings = ({
135136
{t("settings:terminal.advanced.description")}
136137
</p>
137138
<div className="pl-3 border-vscode-button-background">
138-
139-
<div>
140-
<VSCodeCheckbox
141-
checked={terminalShellIntegrationDisabled ?? false}
142-
onChange={(e: any) =>
143-
setCachedStateField("terminalShellIntegrationDisabled", e.target.checked)
144-
}>
145-
<span className="font-medium">{t("settings:terminal.shellIntegrationDisabled.label")}</span>
146-
</VSCodeCheckbox>
147-
<div className="text-vscode-descriptionForeground text-sm mt-1">
148-
{t("settings:terminal.shellIntegrationDisabled.description")}
149-
</div>
150-
</div>
151-
<div>
152-
<label className="block font-medium mb-1">
153-
{t("settings:terminal.shellIntegrationTimeout.label")}
154-
</label>
155-
<div className="flex items-center gap-2">
156-
<Slider
157-
min={1000}
158-
max={60000}
159-
step={1000}
160-
value={[terminalShellIntegrationTimeout ?? 5000]}
161-
onValueChange={([value]) =>
162-
setCachedStateField(
163-
"terminalShellIntegrationTimeout",
164-
Math.min(60000, Math.max(1000, value)),
165-
)
166-
}
167-
/>
168-
<span className="w-10">{(terminalShellIntegrationTimeout ?? 5000) / 1000}s</span>
169-
</div>
170-
<div className="text-vscode-descriptionForeground text-sm mt-1">
171-
{t("settings:terminal.shellIntegrationTimeout.description")}
172-
</div>
173-
</div>
174-
175-
<div>
176-
<label className="block font-medium mb-1">{t("settings:terminal.commandDelay.label")}</label>
177-
<div className="flex items-center gap-2">
178-
<Slider
179-
min={0}
180-
max={1000}
181-
step={10}
182-
value={[terminalCommandDelay ?? 0]}
183-
onValueChange={([value]) =>
184-
setCachedStateField("terminalCommandDelay", Math.min(1000, Math.max(0, value)))
185-
}
186-
/>
187-
<span className="w-10">{terminalCommandDelay ?? 50}ms</span>
188-
</div>
189-
<div className="text-vscode-descriptionForeground text-sm mt-1">
190-
{t("settings:terminal.commandDelay.description")}
191-
</div>
192-
</div>
193-
194139
<div>
195140
<VSCodeCheckbox
196141
checked={inheritEnv}
@@ -212,65 +157,139 @@ export const TerminalSettings = ({
212157

213158
<div>
214159
<VSCodeCheckbox
215-
checked={terminalPowershellCounter ?? false}
160+
checked={terminalShellIntegrationDisabled ?? false}
216161
onChange={(e: any) =>
217-
setCachedStateField("terminalPowershellCounter", e.target.checked)
218-
}
219-
data-testid="terminal-powershell-counter-checkbox">
220-
<span className="font-medium">{t("settings:terminal.powershellCounter.label")}</span>
162+
setCachedStateField("terminalShellIntegrationDisabled", e.target.checked)
163+
}>
164+
<span className="font-medium">
165+
{t("settings:terminal.shellIntegrationDisabled.label")}
166+
</span>
221167
</VSCodeCheckbox>
222168
<div className="text-vscode-descriptionForeground text-sm mt-1">
223-
{t("settings:terminal.powershellCounter.description")}
169+
{t("settings:terminal.shellIntegrationDisabled.description")}
224170
</div>
225171
</div>
172+
{!terminalShellIntegrationDisabled && (
173+
<>
174+
<div>
175+
<label className="block font-medium mb-1">
176+
{t("settings:terminal.shellIntegrationTimeout.label")}
177+
</label>
178+
<div className="flex items-center gap-2">
179+
<Slider
180+
min={1000}
181+
max={60000}
182+
step={1000}
183+
value={[terminalShellIntegrationTimeout ?? 5000]}
184+
onValueChange={([value]) =>
185+
setCachedStateField(
186+
"terminalShellIntegrationTimeout",
187+
Math.min(60000, Math.max(1000, value)),
188+
)
189+
}
190+
/>
191+
<span className="w-10">
192+
{(terminalShellIntegrationTimeout ?? 5000) / 1000}s
193+
</span>
194+
</div>
195+
<div className="text-vscode-descriptionForeground text-sm mt-1">
196+
{t("settings:terminal.shellIntegrationTimeout.description")}
197+
</div>
198+
</div>
226199

227-
<div>
228-
<VSCodeCheckbox
229-
checked={terminalZshClearEolMark ?? true}
230-
onChange={(e: any) => setCachedStateField("terminalZshClearEolMark", e.target.checked)}
231-
data-testid="terminal-zsh-clear-eol-mark-checkbox">
232-
<span className="font-medium">{t("settings:terminal.zshClearEolMark.label")}</span>
233-
</VSCodeCheckbox>
234-
<div className="text-vscode-descriptionForeground text-sm mt-1">
235-
{t("settings:terminal.zshClearEolMark.description")}
236-
</div>
237-
</div>
200+
<div>
201+
<label className="block font-medium mb-1">
202+
{t("settings:terminal.commandDelay.label")}
203+
</label>
204+
<div className="flex items-center gap-2">
205+
<Slider
206+
min={0}
207+
max={1000}
208+
step={10}
209+
value={[terminalCommandDelay ?? 0]}
210+
onValueChange={([value]) =>
211+
setCachedStateField(
212+
"terminalCommandDelay",
213+
Math.min(1000, Math.max(0, value)),
214+
)
215+
}
216+
/>
217+
<span className="w-10">{terminalCommandDelay ?? 50}ms</span>
218+
</div>
219+
<div className="text-vscode-descriptionForeground text-sm mt-1">
220+
{t("settings:terminal.commandDelay.description")}
221+
</div>
222+
</div>
238223

239-
<div>
240-
<VSCodeCheckbox
241-
checked={terminalZshOhMy ?? false}
242-
onChange={(e: any) => setCachedStateField("terminalZshOhMy", e.target.checked)}
243-
data-testid="terminal-zsh-oh-my-checkbox">
244-
<span className="font-medium">{t("settings:terminal.zshOhMy.label")}</span>
245-
</VSCodeCheckbox>
246-
<div className="text-vscode-descriptionForeground text-sm mt-1">
247-
{t("settings:terminal.zshOhMy.description")}
248-
</div>
249-
</div>
224+
<div>
225+
<VSCodeCheckbox
226+
checked={terminalPowershellCounter ?? false}
227+
onChange={(e: any) =>
228+
setCachedStateField("terminalPowershellCounter", e.target.checked)
229+
}
230+
data-testid="terminal-powershell-counter-checkbox">
231+
<span className="font-medium">
232+
{t("settings:terminal.powershellCounter.label")}
233+
</span>
234+
</VSCodeCheckbox>
235+
<div className="text-vscode-descriptionForeground text-sm mt-1">
236+
{t("settings:terminal.powershellCounter.description")}
237+
</div>
238+
</div>
250239

251-
<div>
252-
<VSCodeCheckbox
253-
checked={terminalZshP10k ?? false}
254-
onChange={(e: any) => setCachedStateField("terminalZshP10k", e.target.checked)}
255-
data-testid="terminal-zsh-p10k-checkbox">
256-
<span className="font-medium">{t("settings:terminal.zshP10k.label")}</span>
257-
</VSCodeCheckbox>
258-
<div className="text-vscode-descriptionForeground text-sm mt-1">
259-
{t("settings:terminal.zshP10k.description")}
260-
</div>
261-
</div>
240+
<div>
241+
<VSCodeCheckbox
242+
checked={terminalZshClearEolMark ?? true}
243+
onChange={(e: any) =>
244+
setCachedStateField("terminalZshClearEolMark", e.target.checked)
245+
}
246+
data-testid="terminal-zsh-clear-eol-mark-checkbox">
247+
<span className="font-medium">
248+
{t("settings:terminal.zshClearEolMark.label")}
249+
</span>
250+
</VSCodeCheckbox>
251+
<div className="text-vscode-descriptionForeground text-sm mt-1">
252+
{t("settings:terminal.zshClearEolMark.description")}
253+
</div>
254+
</div>
262255

263-
<div>
264-
<VSCodeCheckbox
265-
checked={terminalZdotdir ?? false}
266-
onChange={(e: any) => setCachedStateField("terminalZdotdir", e.target.checked)}
267-
data-testid="terminal-zdotdir-checkbox">
268-
<span className="font-medium">{t("settings:terminal.zdotdir.label")}</span>
269-
</VSCodeCheckbox>
270-
<div className="text-vscode-descriptionForeground text-sm mt-1">
271-
{t("settings:terminal.zdotdir.description")}
272-
</div>
273-
</div>
256+
<div>
257+
<VSCodeCheckbox
258+
checked={terminalZshOhMy ?? false}
259+
onChange={(e: any) => setCachedStateField("terminalZshOhMy", e.target.checked)}
260+
data-testid="terminal-zsh-oh-my-checkbox">
261+
<span className="font-medium">{t("settings:terminal.zshOhMy.label")}</span>
262+
</VSCodeCheckbox>
263+
<div className="text-vscode-descriptionForeground text-sm mt-1">
264+
{t("settings:terminal.zshOhMy.description")}
265+
</div>
266+
</div>
267+
268+
<div>
269+
<VSCodeCheckbox
270+
checked={terminalZshP10k ?? false}
271+
onChange={(e: any) => setCachedStateField("terminalZshP10k", e.target.checked)}
272+
data-testid="terminal-zsh-p10k-checkbox">
273+
<span className="font-medium">{t("settings:terminal.zshP10k.label")}</span>
274+
</VSCodeCheckbox>
275+
<div className="text-vscode-descriptionForeground text-sm mt-1">
276+
{t("settings:terminal.zshP10k.description")}
277+
</div>
278+
</div>
279+
280+
<div>
281+
<VSCodeCheckbox
282+
checked={terminalZdotdir ?? false}
283+
onChange={(e: any) => setCachedStateField("terminalZdotdir", e.target.checked)}
284+
data-testid="terminal-zdotdir-checkbox">
285+
<span className="font-medium">{t("settings:terminal.zdotdir.label")}</span>
286+
</VSCodeCheckbox>
287+
<div className="text-vscode-descriptionForeground text-sm mt-1">
288+
{t("settings:terminal.zdotdir.description")}
289+
</div>
290+
</div>
291+
</>
292+
)}
274293
</div>
275294
</div>
276295
</Section>

0 commit comments

Comments
 (0)