refactor: rename contact with user

This commit is contained in:
Tristan Yang
2022-07-04 16:12:23 +08:00
parent 6083040e2b
commit 101dbdb5ee
76 changed files with 319 additions and 286 deletions
+4 -4
View File
@@ -11,7 +11,7 @@ import useMessageFeed from "../../../common/hook/useMessageFeed";
import useConfig from "../../../common/hook/useConfig";
import ChannelIcon from "../../../common/component/ChannelIcon";
import Tooltip from "../../../common/component/Tooltip";
import Contact from "../../../common/component/Contact";
import User from "../../../common/component/User";
import Layout from "../Layout";
import { renderMessageFragment } from "../utils";
import EditIcon from "../../../assets/icons/edit.svg";
@@ -66,7 +66,7 @@ export default function ChannelChat({ cid = "", dropFiles = [] }) {
footprint: store.footprint,
loginUser: store.authData.user,
// msgIds: store.channelMessage[cid] || [],
userIds: store.contacts.ids,
userIds: store.users.ids,
data: store.channels.byId[cid] || {},
messageData: store.message || {}
};
@@ -183,7 +183,7 @@ export default function ChannelChat({ cid = "", dropFiles = [] }) {
</div>
</StyledHeader>
}
contacts={
users={
membersVisible ? (
<>
<StyledContacts>
@@ -195,7 +195,7 @@ export default function ChannelChat({ cid = "", dropFiles = [] }) {
)}
{memberIds.map((uid) => {
return (
<Contact
<User
enableContextMenu={true}
cid={cid}
owner={owner == uid}
+1 -1
View File
@@ -11,7 +11,7 @@ import Tooltip from "../../../common/component/Tooltip";
import IconSetting from "../../../assets/icons/setting.svg";
import IconInvite from "../../../assets/icons/invite.from.channel.svg";
import { useReadMessageMutation } from "../../../app/services/message";
import { useUpdateMuteSettingMutation } from "../../../app/services/contact";
import { useUpdateMuteSettingMutation } from "../../../app/services/user";
import StyledLink from "./styled";
import ChannelIcon from "../../../common/component/ChannelIcon";
import { getUnreadCount } from "../utils";
+3 -3
View File
@@ -8,7 +8,7 @@ import FavIcon from "../../../assets/icons/bookmark.svg";
// import IconHeadphone from "../../../assets/icons/headphone.svg";
// import useChatScroll from "../../../common/hook/useChatScroll";
import { useReadMessageMutation } from "../../../app/services/message";
import Contact from "../../../common/component/Contact";
import User from "../../../common/component/User";
import Layout from "../Layout";
import { StyledHeader, StyledDMChat } from "./styled";
import LoadMore from "../LoadMore";
@@ -34,7 +34,7 @@ export default function DMChat({ uid = 0, dropFiles = [] }) {
selects: store.ui.selectMessages[`user_${uid}`],
loginUid: store.authData.user?.uid,
footprint: store.footprint,
currUser: store.contacts.byId[uid],
currUser: store.users.byId[uid],
messageData: store.message
};
});
@@ -81,7 +81,7 @@ export default function DMChat({ uid = 0, dropFiles = [] }) {
}
header={
<StyledHeader className="head">
<Contact interactive={false} uid={currUser.uid} />
<User interactive={false} uid={currUser.uid} />
</StyledHeader>
}
>
+3 -3
View File
@@ -14,7 +14,7 @@ import useContextMenu from "../../../common/hook/useContextMenu";
import ContextMenu from "../../../common/component/ContextMenu";
dayjs.extend(relativeTime);
import { renderPreviewMessage } from "../utils";
import Contact from "../../../common/component/Contact";
import User from "../../../common/component/User";
import { ContentTypes } from "../../../app/config";
const NavItem = ({ uid, mid, unreads, setFiles }) => {
const [previewMsg, setPreviewMsg] = useState(null);
@@ -24,7 +24,7 @@ const NavItem = ({ uid, mid, unreads, setFiles }) => {
const [updateReadIndex] = useReadMessageMutation();
const { currMsg, currUser } = useSelector((store) => {
return {
currUser: store.contacts.byId[uid],
currUser: store.users.byId[uid],
currMsg: store.message[mid]
};
});
@@ -107,7 +107,7 @@ const NavItem = ({ uid, mid, unreads, setFiles }) => {
to={`/chat/dm/${uid}`}
onContextMenu={handleContextMenuEvent}
>
<Contact compact interactive={false} className="avatar" uid={uid} />
<User compact interactive={false} className="avatar" uid={uid} />
<div className="details">
<div className="up">
<span className="name">{currUser.name}</span>
+1 -1
View File
@@ -13,7 +13,7 @@ const DMList: FC<Props> = ({ uids, setDropFiles }) => {
return {
loginUid: store.authData.user?.uid,
readUsers: store.footprint.readUsers,
contactData: store.contacts.byId,
userData: store.users.byId,
userMessage: store.userMessage.byId,
messageData: store.message
};
+6 -6
View File
@@ -13,7 +13,7 @@ interface Props {
children: ReactElement;
header: ReactElement;
aside: ReactElement | null;
contacts: ReactElement | null;
users: ReactElement | null;
dropFiles: [];
context: string;
to: number | null;
@@ -23,7 +23,7 @@ const Layout: FC<Props> = ({
children,
header,
aside = null,
contacts = null,
users = null,
dropFiles = [],
context = "channel",
to = null
@@ -31,11 +31,11 @@ const Layout: FC<Props> = ({
const { addStageFile } = useUploadFile({ context, id: to });
const messagesContainer = useRef<HTMLDivElement>(null);
const [previewImage, setPreviewImage] = useState(null);
const { selects, channelsData, contactsData } = useAppSelector((store) => {
const { selects, channelsData, usersData } = useAppSelector((store) => {
return {
selects: store.ui.selectMessages[`${context}_${to}`],
channelsData: store.channels.byId,
contactsData: store.contacts.byId
usersData: store.users.byId
};
});
const [{ isActive }, drop] = useDrop(
@@ -95,7 +95,7 @@ const Layout: FC<Props> = ({
);
}
}, []);
const name = context == "channel" ? channelsData[to]?.name : contactsData[to]?.name;
const name = context == "channel" ? channelsData[to]?.name : usersData[to]?.name;
return (
<>
@@ -110,7 +110,7 @@ const Layout: FC<Props> = ({
{selects && <Operations context={context} id={to} />}
</div>
</div>
{contacts && <div className="members">{contacts}</div>}
{users && <div className="members">{users}</div>}
{aside && <div className="aside">{aside}</div>}
</main>
<div className={`drag_tip ${isActive ? "visible animate__animated animate__fadeIn" : ""}`}>
+1 -1
View File
@@ -1,7 +1,7 @@
import Tippy from "@tippyjs/react";
import { useDispatch, useSelector } from "react-redux";
import { useNavigate, useLocation, useMatch } from "react-router-dom";
import { useUpdateMuteSettingMutation } from "../../../app/services/contact";
import { useUpdateMuteSettingMutation } from "../../../app/services/user";
import { useReadMessageMutation } from "../../../app/services/message";
import { removeUserSession } from "../../../app/slices/message.user";
import ContextMenu from "../../../common/component/ContextMenu";
+6 -6
View File
@@ -6,7 +6,7 @@ import { NativeTypes } from "react-dnd-html5-backend";
import relativeTime from "dayjs/plugin/relativeTime";
import ContextMenu from "./ContextMenu";
import getUnreadCount, { renderPreviewMessage } from "../utils";
import Contact from "../../../common/component/Contact";
import User from "../../../common/component/User";
import Avatar from "../../../common/component/Avatar";
import iconChannel from "../../../assets/icons/channel.svg?url";
import IconLock from "../../../assets/icons/lock.svg";
@@ -51,7 +51,7 @@ export default function Session({
const { visible: contextMenuVisible, handleContextMenuEvent, hideContextMenu } = useContextMenu();
const [data, setData] = useState(null);
const { messageData, contactData, channelData, readIndex, loginUid, mids, muted } = useSelector(
const { messageData, userData, channelData, readIndex, loginUid, mids, muted } = useSelector(
(store) => {
return {
mids: type == "user" ? store.userMessage.byId[id] : store.channelMessage[id],
@@ -59,7 +59,7 @@ export default function Session({
readIndex:
type == "user" ? store.footprint.readUsers[id] : store.footprint.readChannels[id],
messageData: store.message,
contactData: store.contacts.byId,
userData: store.users.byId,
channelData: store.channels.byId,
muted: type == "user" ? store.footprint.muteUsers[id] : store.footprint.muteChannels[id]
};
@@ -72,13 +72,13 @@ export default function Session({
};
useEffect(() => {
const tmp = type == "user" ? contactData[id] : channelData[id];
const tmp = type == "user" ? userData[id] : channelData[id];
if (!tmp) return;
const { name, icon, avatar, is_public = true } = tmp;
const session =
type == "user" ? { name, icon: avatar, mid, is_public } : { name, icon, mid, is_public };
setData(session);
}, [id, mid, type, contactData, channelData]);
}, [id, mid, type, userData, channelData]);
if (!data) return null;
const previewMsg = messageData[mid] || {};
const { name, icon, is_public } = data;
@@ -108,7 +108,7 @@ export default function Session({
>
<div className="icon">
{type == "user" ? (
<Contact avatarSize={40} compact interactive={false} className="avatar" uid={id} />
<User avatarSize={40} compact interactive={false} className="avatar" uid={id} />
) : (
<Avatar className="icon" type="channel" name={name} url={icon} />
// <img
+4 -4
View File
@@ -10,12 +10,12 @@ import AddIcon from "../../assets/icons/add.svg";
import BlankPlaceholder from "../../common/component/BlankPlaceholder";
import Server from "../../common/component/Server";
import Tooltip from "../../common/component/Tooltip";
// import Contact from "../../common/component/Contact";
// import User from "../../common/component/User";
// import CurrentUser from "../../common/component/CurrentUser";
import ChannelChat from "./ChannelChat";
import DMChat from "./DMChat";
import ChannelList from "./ChannelList";
import ContactsModal from "../../common/component/ContactsModal";
import ContactsModal from "../../common/component/UsersModal";
import ChannelModal from "../../common/component/ChannelModal";
import DMList from "./DMList";
@@ -28,7 +28,7 @@ export default function ChatPage() {
};
});
const [channelModalVisible, setChannelModalVisible] = useState(false);
const [contactsModalVisible, setContactsModalVisible] = useState(false);
const [usersModalVisible, setContactsModalVisible] = useState(false);
const { channel_id, user_id } = useParams();
const toggleContactsModalVisible = () => {
setContactsModalVisible((prev) => !prev);
@@ -49,7 +49,7 @@ export default function ChatPage() {
{channelModalVisible && (
<ChannelModal closeModal={toggleChannelModalVisible} personal={true} />
)}
{contactsModalVisible && <ContactsModal closeModal={toggleContactsModalVisible} />}
{usersModalVisible && <ContactsModal closeModal={toggleContactsModalVisible} />}
<StyledWrapper>
<div className="left">
<Server />
+3 -3
View File
@@ -9,12 +9,12 @@ import Server from "../../common/component/Server";
import CurrentUser from "../../common/component/CurrentUser";
import ChannelChat from "./ChannelChat";
import DMChat from "./DMChat";
import ContactsModal from "../../common/component/ContactsModal";
import ContactsModal from "../../common/component/UsersModal";
import ChannelModal from "../../common/component/ChannelModal";
import SessionList from "./SessionList";
export default function ChatPage() {
const [channelModalVisible, setChannelModalVisible] = useState(false);
const [contactsModalVisible, setContactsModalVisible] = useState(false);
const [usersModalVisible, setContactsModalVisible] = useState(false);
const { channel_id, user_id } = useParams();
const { sessionUids } = useSelector((store) => {
return {
@@ -38,7 +38,7 @@ export default function ChatPage() {
{channelModalVisible && (
<ChannelModal closeModal={toggleChannelModalVisible} personal={true} />
)}
{contactsModalVisible && <ContactsModal closeModal={toggleContactsModalVisible} />}
{usersModalVisible && <ContactsModal closeModal={toggleContactsModalVisible} />}
<StyledWrapper>
<div className="left">
<Server />
+3 -3
View File
@@ -1,6 +1,6 @@
import { useState } from "react";
// import { useUpdateChannelMutation } from "../../app/services/channel";
import { useUpdateMuteSettingMutation } from "../../app/services/contact";
import { useUpdateMuteSettingMutation } from "../../app/services/user";
import { useReadMessageMutation } from "../../app/services/message";
import { useAppSelector } from "../../app/store";
@@ -8,10 +8,10 @@ export default function useSession({ type, id }) {
const [inviteModalVisible, setInviteModalVisible] = useState(false);
const [muteChannel] = useUpdateMuteSettingMutation();
const [updateReadIndex] = useReadMessageMutation();
const { messageData, contactData, channelData } = useAppSelector((store) => {
const { messageData, userData, channelData } = useAppSelector((store) => {
return {
messageData: store.message,
contactData: store.contacts.byId,
userData: store.users.byId,
channelData: store.channels.byId
};
});