diff --git a/src/app/services/channel.ts b/src/app/services/channel.ts index 1acdd222..c34498d3 100644 --- a/src/app/services/channel.ts +++ b/src/app/services/channel.ts @@ -92,7 +92,7 @@ export const channelApi = createApi({ // return _link; // 替换掉域名 const invite = new URL(_link); - return `${location.origin}${invite.pathname}${invite.search}${invite.hash}`; + return `${location.origin}${invite.pathname}${invite.hash}${invite.search}`; } }), removeChannel: builder.query({ diff --git a/src/routes/index.tsx b/src/routes/index.tsx index 3880d29d..41e04094 100644 --- a/src/routes/index.tsx +++ b/src/routes/index.tsx @@ -18,7 +18,6 @@ const UsersPage = lazy(() => import("./users")); const CallbackPage = lazy(() => import("./callback")); const FavoritesPage = lazy(() => import("./favs")); const OnboardingPage = lazy(() => import("./onboarding")); -const InvitePage = lazy(() => import("./invite")); const SettingChannelPage = lazy(() => import("./settingChannel")); const SettingDMPage = lazy(() => import("./settingDM")); const SettingPage = lazy(() => import("./setting")); @@ -107,7 +106,6 @@ const PageRoutes = () => { } /> - } /> } /> { - const { token: loginToken, serverName } = useAppSelector((store) => { - return { token: store.authData.token, serverName: store.server.name }; - }); - const [secondPwd, setSecondPwd] = useState(""); - const [samePwd, setSamePwd] = useState(true); - const [token, setToken] = useState(); - const [valid, setValid] = useState(false); - const [register, { data, isLoading, isSuccess, isError, error }] = useRegisterMutation(); - const [checkToken, { data: isValid, isLoading: checkLoading, isSuccess: checkSuccess }] = - useCheckMagicTokenValidMutation(); - - useEffect(() => { - const query = new URLSearchParams(location.search); - setToken(query.get("token") ?? undefined); - }, []); - - useEffect(() => { - if (token) { - checkToken(token); - } - }, [token]); - - useEffect(() => { - if (checkSuccess) { - setValid(!!isValid); - } else { - setValid(false); - } - }, [checkSuccess, isValid]); - - const [input, setInput] = useState({ name: "", email: "", password: "" }); - - const handleReg = (evt: FormEvent) => { - evt.preventDefault(); - if (!samePwd) { - toast.error("two passwords not same"); - return; - } - register({ - ...input, - magic_token: token, - }); - }; - - const handleInput = (evt: ChangeEvent) => { - const { type } = evt.target.dataset as { type: keyof AuthForm }; - const { value } = evt.target; - setInput((prev) => { - prev[type] = value; - return { ...prev }; - }); - }; - - const handleSecondPwdInput = (evt: ChangeEvent) => { - const { value } = evt.target; - setSecondPwd(value); - }; - - const handlePwdCheck = () => { - if (secondPwd) { - setSamePwd(secondPwd == input.password); - } - }; - - useEffect(() => { - if (!samePwd) { - toast.error("two passwords not same"); - } - }, [samePwd]); - - useEffect(() => { - if (isSuccess && data) { - // 去登录 - toast.success("register success, login please"); - setTimeout(() => { - location.href = `/#/login`; - // navigateTo("/login",); - }, 500); - } else if (isError && error && "data" in error) { - switch (error.status) { - case 400: - toast.error("Register Failed: please check inputs"); - break; - case 412: - toast.error("Register Failed: invalid token or expired"); - break; - case 409: { - toast.error(`Register Failed: ${error.data?.reason}`); - break; - } - default: - toast.error("Register Failed"); - break; - } - } - }, [data, isSuccess, isError, error]); - - const { email, password, name } = input; - if (loginToken) return ; - if (!token) return <>token not found; - if (checkLoading) return <>checking token valid; - if (!valid) return <>invite token expires or invalid; - - return ( -
-
-
- logo -

Sign Up to {serverName}

- Please enter your details. -
-
- - - - - - Sign Up - -
-
-
- ); -}; - -export default InvitePage; diff --git a/src/routes/login/index.tsx b/src/routes/login/index.tsx index a6d5917a..3d2ca200 100644 --- a/src/routes/login/index.tsx +++ b/src/routes/login/index.tsx @@ -2,7 +2,6 @@ import { useState, useEffect, FormEvent, ChangeEvent } from "react"; import toast from "react-hot-toast"; import BASE_URL from "../../app/config"; -// import web3 from "web3"; import Input from "../../common/component/styled/Input"; import Button from "../../common/component/styled/Button"; @@ -56,7 +55,8 @@ export default function LoginPage() { }); } else { // reg with magic link and set name only - location.href = `?magic_token=${magic_token}#/register/set_name/login`; + // navigate(`/register/set_name/login?magic_token=${magic_token}`); + location.href = `/#/register/set_name/login?magic_token=${magic_token}`; } } }, []); diff --git a/src/routes/reg/RegWithUsername.tsx b/src/routes/reg/RegWithUsername.tsx index 141093c3..45583be5 100644 --- a/src/routes/reg/RegWithUsername.tsx +++ b/src/routes/reg/RegWithUsername.tsx @@ -1,7 +1,7 @@ import { useState, useEffect, FC, FormEvent, ChangeEvent } from "react"; import { useDispatch } from "react-redux"; import { useTranslation } from "react-i18next"; -import { useParams } from "react-router-dom"; +import { useParams, useSearchParams } from "react-router-dom"; import toast from "react-hot-toast"; import { setAuthData } from "../../app/slices/auth.data"; import Input from "../../common/component/styled/Input"; @@ -13,6 +13,7 @@ import { useRegisterMutation } from "../../app/services/auth"; const RegWithUsername: FC = () => { const { t: ct } = useTranslation(); const { t } = useTranslation("auth"); + const [searchParams] = useSearchParams(); const [checkTokenInvalid, { data: isTokenValid, isLoading: checkingToken }] = useCheckMagicTokenValidMutation(); const [ @@ -27,9 +28,8 @@ const RegWithUsername: FC = () => { const { from = "reg" } = useParams(); const dispatch = useDispatch(); const [username, setUsername] = useState(""); - const query = new URLSearchParams(location.search); // todo: check if query param exists - const token = query.get("magic_token") as string; + const token = searchParams.get("magic_token") as string; useEffect(() => { if (token) { checkTokenInvalid(token); @@ -92,8 +92,8 @@ const RegWithUsername: FC = () => { setUsername(evt.target.value); }; - if (!token) return <>"No Token"; - if (checkingToken) return
"Checking Magic Link..."
; + if (!token) return No Token; + if (checkingToken) return
Checking Magic Link...
; if (!isTokenValid) return ; const isLoading = loginLoading || regLoading; const isSuccess = loginSuccess || regSuccess; diff --git a/src/routes/reg/Register.tsx b/src/routes/reg/Register.tsx index 1fe25c8e..98e98e10 100644 --- a/src/routes/reg/Register.tsx +++ b/src/routes/reg/Register.tsx @@ -1,6 +1,7 @@ import { useState, useEffect, ChangeEvent, FormEvent } from "react"; import toast from "react-hot-toast"; import { useTranslation } from "react-i18next"; +import { useSearchParams } from "react-router-dom"; import BASE_URL, { KEY_LOCAL_MAGIC_TOKEN } from "../../app/config"; import Input from "../../common/component/styled/Input"; import Button from "../../common/component/styled/Button"; @@ -26,6 +27,7 @@ export default function Register() { const serverName = useAppSelector(store => store.server.name); const { t } = useTranslation("auth"); const { t: ct } = useTranslation(); + let [searchParams] = useSearchParams(); const [sendRegMagicLink, { isLoading: signingUp, data, isSuccess }] = useSendRegMagicLinkMutation(); const dispatch = useDispatch(); @@ -40,8 +42,7 @@ export default function Register() { password: "", confirmPassword: "" }); - const query = new URLSearchParams(location.search); - const magic_token = query.get("magic_token") ?? undefined; + const magic_token = searchParams.get("magic_token") ?? undefined; if (magic_token) { //本地存一下 magic token 后续oauth流程用到 localStorage.setItem(KEY_LOCAL_MAGIC_TOKEN, magic_token); @@ -118,7 +119,7 @@ export default function Register() { // magic token 没有并且没有开放注册 if (whoCanSignUp !== "EveryOne" && !magic_token) // todo: i18n - return <>Sign up method is updated to Invitation Link Only; + return Sign up method is updated to Invitation Link Only; const { name, email, password, confirmPassword } = input; if (data?.mail_is_sent) return ; const isLoading = registering || signingUp || checkingEmail; diff --git a/src/routes/reg/index.tsx b/src/routes/reg/index.tsx index b46ecbef..b5231a18 100644 --- a/src/routes/reg/index.tsx +++ b/src/routes/reg/index.tsx @@ -1,11 +1,6 @@ -import { useEffect } from "react"; import { Outlet } from "react-router-dom"; export default function RegContainer() { - useEffect(() => { - // 重新组织url - location.href = `${location.origin}${location.hash}${location.search}`; - }, [location]); return (
diff --git a/src/widget/WidgetContext.tsx b/src/widget/WidgetContext.tsx index ddda44a7..ddf92f27 100644 --- a/src/widget/WidgetContext.tsx +++ b/src/widget/WidgetContext.tsx @@ -3,8 +3,9 @@ import { useGetLoginConfigQuery, useGetServerQuery } from '../app/services/serve import { useAppSelector } from '../app/store'; import { getContrastColor } from '../common/utils'; -const color = decodeURIComponent(new URLSearchParams(location.search).get("themeColor") || "#1fe1f9"); -const from = decodeURIComponent(new URLSearchParams(location.search).get("from") || "widget.link"); +const query = new URLSearchParams(location.search); +const color = decodeURIComponent(query.get("themeColor") || "#1fe1f9"); +const from = decodeURIComponent(query.get("from") || "widget.link"); const fgColor = getContrastColor(color); // 判断是否是iframe上下文 const embed = window.location !== window.parent.location;