Files
go-socket/client/src/components/UserBar.jsx
T
2026-04-29 14:46:22 +02:00

30 lines
915 B
React

import { Link } from 'react-router-dom'
import { useApp } from '../context/AppContext'
import { colorToCss } from '../utils/color'
export default function UserBar() {
const { state } = useApp()
const user = state.currentUser
return (
<div className="flex items-center gap-2 px-3 py-3 border-t border-gray-700/60 bg-gray-900/80">
<div
className="w-8 h-8 rounded-full flex items-center justify-center text-white text-sm font-semibold shrink-0"
style={{ backgroundColor: colorToCss(user?.color) }}
>
{user?.name?.[0]?.toUpperCase() ?? '?'}
</div>
<span className="text-sm font-medium text-gray-200 truncate flex-1">
{user?.name ?? '…'}
</span>
<Link
to="/settings"
title="Settings"
className="text-gray-400 hover:text-gray-200 transition-colors text-base px-1"
>
</Link>
</div>
)
}