binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: page breadcrumb tooltip persistence (#5137)

Browse source
This commit is contained in:
Aaryan Khandelwal 2024-07-18 15:49:25 +05:30 • committed by GitHub
parent 39e3c28ad8
commit 209b700fd9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 51 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

22
web/app/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
View file

@ -7,7 +7,7 @@ import { FileText } from "lucide-react";
// types
import { TLogoProps } from "@plane/types";
// ui
import { Breadcrumbs, Button, EmojiIconPicker, EmojiIconPickerTypes, TOAST_TYPE, setToast } from "@plane/ui";
import { Breadcrumbs, Button, EmojiIconPicker, EmojiIconPickerTypes, TOAST_TYPE, Tooltip, setToast } from "@plane/ui";
// components
import { BreadcrumbLink, Logo } from "@/components/common";
// helpers
@ -31,7 +31,7 @@ export const PageDetailsHeader = observer(() => {
const { currentProjectDetails, loader } = useProject();
const { isContentEditable, isSubmitting, name, logo_props, updatePageLogo } = usePage(pageId?.toString() ?? "");
// use platform
const { platform } = usePlatformOS();
const { isMobile, platform } = usePlatformOS();
// derived values
const isMac = platform === "MacOS";
@ -100,9 +100,10 @@ export const PageDetailsHeader = observer(() => {
<Breadcrumbs.BreadcrumbItem
type="text"
link={
<BreadcrumbLink
label={name ?? "Page"}
icon={
<li className="flex items-center space-x-2" tabIndex={-1}>
<div className="flex flex-wrap items-center gap-2.5">
<div className="flex cursor-default items-center gap-1 text-sm font-medium text-custom-text-100">
<div className="flex h-5 w-5 items-center justify-center overflow-hidden">
<EmojiIconPicker
isOpen={isOpen}
handleToggle={(val: boolean) => setIsOpen(val)}
@ -141,8 +142,15 @@ export const PageDetailsHeader = observer(() => {
: EmojiIconPickerTypes.ICON
}
/>
}
/>
</div>
<Tooltip tooltipContent={name ?? "Page"} position="bottom" isMobile={isMobile}>
<div className="relative line-clamp-1 block max-w-[150px] overflow-hidden truncate">
{name ?? "Page"}
</div>
</Tooltip>
</div>
</div>
</li>
}
/>
</Breadcrumbs>