Client: Implemented new config system

client/src/utility/index.ts

@@ -1,7 +1,8 @@
 export * from './iconParser';
 export * from './urlParser';
-export * from './searchConfig';
 export * from './checkVersion';
 export * from './sortData';
 export * from './searchParser';
 export * from './redirectUrl';
+export * from './templateObjects';
+export * from './inputHandler';

client/src/utility/inputHandler.ts

@@ -0,0 +1,39 @@
+import { ChangeEvent, SetStateAction } from 'react';
+
+type Event = ChangeEvent<HTMLInputElement | HTMLSelectElement>;
+
+interface Options {
+  isNumber?: boolean;
+  isBool?: boolean;
+}
+
+interface Params<T> {
+  e: Event;
+  options?: Options;
+  setStateHandler: (v: SetStateAction<T>) => void;
+  state: T;
+}
+
+export const inputHandler = <T>(params: Params<T>): void => {
+  const { e, options, setStateHandler, state } = params;
+
+  const rawValue = e.target.value;
+  let value: string | number | boolean = e.target.value;
+
+  if (options) {
+    const { isNumber = false, isBool = false } = options;
+
+    if (isNumber) {
+      value = parseFloat(rawValue);
+    }
+
+    if (isBool) {
+      value = !!parseInt(rawValue);
+    }
+  }
+
+  setStateHandler({
+    ...state,
+    [e.target.name]: value,
+  });
+};

client/src/utility/searchConfig.ts

@@ -1,24 +0,0 @@
-import { store } from '../store/store';
-
-/**
- * Search config store with given key
- * @param key Config pair key to search
- * @param _default Value to return if key is not found
- */
-export const searchConfig = (key: string, _default: any) => {
-  const state = store.getState();
-
-  const pair = state.config.config.find(p => p.key === key);
-
-  if (pair) {
-    if (pair.valueType === 'number') {
-      return parseFloat(pair.value);
-    } else if (pair.valueType === 'boolean') {
-      return parseInt(pair.value);
-    } else {
-      return pair.value;
-    }
-  }
-  
-  return _default;
-}

client/src/utility/searchParser.ts

@@ -1,7 +1,6 @@
 import { queries } from './searchQueries.json';
 import { Query, SearchResult } from '../interfaces';
 import { store } from '../store/store';
-import { searchConfig } from '.';
 
 export const searchParser = (searchQuery: string): SearchResult => {
   const result: SearchResult = {
@@ -16,7 +15,7 @@ export const searchParser = (searchQuery: string): SearchResult => {
     },
   };
 
-  const customQueries = store.getState().config.customQueries;
+  const { customQueries, config } = store.getState().config;
 
   // Check if url or ip was passed
   const urlRegex =
@@ -27,9 +26,7 @@ export const searchParser = (searchQuery: string): SearchResult => {
   // Match prefix and query
   const splitQuery = searchQuery.match(/^\/([a-z]+)[ ](.+)$/i);
 
-  const prefix = splitQuery
-    ? splitQuery[1]
-    : searchConfig('defaultSearchProvider', 'l');
+  const prefix = splitQuery ? splitQuery[1] : config.defaultSearchProvider;
 
   const search = splitQuery
     ? encodeURIComponent(splitQuery[2])
@@ -47,7 +44,7 @@ export const searchParser = (searchQuery: string): SearchResult => {
     if (prefix === 'l') {
       result.isLocal = true;
     } else {
-      result.sameTab = searchConfig('searchSameTab', false);
+      result.sameTab = config.searchSameTab;
     }
 
     return result;

client/src/utility/templateObjects/configTemplate.ts

@@ -0,0 +1,24 @@
+import { Config } from '../../interfaces';
+
+export const configTemplate: Config = {
+  WEATHER_API_KEY: '',
+  lat: 0,
+  long: 0,
+  isCelsius: true,
+  customTitle: 'Flame',
+  pinAppsByDefault: true,
+  pinCategoriesByDefault: true,
+  hideHeader: false,
+  useOrdering: 'createdAt',
+  appsSameTab: false,
+  bookmarksSameTab: false,
+  searchSameTab: false,
+  hideApps: false,
+  hideCategories: false,
+  hideSearch: false,
+  defaultSearchProvider: 'l',
+  dockerApps: false,
+  dockerHost: 'localhost',
+  kubernetesApps: false,
+  unpinStoppedApps: false,
+};

client/src/utility/templateObjects/index.ts

@@ -0,0 +1,2 @@
+export * from './configTemplate';
+export * from './settingsTemplate';

client/src/utility/templateObjects/settingsTemplate.ts

@@ -0,0 +1,30 @@
+import { OtherSettingsForm, SearchForm, WeatherForm } from '../../interfaces';
+
+export const otherSettingsTemplate: OtherSettingsForm = {
+  customTitle: document.title,
+  pinAppsByDefault: true,
+  pinCategoriesByDefault: true,
+  hideHeader: false,
+  hideApps: false,
+  hideCategories: false,
+  useOrdering: 'createdAt',
+  appsSameTab: false,
+  bookmarksSameTab: false,
+  dockerApps: true,
+  dockerHost: 'localhost',
+  kubernetesApps: true,
+  unpinStoppedApps: true,
+};
+
+export const weatherSettingsTemplate: WeatherForm = {
+  WEATHER_API_KEY: '',
+  lat: 0,
+  long: 0,
+  isCelsius: true,
+};
+
+export const searchSettingsTemplate: SearchForm = {
+  hideSearch: false,
+  searchSameTab: false,
+  defaultSearchProvider: 'l',
+};