fix: dashboard flickering + clickable logo change for applicants

- Fix session auto-refresh causing re-render cascade by using useRef
  instead of useState and delaying the refresh by 3s
- Make project logo clickable on dashboard and team page for team leads
  with hover pencil overlay and ProjectLogoUpload dialog

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/components/layouts/role-nav.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { useState, useEffect } from 'react'
+import { useState, useEffect, useRef } from 'react'
 import Link from 'next/link'
 import { usePathname } from 'next/navigation'
 import { signOut, useSession } from 'next-auth/react'
@@ -96,10 +96,15 @@ export function RoleNav({ navigation, roleName, user, basePath, statusBadge, edi
     signOut({ callbackUrl: '/login' })
   }
 
-  // Auto-refresh session on mount to pick up role changes without requiring re-login
+  // Auto-refresh session once on initial mount to pick up role changes.
+  // Uses a ref (not state) to avoid triggering an extra re-render.
+  const sessionRefreshedRef = useRef(false)
   useEffect(() => {
-    if (isAuthenticated) {
-      updateSession()
+    if (isAuthenticated && !sessionRefreshedRef.current) {
+      sessionRefreshedRef.current = true
+      // Delay so the initial render finishes cleanly before session refresh
+      const timer = setTimeout(() => updateSession(), 3000)
+      return () => clearTimeout(timer)
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isAuthenticated])