fix: improve theme import modal flow and navigation

This commit is contained in:
Hachi-R 2025-02-17 22:29:42 -03:00
parent 75a44bed3f
commit 0724a40cb7

View file

@ -4,6 +4,7 @@ import { ThemeActions, ThemeCard, ThemePlaceholder } from "./index";
import type { Theme } from "@types";
import { ImportThemeModal } from "./modals/import-theme-modal";
import { settingsContext } from "@renderer/context";
import { useNavigate } from "react-router-dom";
interface SettingsAppearanceProps {
appearance: {
@ -24,8 +25,10 @@ export function SettingsAppearance({
authorId: string;
authorName: string;
} | null>(null);
const [hasShownModal, setHasShownModal] = useState(false);
const { clearTheme } = useContext(settingsContext);
const navigate = useNavigate();
const loadThemes = useCallback(async () => {
const themesList = await window.electron.getAllCustomThemes();
@ -45,20 +48,32 @@ export function SettingsAppearance({
}, [loadThemes]);
useEffect(() => {
if (appearance.theme && appearance.authorId && appearance.authorName) {
if (appearance.theme && appearance.authorId && appearance.authorName && !hasShownModal) {
setIsImportThemeModalVisible(true);
setImportTheme({
theme: appearance.theme,
authorId: appearance.authorId,
authorName: appearance.authorName,
});
setHasShownModal(true);
navigate("/settings", { replace: true });
clearTheme();
}
}, [appearance.theme, appearance.authorId, appearance.authorName]);
}, [
appearance.theme,
appearance.authorId,
appearance.authorName,
navigate,
hasShownModal,
clearTheme,
]);
const onThemeImported = useCallback(() => {
setIsImportThemeModalVisible(false);
setImportTheme(null);
loadThemes();
}, [clearTheme, loadThemes]);
}, [loadThemes]);
return (
<div className="settings-appearance">