feat: not show unread count while in session

This commit is contained in:
Tristan Yang
2023-03-09 20:13:30 +08:00
parent afb90515db
commit 2f8e2181fa
+6 -4
View File
@@ -3,7 +3,7 @@ import { useState, useEffect, FC } from "react";
import clsx from "clsx"; import clsx from "clsx";
import { useDrop } from "react-dnd"; import { useDrop } from "react-dnd";
import { NativeTypes } from "react-dnd-html5-backend"; import { NativeTypes } from "react-dnd-html5-backend";
import { useNavigate, NavLink } from "react-router-dom"; import { useNavigate, NavLink, useMatch } from "react-router-dom";
import ContextMenu from "./ContextMenu"; import ContextMenu from "./ContextMenu";
import getUnreadCount, { renderPreviewMessage } from "../utils"; import getUnreadCount, { renderPreviewMessage } from "../utils";
import User from "../../../common/component/User"; import User from "../../../common/component/User";
@@ -28,6 +28,9 @@ const Session: FC<IProps> = ({
setDeleteChannelId, setDeleteChannelId,
setInviteChannelId setInviteChannelId
}) => { }) => {
const navPath = type == "user" ? `/chat/dm/${id}` : `/chat/channel/${id}`;
// const { pathname } = useLocation();
const isCurrentPath = useMatch(navPath);
const navigate = useNavigate(); const navigate = useNavigate();
const { addStageFile } = useUploadFile({ context: type, id }); const { addStageFile } = useUploadFile({ context: type, id });
@@ -51,7 +54,6 @@ const Session: FC<IProps> = ({
}), }),
[type, id] [type, id]
); );
const { visible: contextMenuVisible, handleContextMenuEvent, hideContextMenu } = useContextMenu(); const { visible: contextMenuVisible, handleContextMenuEvent, hideContextMenu } = useContextMenu();
const [data, setData] = useState<{ const [data, setData] = useState<{
name: string; name: string;
@@ -110,7 +112,7 @@ const Session: FC<IProps> = ({
<NavLink <NavLink
ref={drop} ref={drop}
className={({ isActive: linkActive }) => clsx(`nav flex gap-2 rounded-lg p-2 w-full md:hover:bg-gray-500/20`, isActive && "shadow-[inset_0_0_0_2px_#52edff]", linkActive && "bg-gray-500/20")} className={({ isActive: linkActive }) => clsx(`nav flex gap-2 rounded-lg p-2 w-full md:hover:bg-gray-500/20`, isActive && "shadow-[inset_0_0_0_2px_#52edff]", linkActive && "bg-gray-500/20")}
to={type == "user" ? `/chat/dm/${id}` : `/chat/channel/${id}`} to={navPath}
onContextMenu={handleContextMenuEvent} onContextMenu={handleContextMenuEvent}
> >
<div className="flex shrink-0"> <div className="flex shrink-0">
@@ -141,7 +143,7 @@ const Session: FC<IProps> = ({
</div> </div>
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<span className={clsx("text-xs text-gray-500 dark:text-gray-400 truncate", unreads > 0 ? `w-36` : ``)}>{renderPreviewMessage(previewMsg)}</span> <span className={clsx("text-xs text-gray-500 dark:text-gray-400 truncate", unreads > 0 ? `w-36` : ``)}>{renderPreviewMessage(previewMsg)}</span>
{unreads > 0 && ( {unreads > 0 && !isCurrentPath && (
<strong className={clsx(`text-white h-5 min-w-[20px] bg-primary-400 font-bold text-[10px] rounded-[10px] flex-center`, unreads > 99 && 'w-1.5 !h-1.5 p-0 min-w-[unset]', muted && "bg-gray-500")}> <strong className={clsx(`text-white h-5 min-w-[20px] bg-primary-400 font-bold text-[10px] rounded-[10px] flex-center`, unreads > 99 && 'w-1.5 !h-1.5 p-0 min-w-[unset]', muted && "bg-gray-500")}>
{unreads > 99 ? null : unreads} {unreads > 99 ? null : unreads}
</strong> </strong>