notifs style

packages/app/src/Pages/Notifications/NotificationGroup.tsx

@@ -104,7 +104,17 @@ export function NotificationGroup({
   };
 
   return (
-    <div className="card notification-group" ref={ref}>
+    <div
+      className="card notification-group cursor-pointer hover:bg-nearly-bg-color"
+      ref={ref}
+      onClick={() => {
+        if (!context) return;
+        if (onClick) {
+          onClick(context);
+        } else {
+          navigate(`/${context.encode(CONFIG.eventLinkPrefix)}`);
+        }
+      }}>
       {inView && (
         <>
           <div className="flex flex-col g12">
@@ -137,18 +147,7 @@ export function NotificationGroup({
                 )}
               </div>
             )}
-            {context && (
-              <NotificationContext
-                link={context}
-                onClick={() => {
-                  if (onClick) {
-                    onClick(context);
-                  } else {
-                    navigate(`/${context.encode(CONFIG.eventLinkPrefix)}`);
-                  }
-                }}
-              />
-            )}
+            {context && <NotificationContext link={context} />}
           </div>
         </>
       )}

packages/app/src/Pages/Notifications/Notifications.tsx

@@ -32,9 +32,7 @@ export default function NotificationsPage({ onClick }: { onClick?: (link: NostrL
   };
 
   const myNotifications = useMemo(() => {
-    return notifications.filter(
-      a => !isMuted(a.pubkey) && a.tags.some(b => b[0] === "p" && b[1] === login.publicKey),
-    );
+    return notifications.filter(a => !isMuted(a.pubkey) && a.tags.some(b => b[0] === "p" && b[1] === login.publicKey));
   }, [notifications, login.publicKey]);
 
   const timeGrouped = useMemo(() => {

packages/app/src/Pages/Notifications/notificationContext.tsx

@@ -5,7 +5,7 @@ import { LiveEvent } from "@/Components/LiveStream/LiveEvent";
 import Text from "@/Components/Text/Text";
 import ProfilePreview from "@/Components/User/ProfilePreview";
 
-export function NotificationContext({ link, onClick }: { link: NostrLink; onClick: () => void }) {
+export function NotificationContext({ link }: { link: NostrLink }) {
   const ev = useEventFeed(link);
   if (link.type === NostrPrefix.PublicKey) {
     return <ProfilePreview pubkey={link.id} actions={<></>} />;
@@ -23,7 +23,6 @@ export function NotificationContext({ link, onClick }: { link: NostrLink; onClic
       truncate={120}
       disableLinkPreview={true}
       className="content"
-      onClick={onClick}
     />
   );
 }