diff --git a/src/routes/onboarding/steps/get-public-domain.tsx b/src/routes/onboarding/steps/get-public-domain.tsx index 714c1bf9..44c4cf70 100644 --- a/src/routes/onboarding/steps/get-public-domain.tsx +++ b/src/routes/onboarding/steps/get-public-domain.tsx @@ -1,10 +1,14 @@ import { useEffect, useRef, useState } from "react"; -import { useTranslation } from "react-i18next"; +import { Trans, useTranslation } from "react-i18next"; import { useWizard } from "react-use-wizard"; +import { shallowEqual } from "react-redux"; import StyledButton from "@/components/styled/Button"; import { BASE_ORIGIN, tokenHeader } from "@/app/config"; -import { getLocalAuthData } from "@/utils"; +import { getLocalAuthData, compareVersion } from "@/utils"; +import { useAppSelector } from "@/app/store"; + +const REQUIRED_VERSION = "0.5.19"; type Phase = "prompt" | "starting" | "done" | "error"; @@ -19,7 +23,9 @@ interface SseEvent { export default function GetPublicDomain() { const { t } = useTranslation("welcome", { keyPrefix: "onboarding" }); + const { t: tCommon } = useTranslation(); const { nextStep } = useWizard(); + const currentVersion = useAppSelector((store) => store.server.version, shallowEqual); const [phase, setPhase] = useState("prompt"); const [logs, setLogs] = useState([]); @@ -118,6 +124,37 @@ export default function GetPublicDomain() { } }; + if (currentVersion && compareVersion(currentVersion, REQUIRED_VERSION) < 0) { + return ( +
+
+ + + {{ version: REQUIRED_VERSION }} + + + + + {{ version: currentVersion }} + + + {tCommon("server_update.update_tip")} + + {tCommon("server_update.howto")} 📖 + +
+ + {t("tunnel_opt_in_skip")} + +
+ ); + } + if (phase === "prompt") { return (
diff --git a/src/routes/setting/Cloudflared/index.tsx b/src/routes/setting/Cloudflared/index.tsx index 84f39956..643f5aa5 100644 --- a/src/routes/setting/Cloudflared/index.tsx +++ b/src/routes/setting/Cloudflared/index.tsx @@ -162,7 +162,7 @@ export default function Cloudflared() { const isActive = status === "running" || status === "downloading" || status === "starting"; return ( - +

{t("title")}