From 068e368b1c4802858a4e886522f9780c861ada60 Mon Sep 17 00:00:00 2001 From: "Rui Zhao (renyuneyun)" Date: Wed, 23 Nov 2022 12:16:51 +0000 Subject: [PATCH] fix: Fix unable to log-in if app is under path --- src/context/BaseUrlContex.js | 19 +++++++++++++++++++ src/pages/_app.js | 29 ++++++++++++++++------------- src/pages/index.js | 6 ++++++ src/pages/login.js | 9 +++------ 4 files changed, 44 insertions(+), 19 deletions(-) create mode 100644 src/context/BaseUrlContex.js diff --git a/src/context/BaseUrlContex.js b/src/context/BaseUrlContex.js new file mode 100644 index 0000000..47469d4 --- /dev/null +++ b/src/context/BaseUrlContex.js @@ -0,0 +1,19 @@ +import { useContext, createContext, useState } from "react"; + +const baseUrlContext = createContext(); + +export function useBaseUrl() { + return useContext(baseUrlContext); +} + +export function BaseUrlProvider({ children }) { + const [baseUrl, setBaseUrl] = useState( + "https://localhost:3000" + ); + + return ( + + {children} + + ); +} diff --git a/src/pages/_app.js b/src/pages/_app.js index cfaee24..fb0e907 100644 --- a/src/pages/_app.js +++ b/src/pages/_app.js @@ -6,23 +6,26 @@ import CustomDrawer from "../components/CustomDrawer"; import Toolbar from "@mui/material/Toolbar"; import CssBaseline from "@mui/material/CssBaseline"; import Box from "@mui/material/Box"; +import { BaseUrlProvider } from "../context/BaseUrlContex" function MyApp({ Component, pageProps }) { return ( - - - Solid Calendar - - - -
- - - - + + + + Solid Calendar + + + +
+ + + + + - - + + ); } diff --git a/src/pages/index.js b/src/pages/index.js index e9699f4..3eb8a10 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -3,10 +3,16 @@ import { useEffect, useState } from "react"; import { useSession } from "@inrupt/solid-ui-react"; import { getPersonName } from "../utils/participantsHelper"; import { getRDFasJson } from "../utils/fetchHelper"; +import { useBaseUrl } from "../context/BaseUrlContex"; export default function Home() { const { session, sessionRequestInProgress } = useSession(); const [name, setName] = useState(""); + const [baseUrl, setBaseUrl] = useBaseUrl(); + + useEffect(() => { + setBaseUrl(window.location.origin + window.location.pathname); + }, [setBaseUrl]); useEffect(() => { const webID = session.info.webId; diff --git a/src/pages/login.js b/src/pages/login.js index b73e6a5..9e9d88e 100644 --- a/src/pages/login.js +++ b/src/pages/login.js @@ -10,6 +10,7 @@ import Container from "@mui/material/Container"; import Stack from "@mui/material/Stack"; import TextField from "@mui/material/TextField"; import Box from "@mui/material/Box"; +import { useBaseUrl } from "../context/BaseUrlContex"; const providers = [ { title: "Inrupt Pod Spaces", url: "https://broker.pod.inrupt.com/" }, @@ -21,13 +22,9 @@ const providers = [ ]; export default function Login() { - const [currentUrl, setCurrentUrl] = useState("https://localhost:3000"); + const [baseUrl, setBaseUrl] = useBaseUrl(); const [provider, setProvider] = useState(""); - useEffect(() => { - setCurrentUrl(window.location.origin); - }, [setCurrentUrl]); - return (
@@ -78,7 +75,7 @@ export default function Login() {