Repository: gitify-app/gitify (ts)

Issue:
Header expands to fill entire panel
### 🔍 Is there already an issue for your problem?

- [X] I have checked older issues, open and closed

### 📝 Description

I recently updated from a build that was about six months old, to version 5.6.0 and noticed when there are just a few notifications, there is a header with the text `api.github.com` that expands to fill all remaining space pushing the notifications down to the bottom of the panel (see screenshot).

If I have more notifications open the header area takes up less space and will expand each time I mark a notification as read.

### 🪜 Steps To Reproduce

1. Have a couple notifications, but not enough to fill the panel
2. Open Gitify, notice that the header is taking up most of the space.

### Gitify Version

5.6.0

### Operating System

macOS

### GitHub Account

GitHub.com

### 📸 Screenshots

<img width="503" alt="image" src="https://github.com/gitify-app/gitify/assets/126299/5b96ddc8-a1cc-46da-9f6d-c2efef582511">

Pull request:
fix: account name header height
Resolves #1157 

Patch:
diff --git a/src/components/AccountNotifications.tsx b/src/components/AccountNotifications.tsx
index 50affd7d..738dd809 100644
--- a/src/components/AccountNotifications.tsx
+++ b/src/components/AccountNotifications.tsx
@@ -28,9 +28,8 @@ export const AccountNotifications = (props: IProps) => {
   return (
     <>
       {showAccountHostname && (
-        <div className="flex flex-1 items-center justify-between py-2 px-4 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm">
+        <div className="flex items-center justify-between py-2 px-3 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm">
           {hostname}
-
           <Chevron size={20} />
         </div>
       )}


Test patch:
diff --git a/src/components/__snapshots__/AccountNotifications.test.tsx.snap b/src/components/__snapshots__/AccountNotifications.test.tsx.snap
index 1905e1ce..de9b8671 100644
--- a/src/components/__snapshots__/AccountNotifications.test.tsx.snap
+++ b/src/components/__snapshots__/AccountNotifications.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   "baseElement": <body>
     <div>
       <div
-        class="flex flex-1 items-center justify-between py-2 px-4 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm"
+        class="flex items-center justify-between py-2 px-3 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm"
       >
         github.com
         <svg
@@ -31,7 +31,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   </body>,
   "container": <div>
     <div
-      class="flex flex-1 items-center justify-between py-2 px-4 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm"
+      class="flex items-center justify-between py-2 px-3 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm"
     >
       github.com
       <svg
@@ -113,7 +113,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   "baseElement": <body>
     <div>
       <div
-        class="flex flex-1 items-center justify-between py-2 px-4 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm"
+        class="flex items-center justify-between py-2 px-3 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm"
       >
         github.com
         <svg
@@ -135,7 +135,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   </body>,
   "container": <div>
     <div
-      class="flex flex-1 items-center justify-between py-2 px-4 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm"
+      class="flex items-center justify-between py-2 px-3 bg-gray-300 dark:bg-gray-darkest dark:text-white text-sm"
     >
       github.com
       <svg