diff --git a/src/Components/Api/Api.tsx b/src/Components/Api/Api.tsx
index 18cce4c..d93144c 100644
--- a/src/Components/Api/Api.tsx
+++ b/src/Components/Api/Api.tsx
@@ -9,10 +9,14 @@ import {
// Note APIs
+const instance = axios.create({
+ baseURL: "https://keannu126.pythonanywhere.com",
+});
+
export function GetNotes() {
const token = JSON.parse(localStorage.getItem("token") || "{}");
- return axios
- .get("http://localhost:8000/api/v1/notes/", {
+ return instance
+ .get("/api/v1/notes/", {
headers: {
Authorization: "Token " + token,
},
@@ -24,8 +28,8 @@ export function GetNotes() {
export function GetNote(id: number) {
const token = JSON.parse(localStorage.getItem("token") || "{}");
- return axios
- .get("http://localhost:8000/api/v1/notes/" + id + "/", {
+ return instance
+ .get("/api/v1/notes/" + id + "/", {
headers: {
Authorization: "Token " + token,
},
@@ -37,8 +41,8 @@ export function GetNote(id: number) {
export function UpdateNote(note: UpdateNoteParams) {
const token = JSON.parse(localStorage.getItem("token") || "{}");
- return axios
- .patch("http://localhost:8000/api/v1/notes/" + note.id + "/", note, {
+ return instance
+ .patch("/api/v1/notes/" + note.id + "/", note, {
headers: {
Authorization: "Token " + token,
},
@@ -47,15 +51,14 @@ export function UpdateNote(note: UpdateNoteParams) {
return response.data;
})
.catch((error) => {
- console.log("Error updating note", error);
return error;
});
}
export function AddNote(note: AddNoteParams) {
const token = JSON.parse(localStorage.getItem("token") || "{}");
- return axios
- .post("http://localhost:8000/api/v1/notes/", note, {
+ return instance
+ .post("/api/v1/notes/", note, {
headers: {
Authorization: "Token " + token,
},
@@ -64,21 +67,19 @@ export function AddNote(note: AddNoteParams) {
return response.data;
})
.catch((error) => {
- console.log("Error adding note", error);
return error;
});
}
export function DeleteNote(id: number) {
const token = JSON.parse(localStorage.getItem("token") || "{}");
- return axios
- .delete("http://localhost:8000/api/v1/notes/" + id + "/", {
+ return instance
+ .delete("/api/v1/notes/" + id + "/", {
headers: {
Authorization: "Token " + token,
},
})
.catch((error) => {
- console.log("Error deleting note", error);
return error;
});
}
@@ -86,58 +87,48 @@ export function DeleteNote(id: number) {
// User APIs
export function UserRegister(register: RegistrationParams) {
- return axios
- .post("http://localhost:8000/api/v1/accounts/users/", register)
+ return instance
+ .post("/api/v1/accounts/users/", register)
.then(async (response) => {
- console.log(response.data);
return true;
})
.catch((error) => {
- console.log("Registration failed: " + error);
return false;
});
}
export function UserLogin(user: LoginParams) {
- return axios
- .post("http://localhost:8000/api/v1/accounts/token/login/", user)
+ return instance
+ .post("/api/v1/accounts/token/login/", user)
.then(async (response) => {
localStorage.setItem("token", JSON.stringify(response.data.auth_token));
- console.log(
- "Login Success! Stored Token: ",
- JSON.parse(localStorage.getItem("token") || "{}")
- );
return true;
})
.catch((error) => {
- console.log("Login Failed: " + error);
return false;
});
}
export function UserInfo() {
const token = JSON.parse(localStorage.getItem("token") || "{}");
- return axios
- .get("http://localhost:8000/api/v1/accounts/users/me/", {
+ return instance
+ .get("/api/v1/accounts/users/me/", {
headers: {
Authorization: "Token " + token,
},
})
.then((response) => {
- console.log(response.data);
return response.data;
});
}
export function UserActivate(activation: ActivationParams) {
- return axios
- .post("http://localhost:8000/api/v1/accounts/users/activation/", activation)
+ return instance
+ .post("/api/v1/accounts/users/activation/", activation)
.then(async (response) => {
- console.log("Activation Success");
return true;
})
.catch((error) => {
- console.log("Activation failed: " + error);
return false;
});
}
diff --git a/src/Components/Header/Header.tsx b/src/Components/Header/Header.tsx
index 3acb0b8..c33aaf3 100644
--- a/src/Components/Header/Header.tsx
+++ b/src/Components/Header/Header.tsx
@@ -5,10 +5,11 @@ import AppIcon from "../AppIcon/AppIcon";
import Login from "../LoginButton/LoginButton";
import HomeIcon from "../HomeIcon/HomeIcon";
import UserIcon from "../UserIcon/UserIcon";
-
+import PreviousSessionChecker from "../PreviousSessionChecker/PreviousSessionChecker";
export default function Header() {
return (
+
state.logged_in.value
- );
+ const logged_in = useSelector((state: RootState) => state.logged_in.value);
const logged_in_user = useSelector(
(state: RootState) => state.logged_in_user.value
- );
+ );
const navigate = useNavigate();
if (!logged_in) {
return (
@@ -42,7 +40,7 @@ export default function LoginButton() {
variant="contained"
onClick={() => {
console.log("Logged out...");
- dispatch(SetLoggedOut());
+ dispatch(Toggle_Login());
dispatch(UnsetUser());
localStorage.setItem("token", "");
}}
diff --git a/src/Components/PreviousSessionChecker/PreviousSessionChecker.tsx b/src/Components/PreviousSessionChecker/PreviousSessionChecker.tsx
new file mode 100644
index 0000000..fa6d0fc
--- /dev/null
+++ b/src/Components/PreviousSessionChecker/PreviousSessionChecker.tsx
@@ -0,0 +1,32 @@
+import * as React from "react";
+import { useEffect, useCallback } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import { UserInfo } from "../Api/Api";
+import { Toggle_Login } from "../../Features/Redux/Slices/LoginSlice/LoginSlice";
+import { SetUser } from "../../Features/Redux/Slices/LoggedInUserSlice/LoggedInUserSlice";
+import { set_checked } from "../../Features/Redux/Slices/OldSession/OldSessionSlice";
+import { RootState } from "../../Features/Redux/Store/Store";
+export default function PreviousSessionChecker() {
+ const dispatch = useDispatch();
+ const logged_in = useSelector((state: RootState) => state.logged_in.value);
+ // Function to check for previous login session
+ const check = useCallback(async () => {
+ if (await UserInfo()) {
+ if (logged_in !== true) {
+ console.log("Previous session found. Restoring");
+ await dispatch(Toggle_Login());
+ await dispatch(SetUser(await UserInfo()));
+ }
+ } else {
+ console.log("No old session found");
+ localStorage.removeItem("token");
+ }
+ await dispatch(set_checked());
+ }, [dispatch, logged_in]);
+ useEffect(() => {
+ if (!logged_in) {
+ check();
+ }
+ }, [check, logged_in]);
+ return
;
+}
diff --git a/src/Features/Redux/Slices/LoginSlice/LoginSlice.tsx b/src/Features/Redux/Slices/LoginSlice/LoginSlice.tsx
index 5802c33..a1d52d1 100644
--- a/src/Features/Redux/Slices/LoginSlice/LoginSlice.tsx
+++ b/src/Features/Redux/Slices/LoginSlice/LoginSlice.tsx
@@ -6,16 +6,13 @@ export const LoginSlice = createSlice({
value: false,
},
reducers: {
- SetLoggedIn: (state) => {
- state.value = !state.value;
- },
- SetLoggedOut: (state) => {
+ Toggle_Login: (state) => {
state.value = !state.value;
},
},
});
// Action creators are generated for each case reducer function
-export const { SetLoggedIn, SetLoggedOut } = LoginSlice.actions;
+export const { Toggle_Login } = LoginSlice.actions;
export default LoginSlice.reducer;
diff --git a/src/Features/Redux/Slices/OldSession/OldSessionSlice.tsx b/src/Features/Redux/Slices/OldSession/OldSessionSlice.tsx
new file mode 100644
index 0000000..04e37e3
--- /dev/null
+++ b/src/Features/Redux/Slices/OldSession/OldSessionSlice.tsx
@@ -0,0 +1,17 @@
+import { createSlice } from "@reduxjs/toolkit";
+
+export const OldSessionSlice = createSlice({
+ name: "old_session_checked",
+ initialState: {
+ value: false,
+ },
+ reducers: {
+ set_checked: (state) => {
+ state.value = !state.value;
+ },
+ },
+});
+
+export const { set_checked } = OldSessionSlice.actions;
+
+export default OldSessionSlice.reducer;
diff --git a/src/Features/Redux/Store/LoginSlice.tsx b/src/Features/Redux/Store/LoginSlice.tsx
new file mode 100644
index 0000000..5802c33
--- /dev/null
+++ b/src/Features/Redux/Store/LoginSlice.tsx
@@ -0,0 +1,21 @@
+import { createSlice } from "@reduxjs/toolkit";
+
+export const LoginSlice = createSlice({
+ name: "Login",
+ initialState: {
+ value: false,
+ },
+ reducers: {
+ SetLoggedIn: (state) => {
+ state.value = !state.value;
+ },
+ SetLoggedOut: (state) => {
+ state.value = !state.value;
+ },
+ },
+});
+
+// Action creators are generated for each case reducer function
+export const { SetLoggedIn, SetLoggedOut } = LoginSlice.actions;
+
+export default LoginSlice.reducer;
diff --git a/src/Features/Redux/Store/Store.tsx b/src/Features/Redux/Store/Store.tsx
index d1eabd2..e9f2f2c 100644
--- a/src/Features/Redux/Store/Store.tsx
+++ b/src/Features/Redux/Store/Store.tsx
@@ -1,11 +1,13 @@
import { configureStore } from "@reduxjs/toolkit";
import LoginReducer from "../Slices/LoginSlice/LoginSlice";
import LoggedInUserReucer from "../Slices/LoggedInUserSlice/LoggedInUserSlice";
+import OldSessionReducer from "../Slices/OldSession/OldSessionSlice";
const store = configureStore({
reducer: {
logged_in: LoginReducer,
logged_in_user: LoggedInUserReucer,
+ old_session_checked: OldSessionReducer,
},
});
@@ -13,4 +15,4 @@ export default store;
// Infer the `RootState` and `AppDispatch` types from the store itself
export type RootState = ReturnType
;
-export type AppDispatch = typeof store.dispatch;
\ No newline at end of file
+export type AppDispatch = typeof store.dispatch;
diff --git a/src/Routes/Login/Login.tsx b/src/Routes/Login/Login.tsx
index 371e094..267fe16 100644
--- a/src/Routes/Login/Login.tsx
+++ b/src/Routes/Login/Login.tsx
@@ -9,7 +9,7 @@ import { UserInfo, UserLogin } from "../../Components/Api/Api";
import { useDispatch } from "react-redux";
import { SetUser } from "../../Features/Redux/Slices/LoggedInUserSlice/LoggedInUserSlice";
-import { SetLoggedIn } from "../../Features/Redux/Slices/LoginSlice/LoginSlice";
+import { Toggle_Login } from "../../Features/Redux/Slices/LoginSlice/LoginSlice";
export default function Login() {
const navigate = useNavigate();
@@ -56,7 +56,7 @@ export default function Login() {
password: "",
});
if (await UserLogin(user)) {
- await dispatch(SetLoggedIn());
+ await dispatch(Toggle_Login());
await dispatch(SetUser(await UserInfo()));
navigate("/");
} else {
diff --git a/src/Routes/ViewEditNote/ViewEditNote.tsx b/src/Routes/ViewEditNote/ViewEditNote.tsx
index 9a82605..e8a0a9e 100644
--- a/src/Routes/ViewEditNote/ViewEditNote.tsx
+++ b/src/Routes/ViewEditNote/ViewEditNote.tsx
@@ -3,9 +3,8 @@ import { Button } from "@mui/material";
import { useNavigate, useParams } from "react-router-dom";
import { useEffect, useState } from "react";
import Header from "../../Components/Header/Header";
-import { AddNote, GetNote, UpdateNote } from "../../Components/Api/Api";
+import { GetNote, UpdateNote } from "../../Components/Api/Api";
import { useMutation, useQuery, useQueryClient } from "react-query";
-import { NoteProps } from "../../Interfaces/Interfaces";
export interface input {
e: React.ChangeEvent;
@@ -34,7 +33,7 @@ export default function ViewNote() {
});
useEffect(() => {
setNote(data);
- }, []);
+ }, [data]);
if (error) {
return (
@@ -47,8 +46,10 @@ export default function ViewNote() {
}
if (isLoading) {
return (
-
-
Loading Note...
+
);
}
@@ -112,4 +113,4 @@ export default function ViewNote() {
);
}
return
heh
;
-}
\ No newline at end of file
+}