diff --git a/public/locales/en/chat.json b/public/locales/en/chat.json index 130577b2..0b483f42 100644 --- a/public/locales/en/chat.json +++ b/public/locales/en/chat.json @@ -18,6 +18,7 @@ "create_channel_desc": "This is a public channel, everyone in this team can see it.", "create_private_channel_desc": "This is a private channel, only select members will be able to join.", "search_user_placeholder": "Type Username to search", + "welcome_msg": "Welcome to channel {{name}}", "invite_title": "Add friends to {{name}}", "invite_by_email": "Invite by Email", diff --git a/public/locales/zh/chat.json b/public/locales/zh/chat.json index dbe937b3..b95ad249 100644 --- a/public/locales/zh/chat.json +++ b/public/locales/zh/chat.json @@ -18,6 +18,7 @@ "create_channel_desc": "这是一个公开频道,所有人都能看到", "create_private_channel_desc": "这是一个私密频道,只有被选择的人才能看到", "search_user_placeholder": "请输入用户名", + "welcome_msg": "欢迎来到 {{name}} 频道", "invite_title": "邀请朋友加入{{name}}", "invite_by_email": "邮件邀请", diff --git a/src/common/component/ChannelModal/index.tsx b/src/common/component/ChannelModal/index.tsx index 69d05a69..10b27145 100644 --- a/src/common/component/ChannelModal/index.tsx +++ b/src/common/component/ChannelModal/index.tsx @@ -1,6 +1,9 @@ import { useState, useEffect, FC, MouseEvent, ChangeEvent } from "react"; import toast from "react-hot-toast"; import { useNavigate } from "react-router-dom"; +import { useTranslation } from "react-i18next"; +import clsx from "clsx"; + import Modal from "../Modal"; import Button from "../styled/Button"; import ChannelIcon from "../ChannelIcon"; @@ -8,11 +11,10 @@ import User from "../User"; import StyledCheckbox from "../styled/Checkbox"; import StyledToggle from "../../component/styled/Toggle"; import useFilteredUsers from "../../hook/useFilteredUsers"; -import { useCreateChannelMutation } from "../../../app/services/channel"; +import { useCreateChannelMutation, useSendChannelMsgMutation } from "../../../app/services/channel"; import { useAppSelector } from "../../../app/store"; import { CreateChannelDTO } from "../../../types/channel"; -import { useTranslation } from "react-i18next"; -import clsx from "clsx"; +import i18n from "../../../i18n"; interface Props { personal?: boolean; @@ -21,14 +23,15 @@ interface Props { const ChannelModal: FC = ({ personal = false, closeModal }) => { const { t } = useTranslation("chat"); - const { usersData, loginUid } = useAppSelector((store) => { - return { usersData: store.users.byId, loginUid: store.authData.user?.uid }; - }); const navigateTo = useNavigate(); + const [sendMessage] = useSendChannelMsgMutation(); + const { loginUser, channelData } = useAppSelector((store) => { + return { loginUser: store.authData.user, channelData: store.channels.byId }; + }); const [data, setData] = useState({ name: "", description: "", - members: loginUid ? [Number(loginUid)] : [], + members: loginUser?.uid ? [loginUser.uid] : [], is_public: !personal }); @@ -63,13 +66,18 @@ const ChannelModal: FC = ({ personal = false, closeModal }) => { }, [isError]); useEffect(() => { - if (isSuccess && newChannel) { - toast.success("create new channel success"); + const id = typeof newChannel == 'object' ? newChannel.gid : newChannel; + if (isSuccess && id && channelData[id]) { + const name = channelData[id].name; + // 发个欢迎消息 + const welcome = i18n.t("welcome_msg", { ns: "chat", name }) ?? ""; + sendMessage({ id, content: welcome, from_uid: loginUser?.uid, type: "text" }); closeModal(); - const id = typeof newChannel == 'object' ? newChannel.gid : newChannel; + toast.success("create new channel success"); navigateTo(`/chat/channel/${id}`); } - }, [isSuccess, newChannel]); + }, [isSuccess, newChannel, channelData]); + const handleNameInput = (evt: ChangeEvent) => { setData((prev) => ({ ...prev, name: evt.target.value })); @@ -87,11 +95,9 @@ const ChannelModal: FC = ({ personal = false, closeModal }) => { setData((prev) => ({ ...prev, members: tmp })); }; - if (!loginUid) return null; - const loginUser = usersData[Number(loginUid)]; if (!loginUser) return null; const { name, members, is_public } = data; - + const loginUid = loginUser.uid; return (