add prettier for auto formatting (#231)

* [Prettier] Add "prettier"

Makes the formatting of the code consistent.
By using the eslint-plugin-prettier formatting issues will be highlighted as a lint error.
These errors will be auto fixed by running "lint --fix" (which can be done automatically on file save)

* [Prettier] Add "prettier" - Fix formatting

src/components/context/AppContext.tsx

@@ -6,15 +6,11 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import {
-    StyledEngineProvider, ThemeProvider,
-} from '@mui/material/styles';
+import { StyledEngineProvider, ThemeProvider } from '@mui/material/styles';
 import LibraryOptionsContextProvider from 'components/library/LibraryOptionsProvider';
 import NavBarContextProvider from 'components/navbar/NavBarContextProvider';
 import React, { useMemo } from 'react';
-import {
-    BrowserRouter as Router, Route,
-} from 'react-router-dom';
+import { BrowserRouter as Router, Route } from 'react-router-dom';
 import { SWRConfig } from 'swr';
 import createTheme from 'theme';
 import { QueryParamProvider } from 'use-query-params';
@@ -23,25 +19,22 @@ import useLocalStorage from 'util/useLocalStorage';
 import DarkTheme from 'components/context/DarkTheme';
 
 interface Props {
-    children: React.ReactNode
+    children: React.ReactNode;
 }
 
 const AppContext: React.FC<Props> = ({ children }) => {
-    const [darkTheme, setDarkTheme] = useLocalStorage<boolean>(
-        'darkTheme',
-        true,
-    );
+    const [darkTheme, setDarkTheme] = useLocalStorage<boolean>('darkTheme', true);
 
-    const darkThemeContext = useMemo(() => ({
-        darkTheme,
-        setDarkTheme,
-    }), [darkTheme]);
-
-    const theme = useMemo(
-        () => createTheme(darkTheme),
+    const darkThemeContext = useMemo(
+        () => ({
+            darkTheme,
+            setDarkTheme,
+        }),
         [darkTheme],
     );
 
+    const theme = useMemo(() => createTheme(darkTheme), [darkTheme]);
+
     return (
         <SWRConfig value={{ fetcher }}>
             <Router>
@@ -50,9 +43,7 @@ const AppContext: React.FC<Props> = ({ children }) => {
                         <DarkTheme.Provider value={darkThemeContext}>
                             <QueryParamProvider ReactRouterRoute={Route}>
                                 <LibraryOptionsContextProvider>
-                                    <NavBarContextProvider>
-                                        {children}
-                                    </NavBarContextProvider>
+                                    <NavBarContextProvider>{children}</NavBarContextProvider>
                                 </LibraryOptionsContextProvider>
                             </QueryParamProvider>
                         </DarkTheme.Provider>

src/components/context/DarkTheme.tsx

@@ -8,13 +8,13 @@
 import React from 'react';
 
 type ContextType = {
-    darkTheme: boolean
-    setDarkTheme: React.Dispatch<React.SetStateAction<boolean>>
+    darkTheme: boolean;
+    setDarkTheme: React.Dispatch<React.SetStateAction<boolean>>;
 };
 
 const DarkTheme = React.createContext<ContextType>({
     darkTheme: true,
-    setDarkTheme: ():void => {},
+    setDarkTheme: (): void => {},
 });
 
 export default DarkTheme;

src/components/context/NavbarContext.tsx

@@ -9,31 +9,31 @@ import React, { useContext, useEffect } from 'react';
 
 type ContextType = {
     // Default back button url
-    defaultBackTo: string | undefined
-    setDefaultBackTo: React.Dispatch<React.SetStateAction<string | undefined>>
+    defaultBackTo: string | undefined;
+    setDefaultBackTo: React.Dispatch<React.SetStateAction<string | undefined>>;
 
     // AppBar title
-    title: string
-    setTitle: (title: string) => void
+    title: string;
+    setTitle: (title: string) => void;
 
     // AppBar action buttons
-    action: any
-    setAction: React.Dispatch<React.SetStateAction<any>>
+    action: any;
+    setAction: React.Dispatch<React.SetStateAction<any>>;
 
     // Allow default navbar to be overrided
-    override: INavbarOverride
-    setOverride: React.Dispatch<React.SetStateAction<INavbarOverride>>
+    override: INavbarOverride;
+    setOverride: React.Dispatch<React.SetStateAction<INavbarOverride>>;
 };
 
 const NavBarContext = React.createContext<ContextType>({
     defaultBackTo: undefined,
-    setDefaultBackTo: ():void => {},
+    setDefaultBackTo: (): void => {},
     title: 'Tachidesk',
-    setTitle: ():void => {},
+    setTitle: (): void => {},
     action: <div />,
-    setAction: ():void => {},
+    setAction: (): void => {},
     override: { status: false, value: <div /> },
-    setOverride: ():void => {},
+    setOverride: (): void => {},
 });
 
 export default NavBarContext;