apunkt/rowboat
1
0
Fork 0
mirror of https://github.com/rowboatlabs/rowboat.git synced 2026-05-12 08:42:38 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

improve user icon

Browse source
This commit is contained in:
Ramnique Singh 2025-08-19 18:55:14 +05:30
parent 62df67c117
commit 07e8baeee6
2 changed files with 19 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

21
apps/rowboat/app/lib/components/user_button.tsx
View file

@ -2,24 +2,29 @@
import { useUser } from '@auth0/nextjs-auth0';
import { Avatar, Dropdown, DropdownItem, DropdownSection, DropdownTrigger, DropdownMenu } from "@heroui/react";
import { useRouter } from 'next/navigation';
import Link from 'next/link';
export function UserButton({ useBilling }: { useBilling?: boolean }) {
export function UserButton({ useBilling, collapsed }: { useBilling?: boolean, collapsed?: boolean }) {
const router = useRouter();
const { user } = useUser();
if (!user) {
return <></>;
}
const title = user.email ?? user.name ?? 'Unknown user';
const name = user.name ?? user.email ?? 'Unknown user';
return <Dropdown>
<DropdownTrigger>
<Avatar
name={name}
size="sm"
className="cursor-pointer"
/>
<div className="flex items-center gap-2">
<Avatar
name={name}
size='md'
isBordered
radius='md'
className='shrink-0'
/>
{!collapsed && <span className="text-sm truncate">{name}</span>}
</div>
</DropdownTrigger>
<DropdownMenu
onAction={(key) => {
@ -31,7 +36,7 @@ export function UserButton({ useBilling }: { useBilling?: boolean }) {
}
}}
>
<DropdownSection title={name}>
<DropdownSection title={title}>
{useBilling ? (
<DropdownItem key="billing">
Billing

21
apps/rowboat/app/projects/layout/components/sidebar.tsx
View file

@ -282,21 +282,12 @@ export default function Sidebar({ projectId, useAuth, collapsed = false, onToggl
</Tooltip>
)}
{useAuth && (
<Tooltip content={collapsed ? "Account" : ""} showArrow placement="right">
<div
className={`
w-full rounded-md flex items-center
text-[15px] font-medium transition-all duration-200
${collapsed ? 'justify-center py-4' : 'px-4 py-4 gap-3'}
hover:bg-zinc-100 dark:hover:bg-zinc-800/50
`}
>
<UserButton useBilling={useBilling} />
{!collapsed && <span>Account</span>}
</div>
</Tooltip>
)}
{useAuth && <>
{collapsed && <Tooltip content="Account" showArrow placement="right">
<UserButton useBilling={useBilling} collapsed={collapsed} />
</Tooltip>}
{!collapsed && <UserButton useBilling={useBilling} collapsed={collapsed} />}
</>}
</div>
</div>
</aside>