Allow users to cancel out of theme selector (#310)

This commit is contained in:
Miguel Solorio 2025-05-13 07:41:32 -07:00 committed by GitHub
parent 7d8392bab4
commit 61ccd4f33a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 9 additions and 0 deletions

View File

@ -202,6 +202,7 @@ export const App = ({ config, settings, cliVersion }: AppProps) => {
onSelect={handleThemeSelect}
onHighlight={handleThemeHighlight}
settings={settings}
setQuery={setQuery}
/>
</Box>
) : (

View File

@ -21,12 +21,15 @@ interface ThemeDialogProps {
onHighlight: (themeName: string | undefined) => void;
/** The settings object */
settings: LoadedSettings;
/** Callback to set the query */
setQuery: (query: string) => void;
}
export function ThemeDialog({
onSelect,
onHighlight,
settings,
setQuery,
}: ThemeDialogProps): React.JSX.Element {
const [selectedScope, setSelectedScope] = useState<SettingScope>(
SettingScope.User,
@ -56,6 +59,7 @@ export function ThemeDialog({
];
const handleThemeSelect = (themeName: string) => {
setQuery(''); // Clear the query when user selects a theme
onSelect(themeName, selectedScope);
};
@ -77,6 +81,10 @@ export function ThemeDialog({
if (key.tab) {
setFocusedSection((prev) => (prev === 'theme' ? 'scope' : 'theme'));
}
if (key.escape) {
setQuery(''); // Clear the query when user hits escape
onSelect(undefined, selectedScope);
}
});
let otherScopeModifiedMessage = '';