chore: update prettier setting

src/routes/setting/APIConfig.js

@@ -52,16 +52,14 @@ import Input from "../../common/component/styled/Input";
 import Button from "../../common/component/styled/Button";
 import {
   useGetThirdPartySecretQuery,
-  useUpdateThirdPartySecretMutation,
+  useUpdateThirdPartySecretMutation
 } from "../../app/services/server";
 import Tippy from "@tippyjs/react";
 import toast from "react-hot-toast";
 export default function APIConfig() {
   const { data } = useGetThirdPartySecretQuery();
-  const [
-    updateSecret,
-    { data: updatedSecret, isSuccess, isLoading },
-  ] = useUpdateThirdPartySecretMutation();
+  const [updateSecret, { data: updatedSecret, isSuccess, isLoading }] =
+    useUpdateThirdPartySecretMutation();
   console.log("secret", data);
   useEffect(() => {
     if (isSuccess) {
@@ -83,18 +81,13 @@ export default function APIConfig() {
         content={
           <StyledConfirm>
             <div className="tip">
-              Are you sure to update API secret? Previous secret will be
-              invalided
+              Are you sure to update API secret? Previous secret will be invalided
             </div>
             <div className="btns">
               <Button onClick={hideAll} className="cancel small">
                 Cancel
               </Button>
-              <Button
-                disabled={isLoading}
-                className="small danger"
-                onClick={updateSecret}
-              >
+              <Button disabled={isLoading} className="small danger" onClick={updateSecret}>
                 Yes
               </Button>
             </div>
@@ -104,8 +97,8 @@ export default function APIConfig() {
         <Button>Update Secret</Button>
       </Tippy>
       <div className="tip">
-        Tip: The security key agreed between the rustchat server and the
-        third-party app is used to encrypt the communication data.{" "}
+        Tip: The security key agreed between the rustchat server and the third-party app is used to
+        encrypt the communication data.{" "}
       </div>
     </Styled>
   );

src/routes/setting/LogoutConfirmModal.js

@@ -69,11 +69,7 @@ export default function LogoutConfirmModal({ closeModal }) {
           <label htmlFor="clear_cb" className="txt">
             Clear local data
           </label>
-          <Checkbox
-            name="clear_cb"
-            checked={clearLocal}
-            onChange={handleCheck}
-          />
+          <Checkbox name="clear_cb" checked={clearLocal} onChange={handleCheck} />
         </div>
       </StyledConfirm>
     </Modal>

src/routes/setting/MyAccount.js

@@ -101,21 +101,18 @@ const EditModalInfo = {
   name: {
     label: "Username",
     title: "Change your username",
-    intro: "Enter a new username.",
+    intro: "Enter a new username."
   },
   email: {
     label: "Email",
     title: "Change your email",
-    intro: "Enter a new email.",
-  },
+    intro: "Enter a new email."
+  }
 };
 export default function MyAccount() {
   const [passwordModal, setPasswordModal] = useState(false);
   const [editModal, setEditModal] = useState(null);
-  const [
-    uploadAvatar,
-    { isSuccess: uploadSuccess },
-  ] = useUpdateAvatarMutation();
+  const [uploadAvatar, { isSuccess: uploadSuccess }] = useUpdateAvatarMutation();
   const loginUser = useSelector((store) => {
     return store.contacts.byId[store.authData.uid];
   });
@@ -177,8 +174,7 @@ export default function MyAccount() {
         <div className="danger">
           <h4 className="head">Account Removal</h4>
           <div className="desc">
-            Disabling your account means you can recover it at any time after
-            taking this action.
+            Disabling your account means you can recover it at any time after taking this action.
           </div>
           <button className="btn">Delete Account</button>
         </div>
@@ -191,9 +187,7 @@ export default function MyAccount() {
           closeModal={closeBasicEditModal}
         />
       )}
-      {passwordModal && (
-        <UpdatePasswordModal closeModal={togglePasswordModal} />
-      )}
+      {passwordModal && <UpdatePasswordModal closeModal={togglePasswordModal} />}
     </>
   );
 }

src/routes/setting/Notifications.js

@@ -17,10 +17,7 @@ export default function Notifications() {
   return (
     <StyledWrapper>
       <Label>Notification Setting:</Label>
-      <StyledToggle
-        data-checked={status == "granted"}
-        onClick={handleEnableNotify}
-      />
+      <StyledToggle data-checked={status == "granted"} onClick={handleEnableNotify} />
     </StyledWrapper>
   );
 }

src/routes/setting/Overview.js

@@ -4,7 +4,7 @@ import { useSelector } from "react-redux";
 import {
   useGetServerQuery,
   useUpdateServerMutation,
-  useUpdateLogoMutation,
+  useUpdateLogoMutation
 } from "../../app/services/server";
 import LogoUploader from "../../common/component/AvatarUploader";
 import Input from "../../common/component/styled/Input";
@@ -136,8 +136,8 @@ export default function Overview() {
         {isAdmin && (
           <div className="upload">
             <div className="tip">
-              Minimum size is 128x128, We recommend at least 512x512 for the
-              server. Max size limited to 5M.
+              Minimum size is 128x128, We recommend at least 512x512 for the server. Max size
+              limited to 5M.
             </div>
             {/* <button className="btn">Upload Image</button> */}
           </div>
@@ -170,9 +170,7 @@ export default function Overview() {
           />
         </div>
       </div>
-      {changed && (
-        <SaveTip saveHandler={handleUpdate} resetHandler={handleReset} />
-      )}
+      {changed && <SaveTip saveHandler={handleUpdate} resetHandler={handleReset} />}
       {/* <button onClick={handleUpdate} className="btn">update</button> */}
     </StyledWrapper>
   );

src/routes/setting/ProfileBasicEditModal.js

@@ -28,7 +28,7 @@ export default function ProfileBasicEditModal({
   value = "",
   title = "Change your username",
   intro = "Enter a new username and your existing password.",
-  closeModal,
+  closeModal
 }) {
   const [input, setInput] = useState(value);
   // const dispatch = useDispatch();
@@ -56,9 +56,7 @@ export default function ProfileBasicEditModal({
             <Button className="cancel" onClick={closeModal}>
               Cancel
             </Button>
-            <Button onClick={handleUpdate}>
-              {isLoading ? "Updating" : `Done`}
-            </Button>
+            <Button onClick={handleUpdate}>{isLoading ? "Updating" : `Done`}</Button>
           </>
         }
       >

src/routes/setting/UpdatePasswordModal.js

@@ -2,10 +2,7 @@
 import { useEffect, useState } from "react";
 import styled from "styled-components";
 import Input from "../../common/component/styled/Input";
-import {
-  useUpdatePasswordMutation,
-  useGetCredentialsQuery,
-} from "../../app/services/auth";
+import { useUpdatePasswordMutation, useGetCredentialsQuery } from "../../app/services/auth";
 import StyledModal from "../../common/component/styled/Modal";
 import Button from "../../common/component/styled/Button";
 const StyledEdit = styled(StyledModal)`
@@ -30,13 +27,10 @@ export default function ProfileBasicEditModal({ closeModal }) {
   const [input, setInput] = useState({
     current: "",
     newPassword: "",
-    confirmPassword: "",
+    confirmPassword: ""
   });
   // const dispatch = useDispatch();
-  const [
-    updatePassword,
-    { isLoading, isSuccess },
-  ] = useUpdatePasswordMutation();
+  const [updatePassword, { isLoading, isSuccess }] = useUpdatePasswordMutation();
   const handleChange = (evt) => {
     const { type } = evt.target.dataset;
     setInput((prev) => {

src/routes/setting/config/Agora.js

@@ -7,14 +7,7 @@ import Toggle from "../../../common/component/styled/Toggle";
 import SaveTip from "../../../common/component/SaveTip";
 import useConfig from "../../../common/hook/useConfig";
 export default function ConfigAgora() {
-  const {
-    changed,
-    reset,
-    values,
-    setValues,
-    toggleEnable,
-    updateConfig,
-  } = useConfig("agora");
+  const { changed, reset, values, setValues, toggleEnable, updateConfig } = useConfig("agora");
   const handleUpdate = () => {
     // const { token_url, description } = values;
     updateConfig(values);
@@ -34,7 +27,7 @@ export default function ConfigAgora() {
     app_certificate,
     rtm_key,
     rtm_secret,
-    enabled = false,
+    enabled = false
   } = values ?? {};
   return (
     <StyledContainer>

src/routes/setting/config/Firebase.js

@@ -8,14 +8,7 @@ import SaveTip from "../../../common/component/SaveTip";
 import useConfig from "../../../common/hook/useConfig";
 
 export default function ConfigFirebase() {
-  const {
-    values,
-    toggleEnable,
-    updateConfig,
-    setValues,
-    reset,
-    changed,
-  } = useConfig("firebase");
+  const { values, toggleEnable, updateConfig, setValues, reset, changed } = useConfig("firebase");
   const handleUpdate = () => {
     // const { token_url, description } = values;
     updateConfig(values);
@@ -28,8 +21,7 @@ export default function ConfigFirebase() {
     });
   };
   //   if (!values) return null;
-  const { token_url, project_id, private_key, client_email, enabled = false } =
-    values ?? {};
+  const { token_url, project_id, private_key, client_email, enabled = false } = values ?? {};
   return (
     <StyledContainer>
       <div className="inputs">

src/routes/setting/config/Logins.js

@@ -15,17 +15,15 @@ export default function Logins() {
     changed: clientIdChanged,
     clientId,
     updateClientId,
-    updateClientIdToServer,
+    updateClientIdToServer
   } = useGoogleAuthConfig();
   const {
     config: githubAuthConfig,
     changed: githubChanged,
     updateGithubAuthConfigToServer,
-    updateGithubAuthConfig,
+    updateGithubAuthConfig
   } = useGithubAuthConfig();
-  const { values, updateConfig, setValues, reset, changed } = useConfig(
-    "login"
-  );
+  const { values, updateConfig, setValues, reset, changed } = useConfig("login");
   const handleUpdate = async () => {
     const { google } = values;
     if (changed) {
@@ -70,8 +68,7 @@ export default function Logins() {
     });
   };
   if (!values) return null;
-  const { google, magic_link, github, metamask, password, oidc = [] } =
-    values ?? {};
+  const { google, magic_link, github, metamask, password, oidc = [] } = values ?? {};
   const valuesChanged = clientIdChanged || changed || githubChanged;
 
   return (
@@ -97,9 +94,7 @@ export default function Logins() {
               <div className="txt">
                 <Label>Magic Link</Label>
               </div>
-              <span className="desc">
-                Allows members login with Magic Link.
-              </span>
+              <span className="desc">Allows members login with Magic Link.</span>
             </div>
             <Toggle
               onClick={handleToggle.bind(null, { magic_link: !magic_link })}
@@ -191,9 +186,7 @@ export default function Logins() {
           </div>
         </div>
       </div>
-      {valuesChanged && (
-        <SaveTip saveHandler={handleUpdate} resetHandler={reset} />
-      )}
+      {valuesChanged && <SaveTip saveHandler={handleUpdate} resetHandler={reset} />}
     </StyledContainer>
   );
 }

src/routes/setting/config/SMTP.js

@@ -20,14 +20,7 @@ import toast from "react-hot-toast";
 export default function ConfigSMTP() {
   const [testEmail, setTestEmail] = useState("");
   const [sendTestEmail, { isSuccess, isError }] = useSendTestEmailMutation();
-  const {
-    reset,
-    updateConfig,
-    values,
-    setValues,
-    changed,
-    toggleEnable,
-  } = useConfig("smtp");
+  const { reset, updateConfig, values, setValues, changed, toggleEnable } = useConfig("smtp");
 
   const handleUpdate = () => {
     // const { token_url, description } = values;
@@ -49,7 +42,7 @@ export default function ConfigSMTP() {
     sendTestEmail({
       to: testEmail,
       subject: "test title",
-      content: "test content",
+      content: "test content"
     });
   };
   useEffect(() => {
@@ -62,8 +55,7 @@ export default function ConfigSMTP() {
   }, [isSuccess, isError]);
 
   //   if (!values) return null;
-  const { host, port, from, username, password, enabled = false } =
-    values ?? {};
+  const { host, port, from, username, password, enabled = false } = values ?? {};
   console.log("values", values);
   return (
     <StyledContainer>

src/routes/setting/navs.js

@@ -16,20 +16,20 @@ const navs = [
       {
         name: "overview",
         title: "Overview",
-        component: <Overview />,
+        component: <Overview />
       },
       {
         name: "members",
         title: "Members",
         component: <ManageMembers />,
-        admin: true,
-      },
+        admin: true
+      }
       // {
       //   name: "notification",
       //   title: "Notification",
       //   component: <Notifications />,
       // },
-    ],
+    ]
   },
   {
     title: "User",
@@ -37,9 +37,9 @@ const navs = [
       {
         name: "my_account",
         title: "My Account",
-        component: <MyAccount />,
-      },
-    ],
+        component: <MyAccount />
+      }
+    ]
   },
   {
     title: "Configuration",
@@ -47,30 +47,30 @@ const navs = [
       {
         name: "firebase",
         title: "Firebase",
-        component: <ConfigFirebase />,
+        component: <ConfigFirebase />
       },
       {
         name: "agora",
         title: "Agora",
-        component: <ConfigAgora />,
+        component: <ConfigAgora />
       },
       {
         name: "smtp",
         title: "SMTP",
-        component: <ConfigSMTP />,
+        component: <ConfigSMTP />
       },
       {
         name: "social_login",
         title: "Login Methods",
-        component: <Logins />,
+        component: <Logins />
       },
       {
         name: "api",
         title: "Third-party APP",
-        component: <APIConfig />,
-      },
+        component: <APIConfig />
+      }
     ],
-    admin: true,
+    admin: true
   },
   {
     title: "About",
@@ -78,20 +78,20 @@ const navs = [
       {
         name: "faq",
         title: "FAQ",
-        component: <FAQ />,
+        component: <FAQ />
       },
       {
         name: "terms",
         title: "Terms & Privacy",
-        component: "Terms & Privacy",
+        component: "Terms & Privacy"
       },
       {
         name: "feedback",
         title: "Feedback",
-        component: "feedback",
-      },
-    ],
-  },
+        component: "feedback"
+      }
+    ]
+  }
 ];
 const useNavs = () => {
   const loginUser = useSelector((store) => {