refactor: useCopy

src/common/hook/useCopy.js

@@ -1,7 +1,17 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import { copyImageToClipboard } from "copy-image-clipboard";
+import toast from "react-hot-toast";
+
+const useCopy = (config) => {
+  const { enableToast = true } = config || {};
+
+  const [copied, setCopied] = useState(false);
+  useEffect(() => {
+    if (copied && enableToast) {
+      toast.success("Copied!");
+    }
+  }, [copied]);
 
-const useCopy = () => {
   const copyToClipboard = (str) => {
     const el = document.createElement("textarea");
     el.value = str;
@@ -23,10 +33,9 @@ const useCopy = () => {
     return success;
   };
 
-  const [copied, setCopied] = useState(false);
-
   const copy = (text, isImage = false) => {
     let inter = 0;
+    console.log("copy", text, isImage);
     if (!copied) {
       if (!isImage) {
         setCopied(copyToClipboard(text));
@@ -47,7 +56,7 @@ const useCopy = () => {
     };
   };
 
-  return [copied, copy];
+  return { copied, copy };
 };
 
 export default useCopy;

src/routes/chat/ChannelChat/index.js

@@ -86,7 +86,7 @@ export default function ChannelChat({ cid = "", dropFiles = [] }) {
   const addVisible = loginUser?.is_admin || owner == loginUid;
   const readIndex = footprint.readChannels[cid];
   const pinCount = data?.pinned_messages?.length || 0;
-  const finalHasMore = selects ? false : hasMore;
+  // const finalHasMore = selects ? false : hasMore;
   return (
     <>
       {addMemberModalVisible && (
@@ -212,6 +212,7 @@ export default function ChannelChat({ cid = "", dropFiles = [] }) {
                       owner={owner == uid}
                       key={uid}
                       uid={uid}
+                      cid={cid}
                       dm
                       popover
                     />

src/routes/chat/Layout/index.js

@@ -8,6 +8,7 @@ import Send from "../../../common/component/Send";
 import Styled from "./styled";
 import Operations from "./Operations";
 import useUploadFile from "../../../common/hook/useUploadFile";
+import { ChatPrefixs } from "../../../app/config";
 
 export default function Layout({
   children,
@@ -21,9 +22,13 @@ export default function Layout({
   const { addStageFile } = useUploadFile({ context, id: to });
   const messagesContainer = useRef(null);
   const [previewImage, setPreviewImage] = useState(null);
-  const selects = useSelector(
-    (store) => store.ui.selectMessages[`${context}_${to}`]
-  );
+  const { selects, channelsData, contactsData } = useSelector((store) => {
+    return {
+      selects: store.ui.selectMessages[`${context}_${to}`],
+      channelsData: store.channels.byId,
+      contactsData: store.contacts.byId,
+    };
+  });
   const [{ isActive }, drop] = useDrop(
     () => ({
       accept: [NativeTypes.FILE],
@@ -81,7 +86,8 @@ export default function Layout({
       );
     }
   }, []);
-
+  const name =
+    context == "channel" ? channelsData[to]?.name : contactsData[to]?.name;
   return (
     <>
       {previewImage && (
@@ -111,7 +117,7 @@ export default function Layout({
             }`}
           >
             <div className="inner">
-              <h4 className="head">Upload to #Channel</h4>
+              <h4 className="head">{`Send to ${ChatPrefixs[context]}${name}`}</h4>
               <span className="intro">
                 Photos accept jpg, png, max size limit to 10M.
               </span>