refactor: frontend url

src/routes/setting/Overview/FrontendURL.tsx

@@ -1,14 +1,14 @@
 // import React from 'react'
 import { useTranslation } from 'react-i18next';
-import { useUpdateFrontendUrlMutation } from '../../../app/services/server';
+import { useGetFrontendUrlQuery, useUpdateFrontendUrlMutation } from '../../../app/services/server';
 import StyledInput from "../../../common/component/styled/Input";
 import StyledButton from "../../../common/component/styled/Button";
 import { ChangeEvent, useState, useEffect } from 'react';
 import { toast } from 'react-hot-toast';
-import ServerVersionChecker from '../../../common/component/ServerVersionChecker';
 // type Props = {}
 
 const Index = () => {
+    const { data, isSuccess: getUrlSuccess } = useGetFrontendUrlQuery();
     const [url, setUrl] = useState(location.origin);
     const { t } = useTranslation("setting");
     const { t: ct } = useTranslation();
@@ -25,7 +25,12 @@ const Index = () => {
             toast.success("Update Successfully!");
         }
     }, [isSuccess]);
-
+    useEffect(() => {
+        if (getUrlSuccess && data) {
+            setUrl(data);
+        }
+    }, [getUrlSuccess, data]);
+    // if(!fetch)
     return (
         <div className="setting">
             <p className="label">{t("overview.url.title")}</p>
@@ -35,10 +40,9 @@ const Index = () => {
                 </span>
             </p>
             <div className="flex items-center gap-4 mt-4">
-                <ServerVersionChecker version="0.3.2">
-                    <StyledInput placeholder='frontend url' value={url} onChange={handleChange} />
-                    <StyledButton disabled={!url || isLoading} className='' onClick={handleUpdate}> {ct("action.update")}</StyledButton>
-                </ServerVersionChecker>
+
+                <StyledInput placeholder='frontend url' value={url} onChange={handleChange} />
+                <StyledButton disabled={!url || isLoading} className='' onClick={handleUpdate}> {ct("action.update")}</StyledButton>
             </div>
         </div>
     );

src/routes/setting/Overview/index.tsx

@@ -8,6 +8,7 @@ import useConfig from "../../../common/hook/useConfig";
 import Server from './server';
 import Language from './Language';
 import FrontendURL from "./FrontendURL";
+import ServerVersionChecker from "../../../common/component/ServerVersionChecker";
 
 const StyledWrapper = styled.div`
   position: relative;
@@ -88,14 +89,9 @@ export default function Overview() {
     const guest = v === "true";
     updateLoginConfig({ ...loginConfig, guest });
   };
-
-
-
   if (!loginConfig) return null;
-
   const { who_can_sign_up: whoCanSignUp, guest = false } = loginConfig as LoginConfig;
   const isAdmin = loginUser?.is_admin;
-
   return (
     <StyledWrapper>
       <Server />
@@ -125,16 +121,15 @@ export default function Overview() {
               values={["true", "false"]}
               value={String(guest)}
               onChange={(v) => {
-                console.log("wtff", v);
-
                 handleGuestToggle(v);
               }}
             />
           </div>
-          <FrontendURL />
+          <ServerVersionChecker version="0.3.3" empty={true}>
+            <FrontendURL />
+          </ServerVersionChecker>
         </>
       )}
-
       <Language />
     </StyledWrapper>
   );