fix type error in <Shell> Userdropdown (#980)
* removed settings from bottom nav * truncate bottom nav * fixed type error in Shell
This commit is contained in:
Peer Richelsen
GitHub
parent
4d5b5663c0
commit
415d5fe8bd
1 changed files with 82 additions and 87 deletions
|
|
@ -298,93 +298,88 @@ function UserDropdown({ small }: { small?: boolean }) {
|
||||||
const query = useMeQuery();
|
const query = useMeQuery();
|
||||||
const user = query.data;
|
const user = query.data;
|
||||||
|
|
||||||
return (
|
return user ? (
|
||||||
!!user && (
|
<Dropdown>
|
||||||
<Dropdown>
|
<DropdownMenuTrigger asChild>
|
||||||
<DropdownMenuTrigger asChild>
|
<div className="flex items-center space-x-2 cursor-pointer group">
|
||||||
<div className="flex items-center space-x-2 cursor-pointer group">
|
<Avatar
|
||||||
<Avatar
|
imageSrc={user.avatar}
|
||||||
imageSrc={user.avatar}
|
alt={user.username}
|
||||||
alt={user.username}
|
className={classNames(small ? "w-8 h-8" : "w-10 h-10", "bg-gray-300 rounded-full flex-shrink-0")}
|
||||||
className={classNames(
|
/>
|
||||||
small ? "w-8 h-8" : "w-10 h-10",
|
{!small && (
|
||||||
"bg-gray-300 rounded-full flex-shrink-0"
|
<>
|
||||||
)}
|
<span className="flex-grow text-sm">
|
||||||
/>
|
<span className="block font-medium text-gray-900 truncate">{user.name}</span>
|
||||||
{!small && (
|
<span className="block font-normal truncate text-neutral-500">/{user.username}</span>
|
||||||
<>
|
</span>
|
||||||
<span className="flex-grow text-sm">
|
<SelectorIcon
|
||||||
<span className="block font-medium text-gray-900 truncate">{user.name}</span>
|
className="flex-shrink-0 w-5 h-5 text-gray-400 group-hover:text-gray-500"
|
||||||
<span className="block font-normal truncate text-neutral-500">/{user.username}</span>
|
|
||||||
</span>
|
|
||||||
<SelectorIcon
|
|
||||||
className="flex-shrink-0 w-5 h-5 text-gray-400 group-hover:text-gray-500"
|
|
||||||
aria-hidden="true"
|
|
||||||
/>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent>
|
|
||||||
<DropdownMenuItem>
|
|
||||||
<a
|
|
||||||
target="_blank"
|
|
||||||
rel="noopener noreferrer"
|
|
||||||
href={`${process.env.NEXT_PUBLIC_APP_URL}/${user?.username || ""}`}
|
|
||||||
className="flex px-4 py-2 text-sm text-neutral-500">
|
|
||||||
{t("view_public_page")} <ExternalLinkIcon className="w-3 h-3 mt-1 ml-1 text-neutral-400" />
|
|
||||||
</a>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
<DropdownMenuSeparator className="h-px bg-gray-200" />
|
|
||||||
<DropdownMenuItem>
|
|
||||||
<a
|
|
||||||
href="https://cal.com/slack"
|
|
||||||
target="_blank"
|
|
||||||
rel="noreferrer"
|
|
||||||
className="flex px-4 py-2 text-sm font-medium text-neutral-700 hover:bg-gray-100 hover:text-gray-900">
|
|
||||||
<svg
|
|
||||||
viewBox="0 0 2447.6 2452.5"
|
|
||||||
className={classNames(
|
|
||||||
"text-neutral-400 group-hover:text-neutral-500",
|
|
||||||
"mt-0.5 mr-3 flex-shrink-0 h-4 w-4"
|
|
||||||
)}
|
|
||||||
xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<g clipRule="evenodd" fillRule="evenodd">
|
|
||||||
<path
|
|
||||||
d="m897.4 0c-135.3.1-244.8 109.9-244.7 245.2-.1 135.3 109.5 245.1 244.8 245.2h244.8v-245.1c.1-135.3-109.5-245.1-244.9-245.3.1 0 .1 0 0 0m0 654h-652.6c-135.3.1-244.9 109.9-244.8 245.2-.2 135.3 109.4 245.1 244.7 245.3h652.7c135.3-.1 244.9-109.9 244.8-245.2.1-135.4-109.5-245.2-244.8-245.3z"
|
|
||||||
fill="#9BA6B6"></path>
|
|
||||||
<path
|
|
||||||
d="m2447.6 899.2c.1-135.3-109.5-245.1-244.8-245.2-135.3.1-244.9 109.9-244.8 245.2v245.3h244.8c135.3-.1 244.9-109.9 244.8-245.3zm-652.7 0v-654c.1-135.2-109.4-245-244.7-245.2-135.3.1-244.9 109.9-244.8 245.2v654c-.2 135.3 109.4 245.1 244.7 245.3 135.3-.1 244.9-109.9 244.8-245.3z"
|
|
||||||
fill="#9BA6B6"></path>
|
|
||||||
<path
|
|
||||||
d="m1550.1 2452.5c135.3-.1 244.9-109.9 244.8-245.2.1-135.3-109.5-245.1-244.8-245.2h-244.8v245.2c-.1 135.2 109.5 245 244.8 245.2zm0-654.1h652.7c135.3-.1 244.9-109.9 244.8-245.2.2-135.3-109.4-245.1-244.7-245.3h-652.7c-135.3.1-244.9 109.9-244.8 245.2-.1 135.4 109.4 245.2 244.7 245.3z"
|
|
||||||
fill="#9BA6B6"></path>
|
|
||||||
<path
|
|
||||||
d="m0 1553.2c-.1 135.3 109.5 245.1 244.8 245.2 135.3-.1 244.9-109.9 244.8-245.2v-245.2h-244.8c-135.3.1-244.9 109.9-244.8 245.2zm652.7 0v654c-.2 135.3 109.4 245.1 244.7 245.3 135.3-.1 244.9-109.9 244.8-245.2v-653.9c.2-135.3-109.4-245.1-244.7-245.3-135.4 0-244.9 109.8-244.8 245.1 0 0 0 .1 0 0"
|
|
||||||
fill="#9BA6B6"></path>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
{t("join_our_slack")}
|
|
||||||
</a>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
<HelpMenuItemDynamic />
|
|
||||||
<DropdownMenuSeparator className="h-px bg-gray-200" />
|
|
||||||
<DropdownMenuItem>
|
|
||||||
<a
|
|
||||||
onClick={() => signOut({ callbackUrl: "/auth/logout" })}
|
|
||||||
className="flex px-4 py-2 text-sm font-medium cursor-pointer hover:bg-gray-100 hover:text-gray-900">
|
|
||||||
<LogoutIcon
|
|
||||||
className={classNames(
|
|
||||||
"text-neutral-400 group-hover:text-neutral-500",
|
|
||||||
"mr-2 flex-shrink-0 h-5 w-5"
|
|
||||||
)}
|
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
/>
|
/>
|
||||||
{t("sign_out")}
|
</>
|
||||||
</a>
|
)}
|
||||||
</DropdownMenuItem>
|
</div>
|
||||||
</DropdownMenuContent>
|
</DropdownMenuTrigger>
|
||||||
</Dropdown>
|
<DropdownMenuContent>
|
||||||
)
|
<DropdownMenuItem>
|
||||||
);
|
<a
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
href={`${process.env.NEXT_PUBLIC_APP_URL}/${user?.username || ""}`}
|
||||||
|
className="flex px-4 py-2 text-sm text-neutral-500">
|
||||||
|
{t("view_public_page")} <ExternalLinkIcon className="w-3 h-3 mt-1 ml-1 text-neutral-400" />
|
||||||
|
</a>
|
||||||
|
</DropdownMenuItem>
|
||||||
|
<DropdownMenuSeparator className="h-px bg-gray-200" />
|
||||||
|
<DropdownMenuItem>
|
||||||
|
<a
|
||||||
|
href="https://cal.com/slack"
|
||||||
|
target="_blank"
|
||||||
|
rel="noreferrer"
|
||||||
|
className="flex px-4 py-2 text-sm font-medium text-neutral-700 hover:bg-gray-100 hover:text-gray-900">
|
||||||
|
<svg
|
||||||
|
viewBox="0 0 2447.6 2452.5"
|
||||||
|
className={classNames(
|
||||||
|
"text-neutral-400 group-hover:text-neutral-500",
|
||||||
|
"mt-0.5 mr-3 flex-shrink-0 h-4 w-4"
|
||||||
|
)}
|
||||||
|
xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clipRule="evenodd" fillRule="evenodd">
|
||||||
|
<path
|
||||||
|
d="m897.4 0c-135.3.1-244.8 109.9-244.7 245.2-.1 135.3 109.5 245.1 244.8 245.2h244.8v-245.1c.1-135.3-109.5-245.1-244.9-245.3.1 0 .1 0 0 0m0 654h-652.6c-135.3.1-244.9 109.9-244.8 245.2-.2 135.3 109.4 245.1 244.7 245.3h652.7c135.3-.1 244.9-109.9 244.8-245.2.1-135.4-109.5-245.2-244.8-245.3z"
|
||||||
|
fill="#9BA6B6"></path>
|
||||||
|
<path
|
||||||
|
d="m2447.6 899.2c.1-135.3-109.5-245.1-244.8-245.2-135.3.1-244.9 109.9-244.8 245.2v245.3h244.8c135.3-.1 244.9-109.9 244.8-245.3zm-652.7 0v-654c.1-135.2-109.4-245-244.7-245.2-135.3.1-244.9 109.9-244.8 245.2v654c-.2 135.3 109.4 245.1 244.7 245.3 135.3-.1 244.9-109.9 244.8-245.3z"
|
||||||
|
fill="#9BA6B6"></path>
|
||||||
|
<path
|
||||||
|
d="m1550.1 2452.5c135.3-.1 244.9-109.9 244.8-245.2.1-135.3-109.5-245.1-244.8-245.2h-244.8v245.2c-.1 135.2 109.5 245 244.8 245.2zm0-654.1h652.7c135.3-.1 244.9-109.9 244.8-245.2.2-135.3-109.4-245.1-244.7-245.3h-652.7c-135.3.1-244.9 109.9-244.8 245.2-.1 135.4 109.4 245.2 244.7 245.3z"
|
||||||
|
fill="#9BA6B6"></path>
|
||||||
|
<path
|
||||||
|
d="m0 1553.2c-.1 135.3 109.5 245.1 244.8 245.2 135.3-.1 244.9-109.9 244.8-245.2v-245.2h-244.8c-135.3.1-244.9 109.9-244.8 245.2zm652.7 0v654c-.2 135.3 109.4 245.1 244.7 245.3 135.3-.1 244.9-109.9 244.8-245.2v-653.9c.2-135.3-109.4-245.1-244.7-245.3-135.4 0-244.9 109.8-244.8 245.1 0 0 0 .1 0 0"
|
||||||
|
fill="#9BA6B6"></path>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
{t("join_our_slack")}
|
||||||
|
</a>
|
||||||
|
</DropdownMenuItem>
|
||||||
|
<HelpMenuItemDynamic />
|
||||||
|
<DropdownMenuSeparator className="h-px bg-gray-200" />
|
||||||
|
<DropdownMenuItem>
|
||||||
|
<a
|
||||||
|
onClick={() => signOut({ callbackUrl: "/auth/logout" })}
|
||||||
|
className="flex px-4 py-2 text-sm font-medium cursor-pointer hover:bg-gray-100 hover:text-gray-900">
|
||||||
|
<LogoutIcon
|
||||||
|
className={classNames(
|
||||||
|
"text-neutral-400 group-hover:text-neutral-500",
|
||||||
|
"mr-2 flex-shrink-0 h-5 w-5"
|
||||||
|
)}
|
||||||
|
aria-hidden="true"
|
||||||
|
/>
|
||||||
|
{t("sign_out")}
|
||||||
|
</a>
|
||||||
|
</DropdownMenuItem>
|
||||||
|
</DropdownMenuContent>
|
||||||
|
</Dropdown>
|
||||||
|
) : null;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue