feat: channel invite modal

src/common/component/ChannelInviteModal.js

@@ -77,7 +77,7 @@ const Styled = styled.div`
 import Modal from "./Modal";
 import Button from "./styled/Button";
 import Input from "./styled/Input";
-export default function InviteModal({ title, closeModal }) {
+export default function ChannelInviteModal({ cid = null, title, closeModal }) {
   const {
     enableSMTP,
     linkCopied,
@@ -85,7 +85,8 @@ export default function InviteModal({ title, closeModal }) {
     copyLink,
     generateNewLink,
     generating,
-  } = useInviteLink();
+  } = useInviteLink(cid);
+  if (!cid) return null;
   return (
     <Modal>
       <Styled>
@@ -98,6 +99,7 @@ export default function InviteModal({ title, closeModal }) {
             <label htmlFor="">Invite by Email</label>
             <div className="input">
               <Input
+                readOnly={true}
                 disabled={!enableSMTP}
                 type="email"
                 className="higher"
@@ -111,7 +113,12 @@ export default function InviteModal({ title, closeModal }) {
           <div className="link">
             <label htmlFor="">Or Send invite link to your friends</label>
             <div className="input">
-              <Input className="higher" placeholder="Generating" value={link} />
+              <Input
+                readOnly
+                className="higher"
+                placeholder="Generating"
+                value={link}
+              />
               <Button className="small" onClick={copyLink}>
                 {linkCopied ? `Copied` : `Copy`}
               </Button>

src/common/hook/useInviteLink.js

@@ -1,33 +1,54 @@
 import { useState, useEffect } from "react";
 import useCopy from "./useCopy";
 import {
-  useCreateInviteLinkQuery,
+  useLazyCreateInviteLinkQuery as useCreateServerInviteLinkQuery,
   useGetSMTPConfigQuery,
 } from "../../app/services/server";
-export default function useInviteLink() {
+import { useLazyCreateInviteLinkQuery as useCreateChannelInviteLinkQuery } from "../../app/services/channel";
+export default function useInviteLink(cid = null) {
   const [finalLink, setFinalLink] = useState("");
   const {
     data: config,
-
     isSuccess: configQuerySuccess,
   } = useGetSMTPConfigQuery();
-  const { data: link, isLoading, refetch } = useCreateInviteLinkQuery();
+  const [
+    generateChannelInviteLink,
+    { data: channelInviteLink, isFetching: generatingChannelLink },
+  ] = useCreateChannelInviteLinkQuery();
+  const [
+    generateServerInviteLink,
+    { data: serverInviteLink, isFetching: generatingServerLink },
+  ] = useCreateServerInviteLinkQuery();
   const [linkCopied, copy] = useCopy();
   const copyLink = () => {
     copy(finalLink);
   };
+  const regenLink = cid
+    ? () => {
+        generateChannelInviteLink(cid);
+      }
+    : generateServerInviteLink;
   useEffect(() => {
-    if (link && config) {
-      const tmpURL = new URL(link);
+    if (cid) {
+      generateChannelInviteLink(cid);
+    } else {
+      generateServerInviteLink();
+    }
+  }, [cid]);
+
+  useEffect(() => {
+    const _link = serverInviteLink || channelInviteLink;
+    console.log("fetching", serverInviteLink, channelInviteLink);
+    if (_link && config) {
+      const tmpURL = new URL(_link);
       tmpURL.searchParams.set("code", config.enabled);
       setFinalLink(tmpURL.href);
     }
-  }, [link, config]);
-
+  }, [serverInviteLink, channelInviteLink, config]);
   return {
     enableSMTP: config?.enabled,
-    generating: isLoading,
-    generateNewLink: refetch,
+    generating: generatingChannelLink || generatingServerLink,
+    generateNewLink: regenLink,
     link: finalLink,
     linkCopied,
     copyLink,