mirror of
https://github.com/bluewave-labs/Checkmate.git
synced 2026-05-02 22:49:19 -05:00
Merge pull request #300 from bluewave-labs/feat/token-revoke
Added configured axios instance with 401 interceptor, resolves #299
This commit is contained in:
@@ -1,7 +1,6 @@
|
||||
import axios from "axios";
|
||||
import axiosInstance from "../../Utils/axiosConfig";
|
||||
import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
|
||||
import { jwtDecode } from "jwt-decode";
|
||||
const BASE_URL = import.meta.env.VITE_APP_API_BASE_URL;
|
||||
|
||||
const initialState = {
|
||||
isLoading: false,
|
||||
@@ -15,7 +14,7 @@ export const register = createAsyncThunk(
|
||||
"auth/register",
|
||||
async (form, thunkApi) => {
|
||||
try {
|
||||
const res = await axios.post(`${BASE_URL}/auth/register`, form);
|
||||
const res = await axiosInstance.post("/auth/register", form);
|
||||
return res.data;
|
||||
} catch (error) {
|
||||
if (error.response.data) {
|
||||
@@ -28,7 +27,7 @@ export const register = createAsyncThunk(
|
||||
|
||||
export const login = createAsyncThunk("auth/login", async (form, thunkApi) => {
|
||||
try {
|
||||
const res = await axios.post(`${BASE_URL}/auth/login`, form);
|
||||
const res = await axiosInstance.post(`/auth/login`, form);
|
||||
return res.data;
|
||||
} catch (error) {
|
||||
if (error.response && error.response.data) {
|
||||
@@ -48,12 +47,14 @@ export const update = createAsyncThunk(
|
||||
await new Promise((resolve) => setTimeout(resolve, 1500));
|
||||
|
||||
const fd = new FormData();
|
||||
const imageResult = await axios.get(form.file, { responseType: "blob" });
|
||||
const imageResult = await axiosInstance.get(form.file, {
|
||||
responseType: "blob",
|
||||
});
|
||||
fd.append("firstname", form.firstname);
|
||||
fd.append("lastname", form.lastname);
|
||||
fd.append("profileImage", imageResult.data);
|
||||
|
||||
const res = await axios.post(`${BASE_URL}/auth/user/${user._id}`, fd, {
|
||||
const res = await axiosInstance.post(`/auth/user/${user._id}`, fd, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
"Content-Type": "multipart/form-data",
|
||||
|
||||
@@ -1,8 +1,6 @@
|
||||
import axios from "axios";
|
||||
import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
|
||||
import { jwtDecode } from "jwt-decode";
|
||||
const BASE_URL = import.meta.env.VITE_APP_API_BASE_URL;
|
||||
|
||||
import axiosInstance from "../../Utils/axiosConfig";
|
||||
const initialState = {
|
||||
isLoading: false,
|
||||
monitors: [],
|
||||
@@ -16,7 +14,7 @@ export const createMonitor = createAsyncThunk(
|
||||
try {
|
||||
const { authToken, monitor } = data;
|
||||
|
||||
const res = await axios.post(`${BASE_URL}/monitors`, monitor, {
|
||||
const res = await axiosInstance.post(`/monitors`, monitor, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${authToken}`,
|
||||
"Content-Type": "application/json",
|
||||
@@ -36,9 +34,7 @@ export const getMonitors = createAsyncThunk(
|
||||
"monitors/getMonitors",
|
||||
async (token, thunkApi) => {
|
||||
try {
|
||||
const res = await axios.get(
|
||||
import.meta.env.VITE_APP_API_BASE_URL + "/monitors"
|
||||
);
|
||||
const res = await axiosInstance.get("/monitors");
|
||||
return res.data;
|
||||
} catch (error) {
|
||||
if (error.response && error.response.data) {
|
||||
@@ -54,14 +50,11 @@ export const getMonitorsByUserId = createAsyncThunk(
|
||||
async (token, thunkApi) => {
|
||||
const user = jwtDecode(token);
|
||||
try {
|
||||
const res = await axios.get(
|
||||
import.meta.env.VITE_APP_API_BASE_URL + "/monitors/user/" + user._id,
|
||||
{
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
}
|
||||
);
|
||||
const res = await axiosInstance.get("/monitors/user/" + user._id, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
return res.data;
|
||||
} catch (error) {
|
||||
if (error.response && error.response.data) {
|
||||
|
||||
@@ -7,11 +7,9 @@ import Button from "../../Components/Button";
|
||||
import LeftArrow from "../../assets/Images/arrow-left.png";
|
||||
import { useState, useEffect } from "react";
|
||||
import { recoveryValidation } from "../../Validation/validation";
|
||||
import axios from "axios";
|
||||
import axiosInstance from "../../Utils/axiosConfig";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
|
||||
const BASE_URL = import.meta.env.VITE_APP_API_BASE_URL;
|
||||
|
||||
const ForgotPassword = () => {
|
||||
const navigate = useNavigate();
|
||||
|
||||
@@ -50,7 +48,7 @@ const ForgotPassword = () => {
|
||||
if (error !== undefined) {
|
||||
throw error;
|
||||
}
|
||||
await axios.post(`${BASE_URL}/auth/recovery/request`, form);
|
||||
await axiosInstance.post(`/auth/recovery/request`, form);
|
||||
navigate("/check-email");
|
||||
} catch (error) {
|
||||
//TODO display error (Toast?)
|
||||
|
||||
@@ -9,12 +9,10 @@ import CheckBox from "../../Components/Checkbox/Checkbox";
|
||||
import Button from "../../Components/Button";
|
||||
import Google from "../../assets/Images/Google.png";
|
||||
import PasswordTextField from "../../Components/TextFields/Password/PasswordTextField";
|
||||
|
||||
import axiosInstance from "../../Utils/axiosConfig";
|
||||
import { loginValidation } from "../../Validation/validation";
|
||||
import { login } from "../../Features/Auth/authSlice";
|
||||
import { useDispatch } from "react-redux";
|
||||
import axios from "axios";
|
||||
const BASE_URL = import.meta.env.VITE_APP_API_BASE_URL;
|
||||
|
||||
const Login = () => {
|
||||
const dispatch = useDispatch();
|
||||
@@ -33,8 +31,8 @@ const Login = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
axios
|
||||
.get(BASE_URL + "/auth/users/admin")
|
||||
axiosInstance
|
||||
.get("/auth/users/admin")
|
||||
.then((response) => {
|
||||
if (response.data.data === false) {
|
||||
navigate("/register");
|
||||
|
||||
@@ -11,12 +11,9 @@ import Check from "../../Components/Check/Check";
|
||||
import Button from "../../Components/Button";
|
||||
import Google from "../../assets/Images/Google.png";
|
||||
import { registerValidation } from "../../Validation/validation";
|
||||
|
||||
import axiosInstance from "../../Utils/axiosConfig";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { register } from "../../Features/Auth/authSlice";
|
||||
import axios from "axios";
|
||||
|
||||
const BASE_URL = import.meta.env.VITE_APP_API_BASE_URL;
|
||||
|
||||
const Register = () => {
|
||||
const dispatch = useDispatch();
|
||||
@@ -41,8 +38,8 @@ const Register = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
axios
|
||||
.get(BASE_URL + "/auth/users/admin")
|
||||
axiosInstance
|
||||
.get("/auth/users/admin")
|
||||
.then((response) => {
|
||||
if (response.data.data === true) {
|
||||
navigate("/login");
|
||||
|
||||
@@ -8,8 +8,7 @@ import LeftArrow from "../../assets/Images/arrow-left.png";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { useState, useEffect } from "react";
|
||||
import { newPasswordValidation } from "../../Validation/validation";
|
||||
import axios from "axios";
|
||||
const BASE_URL = import.meta.env.VITE_APP_API_BASE_URL;
|
||||
import axiosInstance from "../../Utils/axiosConfig";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
|
||||
const SetNewPassword = () => {
|
||||
@@ -33,10 +32,10 @@ const SetNewPassword = () => {
|
||||
// TODO show loading spinner
|
||||
setIsLoading(true);
|
||||
try {
|
||||
await axios.post(`${BASE_URL}/auth/recovery/validate`, {
|
||||
await axiosInstance.post("/auth/recovery/validate", {
|
||||
recoveryToken: token,
|
||||
});
|
||||
await axios.post(`${BASE_URL}/auth/recovery/reset`, {
|
||||
await axiosInstance.post("/auth/recovery/reset", {
|
||||
...form,
|
||||
recoveryToken: token,
|
||||
});
|
||||
|
||||
@@ -0,0 +1,27 @@
|
||||
import axios from "axios";
|
||||
import { clearAuthState } from "../Features/Auth/authSlice";
|
||||
const BASE_URL = import.meta.env.VITE_APP_API_BASE_URL;
|
||||
|
||||
let store;
|
||||
|
||||
export const injectStore = (s) => {
|
||||
store = s;
|
||||
};
|
||||
|
||||
const axiosInstance = axios.create({
|
||||
baseURL: BASE_URL,
|
||||
});
|
||||
|
||||
axiosInstance.interceptors.response.use(
|
||||
(response) => response,
|
||||
(error) => {
|
||||
console.error(error);
|
||||
if (error.response && error.response.status === 401) {
|
||||
console.log("Invalid token revoked");
|
||||
store.dispatch(clearAuthState());
|
||||
}
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
|
||||
export default axiosInstance;
|
||||
@@ -8,6 +8,9 @@ import { ThemeProvider } from "@mui/material";
|
||||
import { Provider } from "react-redux";
|
||||
import { persistor, store } from "./store";
|
||||
import { PersistGate } from "redux-persist/integration/react";
|
||||
import { injectStore } from "./Utils/axiosConfig.js";
|
||||
|
||||
injectStore(store);
|
||||
|
||||
ReactDOM.createRoot(document.getElementById("root")).render(
|
||||
<React.StrictMode>
|
||||
|
||||
Reference in New Issue
Block a user