Added components and logic to dynamically change theme

src/settings/reducers/settings.ts

@@ -2,6 +2,7 @@ import { Action } from 'redux';
 import { dissoc, mergeDeepRight } from 'ramda';
 import { buildReducer } from '../../utils/helpers/redux';
 import { RecursivePartial } from '../../utils/utils';
+import { Theme } from '../../utils/theme';
 
 export const SET_SETTINGS = 'shlink/realTimeUpdates/SET_SETTINGS';
 
@@ -19,9 +20,14 @@ export interface ShortUrlCreationSettings {
   validateUrls: boolean;
 }
 
+export interface UiSettings {
+  theme: Theme;
+}
+
 export interface Settings {
   realTimeUpdates: RealTimeUpdatesSettings;
   shortUrlCreation?: ShortUrlCreationSettings;
+  ui?: UiSettings;
 }
 
 const initialState: Settings = {
@@ -31,6 +37,9 @@ const initialState: Settings = {
   shortUrlCreation: {
     validateUrls: false,
   },
+  ui: {
+    theme: 'light',
+  },
 };
 
 type SettingsAction = Action & Settings;
@@ -55,3 +64,8 @@ export const setShortUrlCreationSettings = (settings: ShortUrlCreationSettings):
   type: SET_SETTINGS,
   shortUrlCreation: settings,
 });
+
+export const setUiSettings = (settings: UiSettings): PartialSettingsAction => ({
+  type: SET_SETTINGS,
+  ui: settings,
+});