refactor: more TS code

src/common/component/Message/ContextMenu.tsx

@@ -42,10 +42,8 @@ export default function MessageContextMenu({
   const { setReplying } = useSendMessage({ context, to: contextId });
   const handleSelect = () => {
     dispatch(updateSelectMessages({ context, id: contextId, data: mid }));
-    // hideAll();
   };
   const handleReply = () => {
-    // console.log("dddd", contextId, mid);
     if (contextId) {
       setReplying(mid);
     }

src/common/component/Message/EditMessage.tsx

@@ -1,10 +1,10 @@
-import { useState, useRef, useEffect } from "react";
+import { useState, useRef, useEffect, ChangeEvent, KeyboardEvent, FC } from "react";
 import styled from "styled-components";
 import TextareaAutosize from "react-textarea-autosize";
 import { useKey } from "rooks";
-import { useSelector } from "react-redux";
 import { useEditMessageMutation } from "../../../app/services/message";
 import { ContentTypes } from "../../../app/config";
+import { useAppSelector } from "../../../app/store";
 
 const StyledWrapper = styled.div`
   width: 100%;
@@ -46,10 +46,13 @@ const StyledWrapper = styled.div`
     }
   }
 `;
-
-export default function EditMessage({ mid, cancelEdit }) {
+type Props = {
+  mid: number;
+  cancelEdit: () => void;
+};
+const EditMessage: FC<Props> = ({ mid, cancelEdit }) => {
   const inputRef = useRef<HTMLTextAreaElement>(null);
-  const msg = useSelector((store) => store.message[mid] || {});
+  const msg = useAppSelector((store) => store.message[mid] || {});
   const [shift, setShift] = useState(false);
   const [enter, setEnter] = useState(false);
   const [currMsg, setCurrMsg] = useState(msg.content);
@@ -77,16 +80,14 @@ export default function EditMessage({ mid, cancelEdit }) {
     },
     { eventTypes: ["keydown", "keyup"], target: inputRef }
   );
-  const handleMsgChange = (evt) => {
+  const handleMsgChange = (evt: ChangeEvent<HTMLTextAreaElement>) => {
     if (enter && !shift) {
       handleSave();
     } else {
       setCurrMsg(evt.target.value);
     }
   };
-  const handleInputKeydown = (e) => {
-    console.log("keydown event", e);
-    // if(e.key==="Esc")
+  const handleInputKeydown = (e: KeyboardEvent<HTMLTextAreaElement>) => {
     setEnter(e.key === "Enter");
   };
   const handleSave = () => {
@@ -129,4 +130,5 @@ export default function EditMessage({ mid, cancelEdit }) {
       </div>
     </StyledWrapper>
   );
-}
+};
+export default EditMessage;

src/common/hook/usePWABadge.ts

@@ -1,18 +0,0 @@
-import { useEffect } from "react";
-import PWABadge from "pwa-badge";
-
-export default function usePWABadge() {
-  // Create an Instance
-  const badge = new PWABadge();
-  useEffect(() => {
-    if (badge.isSupported()) {
-      badge.asyncSetBadge(2).catch((error) => {
-        console.error(error);
-      });
-    }
-  }, []);
-
-  return {
-    isSupported: badge.isSupported()
-  };
-}

src/common/hook/usePinMessage.ts

@@ -12,7 +12,7 @@ export default function usePinMessage(cid: number) {
     };
   });
   const [pin, { isError, isLoading, isSuccess }] = usePinMessageMutation();
-  const [unpin, { isError: isUnpinError, isLoading: isUnpining, isSuccess: isUnpinSuccess }] =
+  const [unpin, { isError: isUnpinError, isLoading: isUnpinning, isSuccess: isUnpinSuccess }] =
     useUnpinMessageMutation();
   const pinMessage = (mid: number) => {
     if (!mid || !cid) return;
@@ -46,7 +46,7 @@ export default function usePinMessage(cid: number) {
     isPining: isLoading,
     isSuccess,
     isUnpinError,
-    isUnpining,
+    isUnpinning,
     isUnpinSuccess
   };
 }

src/common/hook/useSendMessage.ts

@@ -19,14 +19,13 @@ interface SendMessagesDTO {
 }
 
 interface SendMessageDTO {
-  type: "text";
-  content: string;
-  properties: object;
-  reply_mid?: number;
+  context: "user" | "channel";
+  from: number;
+  to: number;
 }
 
-export default function useSendMessage(props?: Props) {
-  const { context = "user", from = null, to = null } = props || {};
+const useSendMessage = (props: Props) => {
+  const { context = "user", from, to = null } = props;
   const dispatch = useAppDispatch();
   const stageFiles = useAppSelector((store) => store.ui.uploadFiles[`${context}_${to}`] || []);
   const [replyMessage, { isError: replyErr, isLoading: replying, isSuccess: replySuccess }] =
@@ -110,4 +109,5 @@ export default function useSendMessage(props?: Props) {
     isSending: userSending || channelSending || replying,
     isSuccess: channelSuccess || userSuccess || replySuccess
   };
-}
+};
+export default useSendMessage;