Set everything up to use hooks for reduc actions and state

src/settings/reducers/settings.ts

@@ -3,6 +3,9 @@ import { createSlice } from '@reduxjs/toolkit';
 import { mergeDeepRight } from '@shlinkio/data-manipulation';
 import { getSystemPreferredTheme } from '@shlinkio/shlink-frontend-kit';
 import type { Settings, ShortUrlsListSettings } from '@shlinkio/shlink-web-component/settings';
+import { useCallback } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import type { ShlinkState } from '../../container/types';
 import type { Defined } from '../../utils/types';
 
 type ShortUrlsOrder = Defined<ShortUrlsListSettings['defaultOrdering']>;
@@ -41,3 +44,11 @@ const { reducer, actions } = createSlice({
 export const { setSettings } = actions;
 
 export const settingsReducer = reducer;
+
+export const useSettings = () => {
+  const dispatch = useDispatch();
+  const setSettings = useCallback((settings: Settings) => dispatch(actions.setSettings(settings)), [dispatch]);
+  const settings = useSelector((state: ShlinkState) => state.settings);
+
+  return { settings, setSettings };
+};