[WEB-2926]fix: added tooltips for favorites (#6320)

* * fix: added tooltips for favorites

* chore: code formatting
This commit is contained in:
Vamsi Krishna 2025-01-06 13:05:46 +05:30 committed by GitHub
parent e4f9d027fe
commit d26fb8ce02
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 18 additions and 10 deletions

View file

@ -3,9 +3,9 @@
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect, useRef, useState } from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { useParams, usePathname } from "next/navigation"; import { useParams, usePathname } from "next/navigation";
import { EIssuesStoreType } from "@plane/constants";
import { useTranslation } from "@plane/i18n"; import { useTranslation } from "@plane/i18n";
// types // types
import { EIssuesStoreType } from "@plane/constants";
import type { TBaseIssue, TIssue } from "@plane/types"; import type { TBaseIssue, TIssue } from "@plane/types";
// ui // ui
import { EModalPosition, EModalWidth, ModalCore, TOAST_TYPE, setToast } from "@plane/ui"; import { EModalPosition, EModalWidth, ModalCore, TOAST_TYPE, setToast } from "@plane/ui";

View file

@ -175,11 +175,16 @@ export const FavoriteFolder: React.FC<Props> = (props) => {
"justify-center": isSidebarCollapsed, "justify-center": isSidebarCollapsed,
})} })}
> >
<Disclosure.Button as="button" className="size-8 aspect-square flex-shrink-0 grid place-items-center"> <Tooltip tooltipContent={favorite.name} position="right" isMobile={isMobile}>
<div className="size-4 grid place-items-center flex-shrink-0"> <Disclosure.Button
<FavoriteFolderIcon /> as="button"
</div> className="size-8 aspect-square flex-shrink-0 grid place-items-center"
</Disclosure.Button> >
<div className="size-4 grid place-items-center flex-shrink-0">
<FavoriteFolderIcon />
</div>
</Disclosure.Button>
</Tooltip>
</div> </div>
) : ( ) : (
<> <>

View file

@ -2,6 +2,7 @@
import React, { FC } from "react"; import React, { FC } from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import Link from "next/link"; import Link from "next/link";
import { Tooltip } from "@plane/ui";
import { useAppTheme } from "@/hooks/store"; import { useAppTheme } from "@/hooks/store";
import { usePlatformOS } from "@/hooks/use-platform-os"; import { usePlatformOS } from "@/hooks/use-platform-os";
@ -27,9 +28,11 @@ export const FavoriteItemTitle: FC<Props> = observer((props) => {
}; };
return ( return (
<Link href={href} className={isSidebarCollapsed ? collapsedClass : linkClass} draggable onClick={handleOnClick}> <Tooltip tooltipContent={title} isMobile={isMobile} disabled={!isSidebarCollapsed} position="right">
<span className="flex items-center justify-center size-5">{icon}</span> <Link href={href} className={isSidebarCollapsed ? collapsedClass : linkClass} draggable onClick={handleOnClick}>
{!isSidebarCollapsed && <span className="text-sm leading-5 font-medium flex-1 truncate">{title}</span>} <span className="flex items-center justify-center size-5">{icon}</span>
</Link> {!isSidebarCollapsed && <span className="text-sm leading-5 font-medium flex-1 truncate">{title}</span>}
</Link>
</Tooltip>
); );
}); });