feat: replace Tooltip with CustomTooltip in FollowShareButtons; pass projectName as prop

This commit is contained in:
Pattadon 2024-11-12 09:37:45 +07:00
parent 7f68a31afa
commit 6e70bdf084
4 changed files with 14 additions and 16 deletions

View File

@ -3,7 +3,7 @@
/* eslint-disable */
import { useState, useEffect } from "react";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import CustomTooltip from "@/components/customToolTip";
import { ShareIcon, StarIcon } from "lucide-react";
import { deleteFollow, getFollow, insertFollow } from "@/lib/data/followQuery";
import toast from "react-hot-toast";
@ -13,9 +13,10 @@ import { useQuery } from "@supabase-cache-helpers/postgrest-react-query";
interface FollowShareButtons {
userId: string;
projectId: number;
projectName: string;
}
const FollowShareButtons = ({ userId, projectId }: FollowShareButtons) => {
const FollowShareButtons = ({ userId, projectId, projectName }: FollowShareButtons) => {
const supabase = createSupabaseClient();
const { data: follow, isLoading: followIsLoading } = useQuery(getFollow(supabase, userId, projectId), {
staleTime: 0,
@ -71,16 +72,9 @@ const FollowShareButtons = ({ userId, projectId }: FollowShareButtons) => {
return (
<div className="grid grid-cols-2 gap-5 justify-self-end ">
<div className="mt-2 cursor-pointer" onClick={handleFollow}>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<CustomTooltip message={`Follow ${projectName}`}>
<StarIcon id="follow" fill={isFollowState ? "#fcb30e" : "#fff"} strokeWidth={2} />
</TooltipTrigger>
<TooltipContent>
<p>Follow NVIDIA</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
</CustomTooltip>
</div>
<div onClick={handleShare} className="cursor-pointer mt-2">
<ShareIcon />

View File

@ -89,7 +89,7 @@ export default async function ProjectDealPage({ params }: { params: { id: number
<Image src="/logo.svg" alt="logo" width={50} height={50} className="sm:scale-75" />
<h1 className="mt-3 font-bold text-lg md:text-3xl">{projectData?.project_name}</h1>
</span>
<FollowShareButtons userId={user!.user.id} projectId={params.id} />
<FollowShareButtons userId={user!.user.id} projectId={params.id} projectName ={projectData?.project_name}/>
</div>
{/* end of pack */}
<p className="mt-2 sm:text-sm">{projectData?.project_short_description}</p>

View File

@ -26,6 +26,7 @@ import { UnAuthorizedAlert } from "@/components/alert/unauthorized/alert";
import Link from "next/link";
import { DataTable } from "@/components/dataTable";
import { Button } from "@/components/ui/button";
import CustomTooltip from "@/components/customToolTip";
export default async function Portfolio({ params }: { params: { uid: string } }) {
const supabase = createSupabaseClient();

View File

@ -34,9 +34,12 @@ export const AuthenticatedComponents = ({ uid, avatarUrl, notificationCount }: A
<div className="relative inline-block">
<Bell className="h-6 w-6 " />
{notificationCount >= 1 && (
<span className="absolute -top-1 -right-1 inline-flex items-center justify-center w-4 h-4 text-xs font-bold text-white bg-red-600 rounded-full animate-ping">
<div>
<span className="absolute -top-1 -right-1 inline-flex items-center justify-center w-4 h-4 text-xs font-bold text-white bg-red-600 rounded-full animate-ping"></span>
<span className="absolute -top-1 -right-1 inline-flex items-center justify-center w-4 h-4 text-xs font-bold text-white bg-red-600 rounded-full ">
{notificationCount}
</span>
</div>
)}
</div>
</Link>