Merge pull request #3 from LinumLabs/feature/rr/FAIR-84

[FAIR-84] add simple context for user handling and hooks

.vscode/settings.json

@@ -1,3 +1,7 @@
 {
-  "editor.formatOnSave": true
-}
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": true
+  },
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode"
+}

contexts/User.tsx

@@ -0,0 +1,12 @@
+import { createContext, Dispatch, SetStateAction } from 'react';
+
+export type UserContextProps = {
+  user: any;
+  setUser?: Dispatch<SetStateAction<any>>;
+};
+
+export const UserContext = createContext<UserContextProps>({
+  user: null,
+});
+
+export default UserContext.Provider;

hooks/useUser.tsx

@@ -0,0 +1,6 @@
+import { UserContext } from 'contexts/User';
+import { useContext } from 'react';
+
+const useUser = () => useContext(UserContext);
+
+export default useUser;

pages/_app.tsx

@@ -3,9 +3,11 @@ import { useState } from 'react';
 import { AppProps } from 'next/app';
 import Head from 'next/head';
 import AppProvider from 'contexts/App';
+import UserProvider from 'contexts/User';
 
 const MyApp = ({ Component, pageProps }: AppProps) => {
   const [theme, setTheme] = useState('dark');
+  const [user, setUser] = useState(null);
 
   return (
     <>
@@ -14,7 +16,9 @@ const MyApp = ({ Component, pageProps }: AppProps) => {
         <meta name="viewport" content="width=device-width, initial-scale=1" />
       </Head>
       <AppProvider value={{ theme, setTheme }}>
-        <Component {...pageProps} />
+        <UserProvider value={{ user, setUser }}>
+          <Component {...pageProps} />
+        </UserProvider>
       </AppProvider>
     </>
   );

pages/index.tsx

@@ -1,10 +1,14 @@
 import type { NextPage } from 'next';
 import Layout from 'components/Layout';
+import useUser from 'hooks/useUser';
 
 const Home: NextPage = () => {
+  const { user } = useUser();
+
   return (
     <Layout>
       <h1 className="text-center">Fairdrive</h1>
+      {!user && <h3 className="text-center">user loggeout</h3>}
     </Layout>
   );
 };