test: update test cases

Signed-off-by: Adam Setch <[email protected]>

Author: setchy

src/renderer/components/notifications/AccountNotifications.tsx

@@ -77,7 +77,7 @@ export const AccountNotifications: FC<IAccountNotifications> = (
       {showAccountHeader && (
         <div
           className={cn(
-            'group flex items-center justify-between pr-3 py-1.5 text-sm font-semibold dark:text-white',
+            'group flex items-center justify-between pl-3 pr-1 py-0.5 text-sm font-semibold dark:text-white',
             props.error
               ? 'bg-red-300 dark:bg-red-500'
               : 'bg-gray-300 dark:bg-gray-darkest',

src/renderer/components/notifications/NotificationFooter.tsx

@@ -27,30 +27,28 @@ export const NotificationFooter: FC<INotificationFooter> = ({
 
   return (
     <div className="flex flex-wrap items-center gap-1">
-      <div className="mb-1">
-        {notification.subject.user ? (
-          <Avatar
-            title={`View profile: ${notification.subject.user.login}`}
-            src={notification.subject.user.avatar_url}
-            size={Size.SMALL}
-            onClick={(event: MouseEvent<HTMLElement>) => {
-              // Don't trigger onClick of parent element.
-              event.stopPropagation();
-              openUserProfile(notification.subject.user);
-            }}
-            data-testid="view-profile"
-          />
-        ) : (
-          <div>
-            {notification.subject.type === 'RepositoryDependabotAlertsThread' ||
-            notification.subject.type === 'RepositoryVulnerabilityAlert' ? (
-              <MarkGithubIcon size={Size.SMALL} />
-            ) : (
-              <FeedPersonIcon size={Size.SMALL} className={IconColor.GRAY} />
-            )}
-          </div>
-        )}
-      </div>
+      {notification.subject.user ? (
+        <Avatar
+          title={`View profile: ${notification.subject.user.login}`}
+          src={notification.subject.user.avatar_url}
+          size={Size.SMALL}
+          onClick={(event: MouseEvent<HTMLElement>) => {
+            // Don't trigger onClick of parent element.
+            event.stopPropagation();
+            openUserProfile(notification.subject.user);
+          }}
+          data-testid="view-profile"
+        />
+      ) : (
+        <span>
+          {notification.subject.type === 'RepositoryDependabotAlertsThread' ||
+          notification.subject.type === 'RepositoryVulnerabilityAlert' ? (
+            <MarkGithubIcon size={Size.SMALL} />
+          ) : (
+            <FeedPersonIcon size={Size.SMALL} className={IconColor.GRAY} />
+          )}
+        </span>
+      )}
       <span
         className={cn('text-xs capitalize', Opacity.MEDIUM)}
         title={reason.description}

src/renderer/components/notifications/NotificationRow.tsx

@@ -90,7 +90,7 @@ export const NotificationRow: FC<INotificationRow> = ({
     <div
       id={notification.id}
       className={cn(
-        'group flex border-b border-gray-100 bg-white px-3 py-2 hover:bg-gray-100 dark:border-gray-darker dark:bg-gray-dark dark:text-white dark:hover:bg-gray-darker',
+        'group flex border-b border-gray-100 bg-white pl-3 pr-1 py-1.5 hover:bg-gray-100 dark:border-gray-darker dark:bg-gray-dark dark:text-white dark:hover:bg-gray-darker',
         (isAnimated || animateExit) &&
           'translate-x-full opacity-0 transition duration-[350ms] ease-in-out',
         (isRead || showAsRead) && Opacity.READ,

src/renderer/components/notifications/RepositoryNotifications.tsx

@@ -53,15 +53,15 @@ export const RepositoryNotifications: FC<IRepositoryNotifications> = ({
   return (
     <>
       <div
-        className="group flex justify-between bg-gray-100 pr-3 py-1.5 dark:bg-gray-darker dark:text-white"
+        className="group flex justify-between bg-gray-100 pl-3 pr-1 py-0.5 dark:bg-gray-darker dark:text-white"
         onClick={toggleRepositoryNotifications}
       >
         <div
           className={cn(
             'flex flex-1 gap-3 items-center truncate text-sm font-medium',
             animateExit &&
               'translate-x-full opacity-0 transition duration-[350ms] ease-in-out',
-            showAsRead ? Opacity.READ : Opacity.MEDIUM,
+            showAsRead && Opacity.READ,
           )}
         >
           <Tooltip text="Open repository" direction="e">