diff --git a/client/src/components/Settings/UISettings/UISettings.tsx b/client/src/components/Settings/UISettings/UISettings.tsx index 075a427..1e75154 100644 --- a/client/src/components/Settings/UISettings/UISettings.tsx +++ b/client/src/components/Settings/UISettings/UISettings.tsx @@ -7,28 +7,22 @@ import { bindActionCreators } from 'redux'; import { actionCreators } from '../../../store'; // Typescript -import { OtherSettingsForm } from '../../../interfaces'; +import { UISettingsForm } from '../../../interfaces'; // UI import { InputGroup, Button, SettingsHeadline } from '../../UI'; // Utils -import { otherSettingsTemplate, inputHandler } from '../../../utility'; +import { uiSettingsTemplate, inputHandler } from '../../../utility'; export const UISettings = (): JSX.Element => { - const { - config: { loading, config }, - bookmarks: { categories }, - } = useSelector((state: State) => state); + const { loading, config } = useSelector((state: State) => state.config); const dispatch = useDispatch(); - const { updateConfig, sortApps, sortCategories, sortBookmarks } = - bindActionCreators(actionCreators, dispatch); + const { updateConfig } = bindActionCreators(actionCreators, dispatch); // Initial state - const [formData, setFormData] = useState( - otherSettingsTemplate - ); + const [formData, setFormData] = useState(uiSettingsTemplate); // Get config useEffect(() => { @@ -46,16 +40,6 @@ export const UISettings = (): JSX.Element => { // Update local page title document.title = formData.customTitle; - - // Sort entities with new settings - if (formData.useOrdering !== config.useOrdering) { - sortApps(); - sortCategories(); - - for (let { id } of categories) { - sortBookmarks(id); - } - } }; // Input handler @@ -63,7 +47,7 @@ export const UISettings = (): JSX.Element => { e: ChangeEvent, options?: { isNumber?: boolean; isBool?: boolean } ) => { - inputHandler({ + inputHandler({ e, options, setStateHandler: setFormData, @@ -88,6 +72,36 @@ export const UISettings = (): JSX.Element => { /> + {/* === SEARCH OPTIONS === */} + + {/* HIDE SEARCHBAR */} + + + + + + {/* AUTOFOCUS SEARCHBAR */} + + + + + {/* === HEADER OPTIONS === */} {/* HIDE HEADER */} @@ -160,8 +174,8 @@ export const UISettings = (): JSX.Element => { onChange={(e) => inputChangeHandler(e)} /> - Greetings must be separated with semicolon. Only 4 messages can be - used + Greetings must be separated with semicolon. All 4 messages must be + filled, even if they are the same @@ -193,85 +207,8 @@ export const UISettings = (): JSX.Element => { Names must be separated with semicolon - {/* === BEAHVIOR OPTIONS === */} - - {/* PIN APPS */} - - - - - - {/* PIN CATEGORIES */} - - - - - - {/* SORT TYPE */} - - - - - - {/* APPS OPPENING */} - - - - - - {/* BOOKMARKS OPPENING */} - - - - - - {/* === MODULES OPTIONS === */} - + {/* === SECTIONS OPTIONS === */} + {/* HIDE APPS */} diff --git a/client/src/interfaces/Forms.ts b/client/src/interfaces/Forms.ts index a3f999e..11e2739 100644 --- a/client/src/interfaces/Forms.ts +++ b/client/src/interfaces/Forms.ts @@ -9,28 +9,28 @@ export interface WeatherForm { } export interface GeneralForm { - hideSearch: boolean; defaultSearchProvider: string; searchSameTab: boolean; - disableAutofocus: boolean; -} - -export interface OtherSettingsForm { - customTitle: string; pinAppsByDefault: boolean; pinCategoriesByDefault: boolean; - hideHeader: boolean; - hideApps: boolean; - hideCategories: boolean; useOrdering: string; appsSameTab: boolean; bookmarksSameTab: boolean; +} + +export interface UISettingsForm { + customTitle: string; + hideHeader: boolean; + hideApps: boolean; + hideCategories: boolean; useAmericanDate: boolean; greetingsSchema: string; daySchema: string; monthSchema: string; showTime: boolean; hideDate: boolean; + hideSearch: boolean; + disableAutofocus: boolean; } export interface DockerSettingsForm { diff --git a/client/src/types/ConfigFormData.ts b/client/src/types/ConfigFormData.ts index f22d65a..5f1c3e5 100644 --- a/client/src/types/ConfigFormData.ts +++ b/client/src/types/ConfigFormData.ts @@ -1,6 +1,6 @@ import { DockerSettingsForm, - OtherSettingsForm, + UISettingsForm, GeneralForm, ThemeSettingsForm, WeatherForm, @@ -10,5 +10,5 @@ export type ConfigFormData = | WeatherForm | GeneralForm | DockerSettingsForm - | OtherSettingsForm + | UISettingsForm | ThemeSettingsForm; diff --git a/client/src/utility/templateObjects/settingsTemplate.ts b/client/src/utility/templateObjects/settingsTemplate.ts index 6ab937f..af3d137 100644 --- a/client/src/utility/templateObjects/settingsTemplate.ts +++ b/client/src/utility/templateObjects/settingsTemplate.ts @@ -1,21 +1,16 @@ import { DockerSettingsForm, - OtherSettingsForm, + UISettingsForm, GeneralForm, ThemeSettingsForm, WeatherForm, } from '../../interfaces'; -export const otherSettingsTemplate: OtherSettingsForm = { +export const uiSettingsTemplate: UISettingsForm = { customTitle: document.title, - pinAppsByDefault: true, - pinCategoriesByDefault: true, hideHeader: false, hideApps: false, hideCategories: false, - useOrdering: 'createdAt', - appsSameTab: false, - bookmarksSameTab: false, useAmericanDate: false, greetingsSchema: 'Good evening!;Good afternoon!;Good morning!;Good night!', daySchema: 'Sunday;Monday;Tuesday;Wednesday;Thursday;Friday;Saturday', @@ -23,6 +18,8 @@ export const otherSettingsTemplate: OtherSettingsForm = { 'January;February;March;April;May;June;July;August;September;October;November;December', showTime: false, hideDate: false, + hideSearch: false, + disableAutofocus: false, }; export const weatherSettingsTemplate: WeatherForm = { @@ -34,10 +31,13 @@ export const weatherSettingsTemplate: WeatherForm = { }; export const generalSettingsTemplate: GeneralForm = { - hideSearch: false, searchSameTab: false, defaultSearchProvider: 'l', - disableAutofocus: false, + pinAppsByDefault: true, + pinCategoriesByDefault: true, + useOrdering: 'createdAt', + appsSameTab: false, + bookmarksSameTab: false, }; export const dockerSettingsTemplate: DockerSettingsForm = {