video preview version

client/src/components/Header.jsx

@@ -1,7 +1,8 @@
 import { useState, useRef, useEffect } from 'react'
 import { useLocation } from 'react-router-dom'
-import { Bell, ChevronDown, LogOut, Settings, User, Shield } from 'lucide-react'
+import { Bell, ChevronDown, LogOut, Shield } from 'lucide-react'
 import { useAuth } from '../contexts/AuthContext'
+import { getInitials } from '../utils/api'
 
 const pageTitles = {
   '/': 'Dashboard',
@@ -27,9 +28,13 @@ export default function Header() {
   const dropdownRef = useRef(null)
   const location = useLocation()
 
-  const pageTitle = pageTitles[location.pathname] || 
-    (location.pathname.startsWith('/projects/') ? 'Project Details' : 
-     location.pathname.startsWith('/campaigns/') ? 'Campaign Details' : 'Page')
+  function getPageTitle(pathname) {
+    if (pageTitles[pathname]) return pageTitles[pathname]
+    if (pathname.startsWith('/projects/')) return 'Project Details'
+    if (pathname.startsWith('/campaigns/')) return 'Campaign Details'
+    return 'Page'
+  }
+  const pageTitle = getPageTitle(location.pathname)
 
   useEffect(() => {
     const handleClickOutside = (e) => {
@@ -41,11 +46,6 @@ export default function Header() {
     return () => document.removeEventListener('mousedown', handleClickOutside)
   }, [])
 
-  const getInitials = (name) => {
-    if (!name) return '?'
-    return name.split(' ').map(w => w[0]).join('').slice(0, 2).toUpperCase()
-  }
-
   const roleInfo = ROLE_INFO[user?.role] || ROLE_INFO.contributor
 
   return (