diff --git a/src/app/slices/message.user.ts b/src/app/slices/message.user.ts index f72f9b51..3a51459b 100644 --- a/src/app/slices/message.user.ts +++ b/src/app/slices/message.user.ts @@ -19,14 +19,14 @@ const userMsgSlice = createSlice({ return initialState; }, fillUserMsg(state, action: PayloadAction<{ [id: number]: any }>) { - state.ids = Object.keys(action.payload); + state.ids = Object.keys(action.payload).map((k) => +k); state.byId = action.payload; }, addUserMsg(state, action: PayloadAction<{ id: number; mid: number; local_id: number }>) { const { id, mid, local_id } = action.payload; if (state.byId[id]) { - const midExisted = state.byId[id].findIndex((id) => id == mid) > -1; - const localMsgExisted = state.byId[id].findIndex((id) => id == local_id) > -1; + const midExisted = state.byId[id].findIndex((id: number) => id == mid) > -1; + const localMsgExisted = state.byId[id].findIndex((id: number) => id == local_id) > -1; if (midExisted || localMsgExisted) return; state.byId[id].push(+mid); // 只要有新消息，就检查下 @@ -41,7 +41,7 @@ const userMsgSlice = createSlice({ removeUserMsg(state, action) { const { id, mid } = action.payload; if (state.byId[id]) { - const idx = state.byId[id].findIndex((i) => i == mid); + const idx = state.byId[id].findIndex((i: number) => i == mid); if (idx > -1) { // 存在 则再删除 state.byId[id].splice(idx, 1); @@ -51,7 +51,7 @@ const userMsgSlice = createSlice({ replaceUserMsg(state, action) { const { id, localMid, serverMid } = action.payload; if (state.byId[id]) { - const localIdx = state.byId[id].findIndex((i) => i == localMid); + const localIdx = state.byId[id].findIndex((i: number) => i == localMid); if (localIdx > -1 && serverMid) { // 存在 则再删除 state.byId[id].splice(localIdx, 1, serverMid); diff --git a/src/app/slices/ui.ts b/src/app/slices/ui.ts index 18d02897..4fd393ca 100644 --- a/src/app/slices/ui.ts +++ b/src/app/slices/ui.ts @@ -45,7 +45,7 @@ const uiSlice = createSlice({ setReady(state) { state.ready = true; }, - updateOnline(state, action) { + updateOnline(state, action: PayloadAction) { state.online = action.payload; }, toggleMenuExpand(state) { diff --git a/src/common/component/Message/ContextMenu.tsx b/src/common/component/Message/ContextMenu.tsx index 1cd00af1..fcfc4ed1 100644 --- a/src/common/component/Message/ContextMenu.tsx +++ b/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); } diff --git a/src/common/component/Message/EditMessage.tsx b/src/common/component/Message/EditMessage.tsx index 609e5f97..9fef31e6 100644 --- a/src/common/component/Message/EditMessage.tsx +++ b/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 = ({ mid, cancelEdit }) => { const inputRef = useRef(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) => { 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) => { setEnter(e.key === "Enter"); }; const handleSave = () => { @@ -129,4 +130,5 @@ export default function EditMessage({ mid, cancelEdit }) { ); -} +}; +export default EditMessage; diff --git a/src/common/hook/usePWABadge.ts b/src/common/hook/usePWABadge.ts deleted file mode 100644 index d1f05f5c..00000000 --- a/src/common/hook/usePWABadge.ts +++ /dev/null @@ -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() - }; -} diff --git a/src/common/hook/usePinMessage.ts b/src/common/hook/usePinMessage.ts index 61080cb9..cc70aa13 100644 --- a/src/common/hook/usePinMessage.ts +++ b/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 }; } diff --git a/src/common/hook/useSendMessage.ts b/src/common/hook/useSendMessage.ts index c6f55fb3..b2a0fd15 100644 --- a/src/common/hook/useSendMessage.ts +++ b/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; diff --git a/src/routes/chat/FavList.tsx b/src/routes/chat/FavList.tsx index 707cc30b..d2a56066 100644 --- a/src/routes/chat/FavList.tsx +++ b/src/routes/chat/FavList.tsx @@ -1,9 +1,7 @@ -// import React from "react"; -// import { useSelector } from "react-redux"; +import { MouseEvent } from "react"; import styled from "styled-components"; import FavoredMessage from "../../common/component/Message/FavoredMessage"; -import IconSurprise from "../../assets/icons/emoji.suprise.svg"; -// import IconForward from "../../../assets/icons/forward.svg"; +import IconSurprise from "../../assets/icons/emoji.surprise.svg"; import IconRemove from "../../assets/icons/close.svg"; import useFavMessage from "../../common/hook/useFavMessage"; @@ -87,7 +85,7 @@ const Styled = styled.div` export default function FavList({ cid = null, uid = null }) { const { favorites, removeFavorite } = useFavMessage({ cid, uid }); - const handleRemove = (evt) => { + const handleRemove = (evt: MouseEvent) => { const { id } = evt.currentTarget.dataset; console.log("remove fav", id); removeFavorite(id); diff --git a/src/routes/chat/index.tsx b/src/routes/chat/index.tsx index 98b3c574..7eca9ac4 100644 --- a/src/routes/chat/index.tsx +++ b/src/routes/chat/index.tsx @@ -1,7 +1,6 @@ // import React from 'react'; import { useState } from "react"; import { useParams } from "react-router-dom"; -import { useSelector } from "react-redux"; import StyledWrapper from "./styled"; import BlankPlaceholder from "../../common/component/BlankPlaceholder"; @@ -12,11 +11,12 @@ import DMChat from "./DMChat"; import UsersModal from "../../common/component/UsersModal"; import ChannelModal from "../../common/component/ChannelModal"; import SessionList from "./SessionList"; +import { useAppSelector } from "../../app/store"; export default function ChatPage() { const [channelModalVisible, setChannelModalVisible] = useState(false); const [usersModalVisible, setUsersModalVisible] = useState(false); const { channel_id, user_id } = useParams(); - const { sessionUids } = useSelector((store) => { + const { sessionUids } = useAppSelector((store) => { return { sessionUids: store.userMessage.ids }; @@ -48,7 +48,7 @@ export default function ChatPage() {
{placeholderVisible && } {channel_id && } - {user_id && } + {user_id && }
diff --git a/src/routes/chat/useSession.ts b/src/routes/chat/useSession.ts deleted file mode 100644 index a77f220c..00000000 --- a/src/routes/chat/useSession.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { useState } from "react"; -// import { useUpdateChannelMutation } from "../../app/services/channel"; -import { useUpdateMuteSettingMutation } from "../../app/services/user"; -import { useReadMessageMutation } from "../../app/services/message"; -import { useAppSelector } from "../../app/store"; - -export default function useSession({ type, id }) { - const [inviteModalVisible, setInviteModalVisible] = useState(false); - const [muteChannel] = useUpdateMuteSettingMutation(); - const [updateReadIndex] = useReadMessageMutation(); - const { messageData, userData, channelData } = useAppSelector((store) => { - return { - messageData: store.message, - userData: store.users.byId, - channelData: store.channels.byId - }; - }); - const toggleInviteModal = () => { - setInviteModalVisible((prev) => !prev); - }; - return { - inviteModalVisible, - toggleInviteModal - }; -} diff --git a/src/routes/home/index.tsx b/src/routes/home/index.tsx index 0d1527e7..2f72136a 100644 --- a/src/routes/home/index.tsx +++ b/src/routes/home/index.tsx @@ -6,7 +6,6 @@ import User from "./User"; import Loading from "../../common/component/Loading"; import Menu from "./Menu"; import usePreload from "./usePreload"; -import usePWABadge from "../../common/hook/usePWABadge"; import Tooltip from "../../common/component/Tooltip"; import Notification from "../../common/component/Notification"; import Manifest from "../../common/component/Manifest"; @@ -18,7 +17,6 @@ import FolderIcon from "../../assets/icons/folder.svg"; import { useAppSelector } from "../../app/store"; // const routes = ["/setting", "/setting/channel/:cid"]; export default function HomePage() { - usePWABadge(); const isHomePath = useMatch(`/`); const isChatHomePath = useMatch(`/chat`); const { pathname } = useLocation();