fix(unreads): allow dynamic unread changes

This commit is contained in:
Paul Makles 2022-01-15 12:52:11 +00:00
parent 200db35c25
commit 8bda3123da
2 changed files with 24 additions and 9 deletions

View file

@ -30,3 +30,4 @@ export function internalEmit(ns: string, event: string, ...args: unknown[]) {
// - Modal/close // - Modal/close
// - PWA/update // - PWA/update
// - NewMessages/hide // - NewMessages/hide
// - NewMessages/mark

View file

@ -7,9 +7,10 @@ import { Channel as ChannelI } from "revolt.js/dist/maps/Channels";
import styled from "styled-components/macro"; import styled from "styled-components/macro";
import { Text } from "preact-i18n"; import { Text } from "preact-i18n";
import { useEffect, useMemo } from "preact/hooks"; import { useEffect, useState } from "preact/hooks";
import ErrorBoundary from "../../lib/ErrorBoundary"; import ErrorBoundary from "../../lib/ErrorBoundary";
import { internalSubscribe } from "../../lib/eventEmitter";
import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice"; import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
import { useApplicationState } from "../../mobx/State"; import { useApplicationState } from "../../mobx/State";
@ -123,17 +124,30 @@ export function Channel({ id, server_id }: { id: string; server_id: string }) {
const TextChannel = observer(({ channel }: { channel: ChannelI }) => { const TextChannel = observer(({ channel }: { channel: ChannelI }) => {
const layout = useApplicationState().layout; const layout = useApplicationState().layout;
// Cache the unread location. // Store unread location.
const last_id = useMemo( const [lastId, setLastId] = useState<string | undefined>(undefined);
useEffect(
() => () =>
(channel.unread internalSubscribe("NewMessages", "hide", () =>
? channel.client.unreads?.getUnread(channel._id)?.last_id setLastId(undefined),
: undefined) ?? undefined, ),
[channel], [],
);
useEffect(
() => internalSubscribe("NewMessages", "mark", setLastId as any),
[],
); );
// Mark channel as read. // Mark channel as read.
useEffect(() => { useEffect(() => {
setLastId(
channel.unread
? channel.client.unreads?.getUnread(channel._id)?.last_id
: undefined ?? undefined,
);
const checkUnread = () => const checkUnread = () =>
channel.unread && channel.unread &&
channel.client.unreads!.markRead( channel.client.unreads!.markRead(
@ -165,8 +179,8 @@ const TextChannel = observer(({ channel }: { channel: ChannelI }) => {
<ErrorBoundary section="renderer"> <ErrorBoundary section="renderer">
<ChannelContent> <ChannelContent>
<VoiceHeader id={channel._id} /> <VoiceHeader id={channel._id} />
<NewMessages channel={channel} last_id={last_id} /> <NewMessages channel={channel} last_id={lastId} />
<MessageArea channel={channel} last_id={last_id} /> <MessageArea channel={channel} last_id={lastId} />
<TypingIndicator channel={channel} /> <TypingIndicator channel={channel} />
<JumpToBottom channel={channel} /> <JumpToBottom channel={channel} />
<MessageBox channel={channel} /> <MessageBox channel={channel} />