mirror of
https://github.com/Mintplex-Labs/anything-llm.git
synced 2024-10-03 17:30:11 +02:00
Fix login modal popping up on protected routes
This commit is contained in:
parent
82e8350ad1
commit
f9eec86672
@ -17,6 +17,7 @@ export default function PasswordModal({ mode = "single" }) {
|
|||||||
|
|
||||||
export function usePasswordModal() {
|
export function usePasswordModal() {
|
||||||
const [auth, setAuth] = useState({
|
const [auth, setAuth] = useState({
|
||||||
|
loading: true,
|
||||||
required: false,
|
required: false,
|
||||||
mode: "single",
|
mode: "single",
|
||||||
});
|
});
|
||||||
@ -24,14 +25,26 @@ export function usePasswordModal() {
|
|||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
async function checkAuthReq() {
|
async function checkAuthReq() {
|
||||||
if (!window) return;
|
if (!window) return;
|
||||||
const settings = await System.keys();
|
|
||||||
|
|
||||||
|
// If the last validity check is still valid
|
||||||
|
// we can skip the loading.
|
||||||
|
if (!System.needsAuthCheck()) {
|
||||||
|
setAuth({
|
||||||
|
loading: false,
|
||||||
|
requiresAuth: false,
|
||||||
|
mode: "multi",
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const settings = await System.keys();
|
||||||
if (settings?.MultiUserMode) {
|
if (settings?.MultiUserMode) {
|
||||||
const currentToken = window.localStorage.getItem(AUTH_TOKEN);
|
const currentToken = window.localStorage.getItem(AUTH_TOKEN);
|
||||||
if (!!currentToken) {
|
if (!!currentToken) {
|
||||||
const valid = await System.checkAuth(currentToken);
|
const valid = await System.checkAuth(currentToken);
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
setAuth({
|
setAuth({
|
||||||
|
loading: false,
|
||||||
requiresAuth: true,
|
requiresAuth: true,
|
||||||
mode: "multi",
|
mode: "multi",
|
||||||
});
|
});
|
||||||
@ -40,6 +53,7 @@ export function usePasswordModal() {
|
|||||||
return;
|
return;
|
||||||
} else {
|
} else {
|
||||||
setAuth({
|
setAuth({
|
||||||
|
loading: false,
|
||||||
requiresAuth: false,
|
requiresAuth: false,
|
||||||
mode: "multi",
|
mode: "multi",
|
||||||
});
|
});
|
||||||
@ -47,6 +61,7 @@ export function usePasswordModal() {
|
|||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
setAuth({
|
setAuth({
|
||||||
|
loading: false,
|
||||||
requiresAuth: true,
|
requiresAuth: true,
|
||||||
mode: "multi",
|
mode: "multi",
|
||||||
});
|
});
|
||||||
@ -58,6 +73,7 @@ export function usePasswordModal() {
|
|||||||
const requiresAuth = settings?.RequiresAuth || false;
|
const requiresAuth = settings?.RequiresAuth || false;
|
||||||
if (!requiresAuth) {
|
if (!requiresAuth) {
|
||||||
setAuth({
|
setAuth({
|
||||||
|
loading: false,
|
||||||
requiresAuth: false,
|
requiresAuth: false,
|
||||||
mode: "single",
|
mode: "single",
|
||||||
});
|
});
|
||||||
@ -69,6 +85,7 @@ export function usePasswordModal() {
|
|||||||
const valid = await System.checkAuth(currentToken);
|
const valid = await System.checkAuth(currentToken);
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
setAuth({
|
setAuth({
|
||||||
|
loading: false,
|
||||||
requiresAuth: true,
|
requiresAuth: true,
|
||||||
mode: "single",
|
mode: "single",
|
||||||
});
|
});
|
||||||
@ -76,6 +93,7 @@ export function usePasswordModal() {
|
|||||||
return;
|
return;
|
||||||
} else {
|
} else {
|
||||||
setAuth({
|
setAuth({
|
||||||
|
loading: false,
|
||||||
requiresAuth: false,
|
requiresAuth: false,
|
||||||
mode: "single",
|
mode: "single",
|
||||||
});
|
});
|
||||||
@ -83,6 +101,7 @@ export function usePasswordModal() {
|
|||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
setAuth({
|
setAuth({
|
||||||
|
loading: false,
|
||||||
requiresAuth: true,
|
requiresAuth: true,
|
||||||
mode: "single",
|
mode: "single",
|
||||||
});
|
});
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { API_BASE } from "../utils/constants";
|
import { API_BASE, AUTH_TIMESTAMP } from "../utils/constants";
|
||||||
import { baseHeaders } from "../utils/request";
|
import { baseHeaders } from "../utils/request";
|
||||||
|
|
||||||
const System = {
|
const System = {
|
||||||
@ -39,12 +39,22 @@ const System = {
|
|||||||
.then((res) => res.localFiles)
|
.then((res) => res.localFiles)
|
||||||
.catch(() => null);
|
.catch(() => null);
|
||||||
},
|
},
|
||||||
|
needsAuthCheck: function () {
|
||||||
|
const lastAuthCheck = window.localStorage.getItem(AUTH_TIMESTAMP);
|
||||||
|
if (!lastAuthCheck) return true;
|
||||||
|
const expiresAtMs = Number(lastAuthCheck) + 60 * 5 * 1000; // expires in 5 minutes in ms
|
||||||
|
return Number(new Date()) > expiresAtMs;
|
||||||
|
},
|
||||||
|
|
||||||
checkAuth: async function (currentToken = null) {
|
checkAuth: async function (currentToken = null) {
|
||||||
return await fetch(`${API_BASE}/system/check-token`, {
|
const valid = await fetch(`${API_BASE}/system/check-token`, {
|
||||||
headers: baseHeaders(currentToken),
|
headers: baseHeaders(currentToken),
|
||||||
})
|
})
|
||||||
.then((res) => res.ok)
|
.then((res) => res.ok)
|
||||||
.catch(() => false);
|
.catch(() => false);
|
||||||
|
|
||||||
|
window.localStorage.setItem(AUTH_TIMESTAMP, Number(new Date()));
|
||||||
|
return valid;
|
||||||
},
|
},
|
||||||
requestToken: async function (body) {
|
requestToken: async function (body) {
|
||||||
return await fetch(`${API_BASE}/request-token`, {
|
return await fetch(`${API_BASE}/request-token`, {
|
||||||
|
@ -5,10 +5,12 @@ import PasswordModal, {
|
|||||||
usePasswordModal,
|
usePasswordModal,
|
||||||
} from "../../components/Modals/Password";
|
} from "../../components/Modals/Password";
|
||||||
import { isMobile } from "react-device-detect";
|
import { isMobile } from "react-device-detect";
|
||||||
|
import { FullScreenLoader } from "../../components/Preloader";
|
||||||
|
|
||||||
export default function Main() {
|
export default function Main() {
|
||||||
const { requiresAuth, mode } = usePasswordModal();
|
const { loading, requiresAuth, mode } = usePasswordModal();
|
||||||
|
|
||||||
|
if (loading) return <FullScreenLoader />;
|
||||||
if (requiresAuth !== false) {
|
if (requiresAuth !== false) {
|
||||||
return <>{requiresAuth !== null && <PasswordModal mode={mode} />}</>;
|
return <>{requiresAuth !== null && <PasswordModal mode={mode} />}</>;
|
||||||
}
|
}
|
||||||
|
@ -7,10 +7,12 @@ import PasswordModal, {
|
|||||||
usePasswordModal,
|
usePasswordModal,
|
||||||
} from "../../components/Modals/Password";
|
} from "../../components/Modals/Password";
|
||||||
import { isMobile } from "react-device-detect";
|
import { isMobile } from "react-device-detect";
|
||||||
|
import { FullScreenLoader } from "../../components/Preloader";
|
||||||
|
|
||||||
export default function WorkspaceChat() {
|
export default function WorkspaceChat() {
|
||||||
const { requiresAuth, mode } = usePasswordModal();
|
const { loading, requiresAuth, mode } = usePasswordModal();
|
||||||
|
|
||||||
|
if (loading) return <FullScreenLoader />;
|
||||||
if (requiresAuth !== false) {
|
if (requiresAuth !== false) {
|
||||||
return <>{requiresAuth !== null && <PasswordModal mode={mode} />}</>;
|
return <>{requiresAuth !== null && <PasswordModal mode={mode} />}</>;
|
||||||
}
|
}
|
||||||
|
@ -2,3 +2,4 @@ export const API_BASE = import.meta.env.VITE_API_BASE || "/api";
|
|||||||
|
|
||||||
export const AUTH_USER = "anythingllm_user";
|
export const AUTH_USER = "anythingllm_user";
|
||||||
export const AUTH_TOKEN = "anythingllm_authToken";
|
export const AUTH_TOKEN = "anythingllm_authToken";
|
||||||
|
export const AUTH_TIMESTAMP = "anythingllm_authTimestamp";
|
||||||
|
@ -316,7 +316,7 @@ function systemEndpoints(app) {
|
|||||||
|
|
||||||
updateENV(
|
updateENV(
|
||||||
{
|
{
|
||||||
AuthToken: '',
|
AuthToken: "",
|
||||||
JWTSecret: process.env.JWT_SECRET ?? v4(),
|
JWTSecret: process.env.JWT_SECRET ?? v4(),
|
||||||
},
|
},
|
||||||
true
|
true
|
||||||
|
Loading…
Reference in New Issue
Block a user