74 lines
2.2 KiB
TypeScript
74 lines
2.2 KiB
TypeScript
/**
|
|
* @license
|
|
* Copyright 2025 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
|
|
import { useState, useCallback } from 'react';
|
|
import { themeManager } from '../themes/theme-manager.js';
|
|
import { LoadedSettings, SettingScope } from '../../config/settings.js'; // Import LoadedSettings, AppSettings, MergedSetting
|
|
|
|
interface UseThemeCommandReturn {
|
|
isThemeDialogOpen: boolean;
|
|
openThemeDialog: () => void;
|
|
handleThemeSelect: (
|
|
themeName: string | undefined,
|
|
scope: SettingScope,
|
|
) => void; // Added scope
|
|
handleThemeHighlight: (themeName: string | undefined) => void;
|
|
}
|
|
|
|
export const useThemeCommand = (
|
|
loadedSettings: LoadedSettings,
|
|
): UseThemeCommandReturn => {
|
|
// Determine the effective theme
|
|
const effectiveTheme = loadedSettings.merged.theme;
|
|
|
|
// Initial state: Open dialog if no theme is set in either user or workspace settings
|
|
const [isThemeDialogOpen, setIsThemeDialogOpen] = useState(
|
|
effectiveTheme === undefined,
|
|
);
|
|
// TODO: refactor how theme's are accessed to avoid requiring a forced render.
|
|
const [, setForceRender] = useState(0);
|
|
|
|
const openThemeDialog = useCallback(() => {
|
|
setIsThemeDialogOpen(true);
|
|
}, []);
|
|
|
|
const applyTheme = useCallback((themeName: string | undefined) => {
|
|
try {
|
|
themeManager.setActiveTheme(themeName);
|
|
setForceRender((v) => v + 1); // Trigger potential re-render
|
|
} catch (error) {
|
|
console.error(`Error setting theme: ${error}`);
|
|
}
|
|
}, []);
|
|
|
|
const handleThemeHighlight = useCallback(
|
|
(themeName: string | undefined) => {
|
|
applyTheme(themeName);
|
|
},
|
|
[applyTheme],
|
|
); // Added applyTheme to dependencies
|
|
|
|
const handleThemeSelect = useCallback(
|
|
(themeName: string | undefined, scope: SettingScope) => {
|
|
// Added scope parameter
|
|
try {
|
|
loadedSettings.setValue(scope, 'theme', themeName); // Update the merged settings
|
|
applyTheme(loadedSettings.merged.theme); // Apply the current theme
|
|
} finally {
|
|
setIsThemeDialogOpen(false); // Close the dialog
|
|
}
|
|
},
|
|
[applyTheme, loadedSettings],
|
|
);
|
|
|
|
return {
|
|
isThemeDialogOpen,
|
|
openThemeDialog,
|
|
handleThemeSelect,
|
|
handleThemeHighlight,
|
|
};
|
|
};
|