From c64906051d1fb2d8ebf1f4c25bcb894f05423cbd Mon Sep 17 00:00:00 2001
From: Paul <paulmakles@gmail.com>
Date: Fri, 24 Dec 2021 14:49:21 +0000
Subject: [PATCH] fix: hide new messages bar on click

---
 .../common/messaging/bars/NewMessages.tsx     | 49 ++++++++++---------
 1 file changed, 26 insertions(+), 23 deletions(-)

diff --git a/src/components/common/messaging/bars/NewMessages.tsx b/src/components/common/messaging/bars/NewMessages.tsx
index 483a1577..e4051d76 100644
--- a/src/components/common/messaging/bars/NewMessages.tsx
+++ b/src/components/common/messaging/bars/NewMessages.tsx
@@ -4,6 +4,8 @@ import { useHistory } from "react-router-dom";
 import { Channel } from "revolt.js/dist/maps/Channels";
 import { decodeTime } from "ulid";
 
+import { useEffect, useState } from "preact/hooks";
+
 import { getRenderer } from "../../../../lib/renderer/Singleton";
 
 import { dayjs } from "../../../../context/Locale";
@@ -12,36 +14,37 @@ import { Bar } from "./JumpToBottom";
 
 export default observer(
     ({ channel, last_id }: { channel: Channel; last_id?: string }) => {
+        const [hidden, setHidden] = useState(false);
+        useEffect(() => setHidden(false), [last_id]);
+
         const renderer = getRenderer(channel);
         const history = useHistory();
         if (renderer.state !== "RENDER") return null;
         if (!last_id) return null;
+        if (hidden) return null;
 
         return (
-            <>
-                <Bar position="top" accent>
-                    <div
-                        onClick={() => {
-                            if (channel.channel_type === "TextChannel") {
-                                history.push(
-                                    `/server/${channel.server_id}/channel/${channel._id}/${last_id}`,
-                                );
-                            } else {
-                                history.push(
-                                    `/channel/${channel._id}/${last_id}`,
-                                );
-                            }
-                        }}>
-                        <div>
-                            New messages since{" "}
-                            {dayjs(decodeTime(last_id)).fromNow()}
-                        </div>
-                        <div>
-                            Click to jump to start. <UpArrowAlt size={20} />
-                        </div>
+            <Bar position="top" accent>
+                <div
+                    onClick={() => {
+                        setHidden(true);
+                        if (channel.channel_type === "TextChannel") {
+                            history.push(
+                                `/server/${channel.server_id}/channel/${channel._id}/${last_id}`,
+                            );
+                        } else {
+                            history.push(`/channel/${channel._id}/${last_id}`);
+                        }
+                    }}>
+                    <div>
+                        New messages since{" "}
+                        {dayjs(decodeTime(last_id)).fromNow()}
                     </div>
-                </Bar>
-            </>
+                    <div>
+                        Click to jump to start. <UpArrowAlt size={20} />
+                    </div>
+                </div>
+            </Bar>
         );
     },
 );