Allow users to cancel out of theme selector (#310)
This commit is contained in:
parent
7d8392bab4
commit
61ccd4f33a
|
@ -202,6 +202,7 @@ export const App = ({ config, settings, cliVersion }: AppProps) => {
|
|||
onSelect={handleThemeSelect}
|
||||
onHighlight={handleThemeHighlight}
|
||||
settings={settings}
|
||||
setQuery={setQuery}
|
||||
/>
|
||||
</Box>
|
||||
) : (
|
||||
|
|
|
@ -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 = '';
|
||||
|
|
Loading…
Reference in New Issue