From 70969ac64c4cf2811be9aa2f8510e3d831f2533c Mon Sep 17 00:00:00 2001
From: David Roetzel <david@roetzel.de>
Date: Mon, 15 Jul 2024 15:42:47 +0200
Subject: [PATCH] [Glitch] Move filtered notifications bar in scrollable area

Port 9d0bce40724eb77b7cc3917091b62e4ab159e29e to glitch-soc

Co-authored-by: Claire <claire.github-309c@sitedethib.com>
Signed-off-by: Claire <claire.github-309c@sitedethib.com>
---
 .../flavours/glitch/features/notifications/index.jsx  | 11 ++++++++---
 app/javascript/flavours/glitch/styles/components.scss |  3 +--
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/app/javascript/flavours/glitch/features/notifications/index.jsx b/app/javascript/flavours/glitch/features/notifications/index.jsx
index b4f1bf5dfe..bc32f9a7d2 100644
--- a/app/javascript/flavours/glitch/features/notifications/index.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/index.jsx
@@ -258,6 +258,13 @@ class Notifications extends PureComponent {
 
     let scrollContainer;
 
+    const prepend = (
+      <>
+        {needsNotificationPermission && <NotificationsPermissionBanner />}
+        <FilteredNotificationsBanner />
+      </>
+    );
+
     if (signedIn) {
       scrollContainer = (
         <ScrollableList
@@ -267,7 +274,7 @@ class Notifications extends PureComponent {
           showLoading={isLoading && notifications.size === 0}
           hasMore={hasMore}
           numPending={numPending}
-          prepend={needsNotificationPermission && <NotificationsPermissionBanner />}
+          prepend={prepend}
           alwaysPrepend
           emptyMessage={emptyMessage}
           onLoadMore={this.handleLoadOlder}
@@ -356,8 +363,6 @@ class Notifications extends PureComponent {
 
         {filterBarContainer}
 
-        <FilteredNotificationsBanner />
-
         {scrollContainer}
 
         <Helmet>
diff --git a/app/javascript/flavours/glitch/styles/components.scss b/app/javascript/flavours/glitch/styles/components.scss
index 533a564e99..06225b61e6 100644
--- a/app/javascript/flavours/glitch/styles/components.scss
+++ b/app/javascript/flavours/glitch/styles/components.scss
@@ -10746,8 +10746,7 @@ noscript {
 .filtered-notifications-banner {
   display: flex;
   align-items: center;
-  border: 1px solid var(--background-border-color);
-  border-top: 0;
+  border-bottom: 1px solid var(--background-border-color);
   padding: 24px 32px;
   gap: 16px;
   color: $darker-text-color;