diff --git a/src/components/navigation/items/ButtonItem.tsx b/src/components/navigation/items/ButtonItem.tsx
index 42792b7b46cfdcd27261cb57e77566c1bed14ef4..d4e1982073ef5a94c8280b5a99e2a7dbad09b755 100644
--- a/src/components/navigation/items/ButtonItem.tsx
+++ b/src/components/navigation/items/ButtonItem.tsx
@@ -12,6 +12,7 @@ import { attachContextMenu } from 'preact-context-menu';
 import { Channels, Users } from "revolt.js/dist/api/objects";
 import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
 import { useIntermediate } from '../../../context/intermediate/Intermediate';
+import { stopPropagation } from '../../../lib/stopPropagation';
 
 interface CommonProps {
     active?: boolean
@@ -70,9 +71,8 @@ export function UserButton({ active, alert, alertCount, user, context, channel }
                 )}
                 {alert && <div className={styles.alert} data-style={alert}>{ alertCount }</div>}
                 { !isTouchscreenDevice && channel &&
-                    <IconButton
-                        className={styles.icon}
-                        onClick={() => openScreen({ id: 'special_prompt', type: 'close_dm', target: channel })}>
+                    <IconButton className={styles.icon}
+                        onClick={e => stopPropagation(e) && openScreen({ id: 'special_prompt', type: 'close_dm', target: channel })}>
                         <X size={24} />
                     </IconButton>
                 }
