Just show first names to save space

web/components/notifications-icon.tsx

@@ -19,7 +19,7 @@ export default function NotificationsIcon(props: { className?: string }) {
   useEffect(() => {
     if (!privateUser) return
 
-    if (Date.now() - (privateUser.lastTimeCheckedBonuses ?? 0) > 60 * 1000)
+    if (Date.now() - (privateUser.lastTimeCheckedBonuses ?? 0) > 65 * 1000)
       requestBonuses({}).catch((error) => {
         console.log("couldn't get bonuses:", error.message)
       })

web/components/user-page.tsx

@@ -45,15 +45,16 @@ export function UserLink(props: {
   username: string
   showUsername?: boolean
   className?: string
+  justFirstName?: boolean
 }) {
-  const { name, username, showUsername, className } = props
+  const { name, username, showUsername, className, justFirstName } = props
 
   return (
     <SiteLink
       href={`/${username}`}
       className={clsx('z-10 truncate', className)}
     >
-      {name}
+      {justFirstName ? name.split(' ')[0] : name}
       {showUsername && ` (@${username})`}
     </SiteLink>
   )

web/pages/notifications.tsx

@@ -783,13 +783,12 @@ function NotificationItem(props: {
       <Row className={'items-center text-sm text-gray-500 sm:justify-start'}>
         <div className={'line-clamp-1 flex-1 overflow-hidden sm:flex'}>
           <div className={'flex pl-1 sm:pl-0'}>
-            {sourceType != 'bonus' && (
             <UserLink
               name={sourceUserName || ''}
               username={sourceUserUsername || ''}
               className={'mr-0 flex-shrink-0'}
+              justFirstName={true}
             />
-            )}
             <div className={'inline-flex overflow-hidden text-ellipsis pl-1'}>
               <span className={'flex-shrink-0'}>
                 {sourceType &&
@@ -845,6 +844,7 @@ function NotificationItem(props: {
                   name={sourceUserName || ''}
                   username={sourceUserUsername || ''}
                   className={'mr-0 flex-shrink-0'}
+                  justFirstName={true}
                 />
               )}
               <div className={'inline-flex overflow-hidden text-ellipsis pl-1'}>