Make the linter happy.

src/components/navigation/left/HomeSidebar.tsx

@@ -148,6 +148,7 @@ const HomeSidebar = observer((props: Props) => {
 
                     return (
                         <ConditionalLink
+                            key={x.channel._id}
                             active={x.channel._id === channel}
                             to={`/channel/${x.channel._id}`}>
                             <ChannelButton

src/components/navigation/left/ServerListSidebar.tsx

@@ -279,6 +279,7 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
 
                     return (
                         <ConditionalLink
+                            key={entry.server._id}
                             active={active}
                             to={`/server/${entry.server._id}${
                                 id ? `/channel/${id}` : ""

src/components/navigation/left/ServerSidebar.tsx

@@ -7,11 +7,11 @@ import { useEffect } from "preact/hooks";
 
 import ConditionalLink from "../../../lib/ConditionalLink";
 import PaintCounter from "../../../lib/PaintCounter";
+import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
 
 import { dispatch } from "../../../redux";
 import { connectState } from "../../../redux/connector";
 import { Unreads } from "../../../redux/reducers/unreads";
-import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
 
 import { useClient } from "../../../context/revoltjs/RevoltClient";
 
@@ -38,9 +38,9 @@ const ServerBase = styled.div`
     overflow: hidden;
 
     ${isTouchscreenDevice &&
-        css`
-            padding-bottom: 50px;
-        `}
+    css`
+        padding-bottom: 50px;
+    `}
 `;
 
 const ServerList = styled.div`
@@ -73,7 +73,7 @@ const ServerSidebar = observer((props: Props) => {
             parent: server_id!,
             child: channel_id!,
         });
-    }, [channel_id]);
+    }, [channel_id, server_id]);
 
     const uncategorised = new Set(server.channel_ids);
     const elements = [];

src/components/navigation/left/common.ts

@@ -1,4 +1,4 @@
-import { autorun, isObservableProp, reaction } from "mobx";
+import { reaction } from "mobx";
 import { Channel } from "revolt.js/dist/maps/Channels";
 
 import { useLayoutEffect } from "preact/hooks";
@@ -6,16 +6,12 @@ import { useLayoutEffect } from "preact/hooks";
 import { dispatch } from "../../../redux";
 import { Unreads } from "../../../redux/reducers/unreads";
 
-import { useClient } from "../../../context/revoltjs/RevoltClient";
-
 type UnreadProps = {
     channel: Channel;
     unreads: Unreads;
 };
 
 export function useUnreads({ channel, unreads }: UnreadProps) {
-    const client = useClient();
-
     useLayoutEffect(() => {
         function checkUnread(target: Channel) {
             if (!target) return;

src/components/navigation/right/ChannelDebugInfo.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable react-hooks/rules-of-hooks */
 import { useRenderState } from "../../../lib/renderer/Singleton";
 
 interface Props {

src/components/navigation/right/MemberSidebar.tsx

@@ -1,11 +1,9 @@
+/* eslint-disable react-hooks/rules-of-hooks */
 import { observer } from "mobx-react-lite";
 import { Link, useParams } from "react-router-dom";
 import { Presence } from "revolt-api/types/Users";
 import { Channel } from "revolt.js/dist/maps/Channels";
-import Members, { Member } from "revolt.js/dist/maps/Members";
 import { Message } from "revolt.js/dist/maps/Messages";
-import { User } from "revolt.js/dist/maps/Users";
-import { ClientboundNotification } from "revolt.js/dist/websocket/notifications";
 
 import { Text } from "preact-i18n";
 import { useContext, useEffect, useState } from "preact/hooks";
@@ -14,7 +12,6 @@ import { getState } from "../../../redux";
 
 import { useIntermediate } from "../../../context/intermediate/Intermediate";
 import {
-    AppContext,
     ClientStatus,
     StatusContext,
     useClient,
@@ -50,7 +47,6 @@ export const GroupMemberSidebar = observer(
     ({ channel }: { channel: Channel }) => {
         const { openScreen } = useIntermediate();
 
-        const client = useClient();
         const members = channel.recipients?.filter(
             (x) => typeof x !== "undefined",
         );
@@ -173,9 +169,9 @@ export const ServerMemberSidebar = observer(
             if (status === ClientStatus.ONLINE) {
                 channel.server!.fetchMembers();
             }
-        }, [status]);
+        }, [status, channel.server]);
 
-        let users = [...client.members.keys()]
+        const users = [...client.members.keys()]
             .map((x) => JSON.parse(x))
             .filter((x) => x.server === channel.server_id)
             .map((y) => client.users.get(y.user)!)
@@ -247,7 +243,6 @@ export const ServerMemberSidebar = observer(
 function Search({ channel }: { channel: Channel }) {
     if (!getState().experiments.enabled?.includes("search")) return null;
 
-    const client = useContext(AppContext);
     type Sort = "Relevance" | "Latest" | "Oldest";
     const [sort, setSort] = useState<Sort>("Relevance");
 
@@ -272,6 +267,7 @@ function Search({ channel }: { channel: Channel }) {
             <div style={{ display: "flex" }}>
                 {["Relevance", "Latest", "Oldest"].map((key) => (
                     <Button
+                        key={key}
                         style={{ flex: 1, minWidth: 0 }}
                         compact
                         error={sort === key}
@@ -304,7 +300,7 @@ function Search({ channel }: { channel: Channel }) {
                     href += `/channel/${message.channel_id}/${message._id}`;
 
                     return (
-                        <Link to={href}>
+                        <Link to={href} key={message._id}>
                             <div
                                 style={{
                                     margin: "2px",