diff --git a/src/components/navigation/left/HomeSidebar.tsx b/src/components/navigation/left/HomeSidebar.tsx
index c0e657e0bbc1cd8601eb030254ee7260153c6716..d9ea7190e1e5c946199caeb2c5dfd7bff4c74142 100644
--- a/src/components/navigation/left/HomeSidebar.tsx
+++ b/src/components/navigation/left/HomeSidebar.tsx
@@ -117,8 +117,11 @@ function HomeSidebar(props: Props) {
                 {channelsArr.map(x => {
                     let user;
                     if (x.channel_type === 'DirectMessage') {
+                        if (!x.active) return null;
+
                         let recipient = client.channels.getRecipient(x._id);
                         user = users.find(x => x?._id === recipient);
+
                         if (!user) {
                             console.warn(`Skipped DM ${x._id} because user was missing.`);
                             return null;
diff --git a/src/components/ui/Modal.tsx b/src/components/ui/Modal.tsx
index 26197b2be66eb5ab2537d3c215648815b7ad443e..2faecdec31c32a9c868b2835bd86fb66c06a3900 100644
--- a/src/components/ui/Modal.tsx
+++ b/src/components/ui/Modal.tsx
@@ -98,6 +98,7 @@ interface Props {
     disallowClosing?: boolean;
     noBackground?: boolean;
     dontModal?: boolean;
+    padding?: boolean;
 
     onClose: () => void;
     actions?: Action[];
@@ -114,7 +115,7 @@ export default function Modal(props: Props) {
             attachment={!!props.actions}
             noBackground={props.noBackground}
             border={props.border}
-            padding={!props.dontModal}>
+            padding={props.padding ?? !props.dontModal}>
             {props.title && <h3>{props.title}</h3>}
             {props.children}
         </ModalContent>
@@ -124,6 +125,19 @@ export default function Modal(props: Props) {
         return content;
     }
 
+    useEffect(() => {
+        if (props.disallowClosing) return;
+
+        function keyDown(e: KeyboardEvent) {
+            if (e.key === "Escape") {
+                props.onClose();
+            }
+        }
+
+        document.body.addEventListener("keydown", keyDown);
+        return () => document.body.removeEventListener("keydown", keyDown);
+    }, [ props.disallowClosing, props.onClose ]);
+
     let confirmationAction = props.actions?.find(action => action.confirmation);
     useEffect(() => {
         if (!confirmationAction) return;
diff --git a/src/context/intermediate/popovers/ImageViewer.tsx b/src/context/intermediate/popovers/ImageViewer.tsx
index e42d6ca1e3d1e2fe426b816fda364c8260983b58..d0cf0cfc1dedbb6f4b987f01ceea74536bed29b6 100644
--- a/src/context/intermediate/popovers/ImageViewer.tsx
+++ b/src/context/intermediate/popovers/ImageViewer.tsx
@@ -22,17 +22,6 @@ export function ImageViewer({ attachment, embed, onClose }: Props) {
     if (attachment && attachment.metadata.type !== "Image") return null;
     const client = useContext(AppContext);
 
-    useEffect(() => {
-        function keyDown(e: KeyboardEvent) {
-            if (e.key === "Escape") {
-                onClose();
-            }
-        }
-
-        document.body.addEventListener("keydown", keyDown);
-        return () => document.body.removeEventListener("keydown", keyDown);
-    }, []);
-
     return (
         <Modal visible={true} onClose={onClose} noBackground>
             <div className={styles.viewer}>
diff --git a/src/context/intermediate/popovers/UserProfile.tsx b/src/context/intermediate/popovers/UserProfile.tsx
index 385829a7f464d91a1f7ab401cbe8990e3fd683de..afcc83451539e99eeb5738f991abb570ca55ef5e 100644
--- a/src/context/intermediate/popovers/UserProfile.tsx
+++ b/src/context/intermediate/popovers/UserProfile.tsx
@@ -116,12 +116,11 @@ export function UserProfile({ user_id, onClose, dummy, dummyProfile }: Props) {
     const badges = (user.badges ?? 0) | (decodeTime(user._id) < 1623751765790 ? Badges.EarlyAdopter : 0);
 
     return (
-        <Modal
-            visible
+        <Modal visible
             border={dummy}
+            padding={false}
             onClose={onClose}
-            dontModal={dummy}
-        >
+            dontModal={dummy}>
             <div
                 className={styles.header}
                 data-force={
diff --git a/src/context/revoltjs/hooks.ts b/src/context/revoltjs/hooks.ts
index bb11295187992b13b664e24fb1f9f8734ec5f8a8..987a9d53f1fc20fcfeb214765d4f837968b74038 100644
--- a/src/context/revoltjs/hooks.ts
+++ b/src/context/revoltjs/hooks.ts
@@ -19,7 +19,6 @@ export function useForceUpdate(context?: HookContext): HookContext {
         updateState = u;
     } else {
         console.warn('Failed to construct using useState.');
-        console.warn(H);
         updateState = ()=>{};
     }
 
@@ -85,7 +84,7 @@ export function useDMs(context?: HookContext) {
     function mutation(target: string) {
         let channel = ctx.client.channels.get(target);
         if (channel) {
-            if ((channel.channel_type === 'DirectMessage' && channel.active) || channel.channel_type === 'Group') {
+            if (channel.channel_type === 'DirectMessage' || channel.channel_type === 'Group') {
                 ctx.forceUpdate();
             }
         }
@@ -99,7 +98,7 @@ export function useDMs(context?: HookContext) {
 
     return map
         .toArray()
-        .filter(x => (x.channel_type === 'DirectMessage' && x.active) || x.channel_type === 'Group' || x.channel_type === 'SavedMessages') as (Channels.GroupChannel | Channels.DirectMessageChannel | Channels.SavedMessagesChannel)[];
+        .filter(x => x.channel_type === 'DirectMessage' || x.channel_type === 'Group' || x.channel_type === 'SavedMessages') as (Channels.GroupChannel | Channels.DirectMessageChannel | Channels.SavedMessagesChannel)[];
 }
 
 export function useUserPermission(id: string, context?: HookContext) {
diff --git a/src/lib/stopPropagation.ts b/src/lib/stopPropagation.ts
index 98c9fa60450edf28b6846036eb981c17860dc03c..df4d95337e7ea16b311b07137f5f4d7df1fe6cb1 100644
--- a/src/lib/stopPropagation.ts
+++ b/src/lib/stopPropagation.ts
@@ -1,4 +1,5 @@
 export const stopPropagation = (ev: JSX.TargetedMouseEvent<HTMLDivElement>, _consume?: any) => {
     ev.preventDefault();
     ev.stopPropagation();
+    return true;
 };