Yousef3

contexts/auth.js

@@ -0,0 +1,55 @@
+import { createContext, useContext, useState } from 'react';
+// import jwt from 'jsonwebtoken';
+import axios from 'axios'
+const baseUrl = "http://127.0.0.1:8000/"
+// const baseUrl = process.env.NEXT_PUBLIC_API_URL;
+const tokenUrl = baseUrl + 'donater/auth/';
+
+const AuthContext = createContext();
+
+export function useAuth() {
+    const auth = useContext(AuthContext);
+    if (!auth) throw new Error('You forgot AuthProvider!');
+    return auth;
+}
+
+export function AuthProvider(props) {
+
+    const [state, setState] = useState({
+        tokens: null,
+        user: null,
+        login,
+        logout,
+    });
+
+    async function login(username, password) {
+
+        const response = await axios.post(tokenUrl, { username, password });
+
+        const decodedAccess = jwt.decode(response.data.access);
+
+        const newState = {
+            tokens: response.data,
+            // user: {
+            //     username: response.data.username,
+            //     id: decodedAccess.user_id
+            // },
+        }
+
+        setState(prevState => ({ ...prevState, ...newState }));
+    }
+
+    function logout() {
+        const newState = {
+            tokens: null,
+            user: null,
+        }
+        setState(prevState => ({ ...prevState, ...newState }));
+    }
+
+    return (
+        <AuthContext.Provider value={state}>
+            {props.children}
+        </AuthContext.Provider>
+    );
+}

hooks/useResource.js

@@ -0,0 +1,71 @@
+import axios from 'axios'
+import useSWR from 'swr'
+
+export const apiUrl = 'http://127.0.0.1:8000';
+import { useAuth } from '../contexts/auth'
+
+export default function useResource() {
+
+    const { tokens, logout } = useAuth()
+
+    const { data, error, mutate } = useSWR([apiUrl, tokens], fetchResource);
+
+    async function fetchResource(url) {
+
+        if (!tokens) {
+            return;
+        }
+
+        try {
+            const response = await axios.get(url+"/api/all", config());
+
+            return response.data;
+
+        } catch (error) {
+            handleError(error);
+        }
+    }
+
+    async function createResource(info) {
+
+        try {
+            await axios.post(apiUrl+"/api/all/", info, config());
+            mutate(); // mutate causes complete collection to be refetched
+        } catch (error) {
+            handleError(error);
+        }
+    }
+
+    async function deleteResource(id) {
+
+        try {
+            const url = apiUrl+"/api/" + id;
+            await axios.delete(url, config());
+            mutate(); // mutate causes complete collection to be refetched
+        } catch (error) {
+            handleError(error);
+        }
+    }
+
+    function config() {
+
+        return {
+            headers: {
+                'Authorization': 'Bearer ' + tokens.access
+            }
+        }
+    }
+
+    function handleError(error) {
+        console.error(error);
+        logout();
+    }
+
+    return {
+        resources: data,
+        error,
+        loading: tokens && !error && !data,
+        createResource,
+        deleteResource,
+    }
+}