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>