Feature: Node favourites (and ignores) (#618)
* Add favourite icon to node Avatar * Favourites WIP * Save isFavorite and isIgnored to device * Fix spelling * Clean up * Always sort favorites first * Add unread count to "Messages" top level menu * Renaming, UI tweaks * Add hook tests * Handle undefined node better
This commit is contained in:
@@ -1,5 +1,12 @@
|
||||
import { cn } from "@core/utils/cn.ts";
|
||||
import { LockKeyholeOpenIcon } from "lucide-react";
|
||||
import { LockKeyholeOpenIcon, StarIcon } from "lucide-react";
|
||||
import {
|
||||
Tooltip,
|
||||
TooltipArrow,
|
||||
TooltipContent,
|
||||
TooltipProvider,
|
||||
TooltipTrigger,
|
||||
} from "@components/UI/Tooltip.tsx";
|
||||
|
||||
type RGBColor = {
|
||||
r: number;
|
||||
@@ -13,6 +20,7 @@ interface AvatarProps {
|
||||
size?: "sm" | "lg";
|
||||
className?: string;
|
||||
showError?: boolean;
|
||||
showFavorite?: boolean;
|
||||
}
|
||||
|
||||
class ColorUtils {
|
||||
@@ -62,6 +70,7 @@ export const Avatar = ({
|
||||
text,
|
||||
size = "sm",
|
||||
showError = false,
|
||||
showFavorite = false,
|
||||
className,
|
||||
}: AvatarProps) => {
|
||||
const sizes = {
|
||||
@@ -88,12 +97,43 @@ export const Avatar = ({
|
||||
color: textColor,
|
||||
}}
|
||||
>
|
||||
{showFavorite
|
||||
? (
|
||||
<TooltipProvider delayDuration={300}>
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<StarIcon
|
||||
className="absolute -top-0.5 -right-0.5 z-10 size-4 stroke-1 fill-yellow-400"
|
||||
aria-hidden="true"
|
||||
style={{
|
||||
color: `rgb(${bgColor.r}, ${bgColor.g}, ${bgColor.b})`,
|
||||
}}
|
||||
/>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent className="bg-slate-800 dark:bg-slate-600 text-white px-4 py-1 rounded text-xs">
|
||||
Favorite
|
||||
<TooltipArrow className="fill-slate-800 dark:fill-slate-600" />
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
</TooltipProvider>
|
||||
)
|
||||
: null}
|
||||
{showError
|
||||
? (
|
||||
<LockKeyholeOpenIcon
|
||||
className="absolute bottom-0 right-0 z-10 size-4 text-red-500 stroke-3"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
<TooltipProvider delayDuration={300}>
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<LockKeyholeOpenIcon
|
||||
className="absolute -bottom-0.5 -right-0.5 z-10 size-4 text-red-500 stroke-3"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent className="bg-slate-800 dark:bg-slate-600 text-white px-4 py-1 rounded text-xs">
|
||||
Node error
|
||||
<TooltipArrow className="fill-slate-800 dark:fill-slate-600" />
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
</TooltipProvider>
|
||||
)
|
||||
: null}
|
||||
<p className="p-1">
|
||||
|
||||
Reference in New Issue
Block a user