feat: hide call option while agora disabled

src/common/component/CurrentUser.js

@@ -4,6 +4,7 @@ import { useSelector } from "react-redux";
 import soundIcon from "../../assets/icons/sound.on.svg?url";
 import micIcon from "../../assets/icons/mic.on.svg?url";
 import Avatar from "./Avatar";
+import useConfig from "../hook/useConfig";
 // import UserGuide from "./UserGuide";
 const StyledWrapper = styled.div`
   background-color: #f4f4f5;
@@ -60,6 +61,7 @@ const StyledWrapper = styled.div`
   }
 `;
 export default function CurrentUser() {
+  const { values: agoraConfig } = useConfig("agora");
   const currUser = useSelector((store) => {
     return store.contacts.byId[store.authData.uid];
   });
@@ -76,10 +78,12 @@ export default function CurrentUser() {
           <span className="id">#{uid}</span>
         </div>
       </div>
-      <div className="settings">
-        <img src={soundIcon} className="icon" alt="mic icon" />
-        <img src={micIcon} className="icon" alt="sound icon" />
-      </div>
+      {agoraConfig.enabled && (
+        <div className="settings">
+          <img src={soundIcon} className="icon" alt="mic icon" />
+          <img src={micIcon} className="icon" alt="sound icon" />
+        </div>
+      )}
     </StyledWrapper>
     // </UserGuide>
   );

src/common/component/Profile/index.js

@@ -56,7 +56,7 @@ export default function Profile({ uid = null, type = "embed", cid = null }) {
           </li>
         </NavLink>
         {/* <NavLink to={`#`}> */}
-        {type == "embed" && (
+        {enableCall && (
           <li className="icon call" onClick={call}>
             <IconCall />
             <span className="txt">Call</span>

src/common/hook/useConfig.js

@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { isObjectEqual } from "../../../common/utils";
+import { isObjectEqual } from "../utils";
 import toast from "react-hot-toast";
 import {
   useGetAgoraConfigQuery,
@@ -10,7 +10,7 @@ import {
   useUpdateSMTPConfigMutation,
   useUpdateAgoraConfigMutation,
   useUpdateFirebaseConfigMutation,
-} from "../../../app/services/server";
+} from "../../app/services/server";
 export default function useConfig(config = "smtp") {
   const [changed, setChanged] = useState(false);
   const [values, setValues] = useState({});

src/common/hook/useContactOperation.js

@@ -6,10 +6,12 @@ import { useNavigate, useMatch } from "react-router-dom";
 import { hideAll } from "tippy.js";
 import { useRemoveMembersMutation } from "../../app/services/channel";
 import { useLazyDeleteContactQuery } from "../../app/services/contact";
+import useConfig from "./useConfig";
 import useCopy from "./useCopy";
 
 export default function useContactOperation({ uid, cid }) {
   const [passedUid, setPassedUid] = useState(undefined);
+  const { values: agoraConfig } = useConfig("agora");
   const isUserDetailPath = useMatch(`/contacts/${uid}`);
   const [
     removeUser,
@@ -68,7 +70,7 @@ export default function useContactOperation({ uid, cid }) {
   };
   const canRemoveFromChannel =
     cid && !channel?.is_public && (isAdmin || channel?.owner == loginUid);
-  const canCall = loginUid != uid;
+  const canCall = agoraConfig.enabled && loginUid != uid;
   const canRemove = isAdmin && loginUid != uid && !cid;
   return {
     canRemove,

src/routes/chat/ChannelChat/index.js

@@ -8,6 +8,7 @@ import FavList from "../FavList";
 import { useReadMessageMutation } from "../../../app/services/message";
 import { updateRemeberedNavs } from "../../../app/slices/ui";
 import useMessageFeed from "../../../common/hook/useMessageFeed";
+import useConfig from "../../../common/hook/useConfig";
 import ChannelIcon from "../../../common/component/ChannelIcon";
 import Tooltip from "../../../common/component/Tooltip";
 import Contact from "../../../common/component/Contact";
@@ -34,6 +35,7 @@ import LoadMore from "../LoadMore";
 // import useChatScroll from "../../../common/hook/useChatScroll";
 
 export default function ChannelChat({ cid = "", dropFiles = [] }) {
+  const { values: agoraConfig } = useConfig("agora");
   const { list: msgIds, appends, hasMore, pullUp } = useMessageFeed({
     context: "channel",
     id: cid,
@@ -107,11 +109,13 @@ export default function ChannelChat({ cid = "", dropFiles = [] }) {
         aside={
           <>
             <ul className="tools">
-              <li className="tool">
-                <Tooltip tip="Voice/Video Chat" placement="left">
-                  <IconHeadphone />
-                </Tooltip>
-              </li>
+              {agoraConfig.enabled && (
+                <li className="tool">
+                  <Tooltip tip="Voice/Video Chat" placement="left">
+                    <IconHeadphone />
+                  </Tooltip>
+                </li>
+              )}
               <Tooltip
                 tip="Pin"
                 placement="left"

src/routes/setting/config/Agora.js

@@ -5,7 +5,7 @@ import Textarea from "../../../common/component/styled/Textarea";
 import Label from "../../../common/component/styled/Label";
 import Toggle from "../../../common/component/styled/Toggle";
 import SaveTip from "../../../common/component/SaveTip";
-import useConfig from "./useConfig";
+import useConfig from "../../../common/hook/useConfig";
 export default function ConfigAgora() {
   const {
     changed,

src/routes/setting/config/Firebase.js

@@ -5,7 +5,7 @@ import Textarea from "../../../common/component/styled/Textarea";
 import Toggle from "../../../common/component/styled/Toggle";
 import Label from "../../../common/component/styled/Label";
 import SaveTip from "../../../common/component/SaveTip";
-import useConfig from "./useConfig";
+import useConfig from "../../../common/hook/useConfig";
 
 export default function ConfigFirebase() {
   const {

src/routes/setting/config/Logins.js

@@ -5,7 +5,7 @@ import Toggle from "../../../common/component/styled/Toggle";
 import Label from "../../../common/component/styled/Label";
 import Input from "../../../common/component/styled/Input";
 import SaveTip from "../../../common/component/SaveTip";
-import useConfig from "./useConfig";
+import useConfig from "../../../common/hook/useConfig";
 import Tooltip from "./Tooltip";
 import IssuerList from "./IssuerList";
 import useGoogleAuthConfig from "../../../common/hook/useGoogleAuthConfig";

src/routes/setting/config/SMTP.js

@@ -8,7 +8,7 @@ const StyledTest = styled.div`
 `;
 import { useSendTestEmailMutation } from "../../../app/services/server";
 import iconQuestion from "../../../assets/icons/question.svg?url";
-import useConfig from "./useConfig";
+import useConfig from "../../../common/hook/useConfig";
 import StyledContainer from "./StyledContainer";
 import Input from "../../../common/component/styled/Input";
 import Button from "../../../common/component/styled/Button";