Fixes #9 and closes #8. This adds a way to mark servers as read.

Servers are also marked as read when joining them.
You can now also mark DMs as read.

src/components/navigation/items/ButtonItem.tsx

@@ -114,7 +114,7 @@ export const UserButton = observer((props: UserProps) => {
 });
 
 type ChannelProps = CommonProps & {
-    channel: Channel & { unread?: string };
+    channel: Channel;
     user?: User;
     compact?: boolean;
 };
@@ -140,7 +140,7 @@ export const ChannelButton = observer((props: ChannelProps) => {
             className={classNames(styles.item, { [styles.compact]: compact })}
             onContextMenu={attachContextMenu("Menu", {
                 channel: channel._id,
-                unread: typeof channel.unread !== "undefined",
+                unread: typeof alert !== "undefined",
             })}>
             <ChannelIcon
                 className={styles.avatar}

src/components/navigation/left/ServerListSidebar.tsx

@@ -288,6 +288,7 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
                                 active={active}
                                 onContextMenu={attachContextMenu("Menu", {
                                     server: entry.server._id,
+                                    unread: entry.unread,
                                 })}>
                                 <Swoosh />
                                 <Tooltip

src/lib/ContextMenus.tsx

@@ -75,6 +75,7 @@ type Action =
     | { action: "copy_selection" }
     | { action: "copy_text"; content: string }
     | { action: "mark_as_read"; channel: Channel }
+    | { action: "mark_server_as_read"; server: Server }
     | { action: "retry_message"; message: QueuedMessage }
     | { action: "cancel_message"; message: QueuedMessage }
     | { action: "mention"; user: string }
@@ -178,10 +179,17 @@ function ContextMenus(props: Props) {
                             message,
                         });
 
-                        client.req(
-                            "PUT",
-                            `/channels/${data.channel._id}/ack/${message}` as "/channels/id/ack/id",
-                        );
+                        data.channel.ack(message);
+                    }
+                    break;
+                case "mark_server_as_read":
+                    {
+                        dispatch({
+                            type: "UNREADS_MARK_MULTIPLE_READ",
+                            channels: data.server.channel_ids,
+                        });
+
+                        data.server.ack();
                     }
                     break;
 
@@ -547,6 +555,16 @@ function ContextMenus(props: Props) {
                         generateAction({ action: "mark_as_read", channel });
                     }
 
+                    if (server && unread) {
+                        generateAction(
+                            {
+                                action: "mark_server_as_read",
+                                server,
+                            },
+                            "mark_as_read",
+                        );
+                    }
+
                     if (contextualChannel) {
                         if (user && user._id !== userId) {
                             generateAction({

src/pages/invite/Invite.tsx

@@ -10,6 +10,8 @@ import { useContext, useEffect, useState } from "preact/hooks";
 import { defer } from "../../lib/defer";
 import { TextReact } from "../../lib/i18n";
 
+import { dispatch } from "../../redux";
+
 import RequiresOnline from "../../context/revoltjs/RequiresOnline";
 import {
     AppContext,
@@ -134,6 +136,12 @@ export default function Invite() {
 
                                             defer(() => {
                                                 if (server) {
+                                                    dispatch({
+                                                        type: "UNREADS_MARK_MULTIPLE_READ",
+                                                        channels:
+                                                            server.channel_ids,
+                                                    });
+
                                                     history.push(
                                                         `/server/${server._id}/channel/${invite.channel_id}`,
                                                     );

src/redux/reducers/unreads.ts

@@ -1,4 +1,5 @@
 import type { ChannelUnread } from "revolt-api/types/Sync";
+import { ulid } from "ulid";
 
 export interface Unreads {
     [key: string]: Partial<Omit<ChannelUnread, "_id">>;
@@ -11,6 +12,10 @@ export type UnreadsAction =
           channel: string;
           message: string;
       }
+    | {
+          type: "UNREADS_MARK_MULTIPLE_READ";
+          channels: string[];
+      }
     | {
           type: "UNREADS_SET";
           unreads: ChannelUnread[];
@@ -33,6 +38,17 @@ export function unreads(state = {} as Unreads, action: UnreadsAction): Unreads {
                     last_id: action.message,
                 },
             };
+        case "UNREADS_MARK_MULTIPLE_READ": {
+            const newState = { ...state };
+            const last_id = ulid();
+            for (const channel of action.channels) {
+                newState[channel] = {
+                    last_id,
+                };
+            }
+
+            return newState;
+        }
         case "UNREADS_SET": {
             const obj: Unreads = {};
             for (const entry of action.unreads) {