Mathis/lemma
1
0
Fork 0
mirror of https://github.com/lordmathis/lemma.git synced 2025-11-06 07:54:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use context in settings

Browse Source
This commit is contained in:
Matúš Námešný
2024-10-04 22:09:15 +02:00
parent 622c310782
commit 654d35ad40
3 changed files with 15 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/components/Header.js
View File

@@ -1,15 +1,13 @@
import React, { useState } from 'react'; import React from 'react';
import { Page, Text, User, Button, Spacer } from '@geist-ui/core'; import { Page, Text, User, Button, Spacer } from '@geist-ui/core';
import { Settings as SettingsIcon } from '@geist-ui/icons'; import { Settings as SettingsIcon } from '@geist-ui/icons';
import Settings from './Settings'; import Settings from './Settings';
import { useSettings } from '../contexts/SettingsContext'; import { useUIStateContext } from '../contexts/UIStateContext';
const Header = () => { const Header = () => {
const [settingsVisible, setSettingsVisible] = useState(false); const { setSettingsModalVisible } = useUIStateContext();
const { settings } = useSettings();
const openSettings = () => setSettingsVisible(true); const openSettings = () => setSettingsModalVisible(true);
const closeSettings = () => setSettingsVisible(false);
return ( return (
<Page.Header className="custom-navbar"> <Page.Header className="custom-navbar">
@@ -18,7 +16,7 @@ const Header = () => {
<User src="https://via.placeholder.com/40" name="User" /> <User src="https://via.placeholder.com/40" name="User" />
<Spacer w={0.5} /> <Spacer w={0.5} />
<Button auto icon={<SettingsIcon />} onClick={openSettings} /> <Button auto icon={<SettingsIcon />} onClick={openSettings} />
<Settings visible={settingsVisible} onClose={closeSettings} /> <Settings />
</Page.Header> </Page.Header>
); );
}; };

17
frontend/src/components/Settings.js
View File

@@ -1,6 +1,7 @@
import React, { useReducer, useEffect, useCallback, useRef } from 'react'; import React, { useReducer, useEffect, useCallback, useRef } from 'react';
import { Modal, Spacer, useTheme, Dot, useToasts } from '@geist-ui/core'; import { Modal, Spacer, useTheme, Dot, useToasts } from '@geist-ui/core';
import { useSettings } from '../contexts/SettingsContext'; import { useSettings } from '../contexts/SettingsContext';
import { useUIStateContext } from '../contexts/UIStateContext';
import AppearanceSettings from './settings/AppearanceSettings'; import AppearanceSettings from './settings/AppearanceSettings';
import EditorSettings from './settings/EditorSettings'; import EditorSettings from './settings/EditorSettings';
import GitSettings from './settings/GitSettings'; import GitSettings from './settings/GitSettings';
@@ -12,7 +13,6 @@ const initialState = {
}; };
function settingsReducer(state, action) { function settingsReducer(state, action) {
console.log('Reducer action:', action.type, action.payload); // Debug log
switch (action.type) { switch (action.type) {
case 'INIT_SETTINGS': case 'INIT_SETTINGS':
return { return {
@@ -48,8 +48,9 @@ function settingsReducer(state, action) {
} }
} }
const Settings = ({ visible, onClose }) => { const Settings = () => {
const { settings, updateSettings, updateTheme } = useSettings(); const { settings, updateSettings, updateTheme } = useSettings();
const { settingsModalVisible, setSettingsModalVisible } = useUIStateContext();
const { setToast } = useToasts(); const { setToast } = useToasts();
const [state, dispatch] = useReducer(settingsReducer, initialState); const [state, dispatch] = useReducer(settingsReducer, initialState);
const isInitialMount = useRef(true); const isInitialMount = useRef(true);
@@ -84,7 +85,7 @@ const Settings = ({ visible, onClose }) => {
await updateSettings(state.localSettings); await updateSettings(state.localSettings);
dispatch({ type: 'MARK_SAVED' }); dispatch({ type: 'MARK_SAVED' });
setToast({ text: 'Settings saved successfully', type: 'success' }); setToast({ text: 'Settings saved successfully', type: 'success' });
onClose(); setSettingsModalVisible(false);
} catch (error) { } catch (error) {
console.error('Failed to save settings:', error); console.error('Failed to save settings:', error);
setToast({ setToast({
@@ -98,15 +99,13 @@ const Settings = ({ visible, onClose }) => {
if (state.hasUnsavedChanges) { if (state.hasUnsavedChanges) {
updateTheme(state.initialSettings.theme); // Revert theme if not saved updateTheme(state.initialSettings.theme); // Revert theme if not saved
dispatch({ type: 'RESET' }); dispatch({ type: 'RESET' });
onClose();
} else {
onClose();
} }
setSettingsModalVisible(false);
}, [ }, [
state.hasUnsavedChanges, state.hasUnsavedChanges,
state.initialSettings.theme, state.initialSettings.theme,
updateTheme, updateTheme,
onClose, setSettingsModalVisible,
]); ]);
useEffect(() => { useEffect(() => {
@@ -117,10 +116,8 @@ const Settings = ({ visible, onClose }) => {
}; };
}, []); }, []);
console.log('State:', state); // Debugging log
return ( return (
<Modal visible={visible} onClose={handleClose}> <Modal visible={settingsModalVisible} onClose={handleClose}>
<Modal.Title> <Modal.Title>
Settings Settings
{state.hasUnsavedChanges && ( {state.hasUnsavedChanges && (

3
frontend/src/contexts/UIStateContext.js
View File

@@ -8,6 +8,7 @@ export const UIStateProvider = ({ children }) => {
const [deleteFileModalVisible, setDeleteFileModalVisible] = useState(false); const [deleteFileModalVisible, setDeleteFileModalVisible] = useState(false);
const [commitMessageModalVisible, setCommitMessageModalVisible] = const [commitMessageModalVisible, setCommitMessageModalVisible] =
useState(false); useState(false);
const [settingsModalVisible, setSettingsModalVisible] = useState(false);
const value = { const value = {
activeTab, activeTab,
@@ -18,6 +19,8 @@ export const UIStateProvider = ({ children }) => {
setDeleteFileModalVisible, setDeleteFileModalVisible,
commitMessageModalVisible, commitMessageModalVisible,
setCommitMessageModalVisible, setCommitMessageModalVisible,
settingsModalVisible,
setSettingsModalVisible,
}; };
return ( return (