117 lines
3.2 KiB
TypeScript
117 lines
3.2 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { createClient } from "@/lib/supabase/client";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Bookmark } from "lucide-react";
|
|
import { toast } from "sonner";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface BookmarkButtonProps {
|
|
id: string;
|
|
type: "movie" | "dracin";
|
|
title: string;
|
|
poster: string;
|
|
className?: string;
|
|
}
|
|
|
|
export default function BookmarkButton({ id, type, title, poster, className }: BookmarkButtonProps) {
|
|
const [isBookmarked, setIsBookmarked] = useState(false);
|
|
const [loading, setLoading] = useState(true);
|
|
const supabase = createClient();
|
|
|
|
useEffect(() => {
|
|
checkBookmark();
|
|
}, [id]);
|
|
|
|
const checkBookmark = async () => {
|
|
try {
|
|
const { data: { user } } = await supabase.auth.getUser();
|
|
if (!user) {
|
|
setLoading(false);
|
|
return;
|
|
}
|
|
|
|
const { data } = await supabase
|
|
.from("bookmarks")
|
|
.select("id")
|
|
.eq("user_id", user.id)
|
|
.eq("subject_id", id)
|
|
.eq("type", type)
|
|
.single();
|
|
|
|
if (data) {
|
|
setIsBookmarked(true);
|
|
}
|
|
} catch (error) {
|
|
console.error("Error checking bookmark:", error);
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
};
|
|
|
|
const toggleBookmark = async () => {
|
|
setLoading(true);
|
|
const { data: { user } } = await supabase.auth.getUser();
|
|
|
|
if (!user) {
|
|
toast.error("Please login to bookmark");
|
|
setLoading(false);
|
|
return;
|
|
}
|
|
|
|
if (isBookmarked) {
|
|
// Remove
|
|
const { error } = await supabase
|
|
.from("bookmarks")
|
|
.delete()
|
|
.eq("user_id", user.id)
|
|
.eq("subject_id", id)
|
|
.eq("type", type);
|
|
|
|
if (error) {
|
|
toast.error("Failed to remove bookmark");
|
|
} else {
|
|
setIsBookmarked(false);
|
|
toast.success("Removed from bookmarks");
|
|
}
|
|
} else {
|
|
// Add
|
|
const { error } = await supabase
|
|
.from("bookmarks")
|
|
.insert({
|
|
user_id: user.id,
|
|
subject_id: id,
|
|
type,
|
|
title,
|
|
poster
|
|
});
|
|
|
|
if (error) {
|
|
console.error(error);
|
|
toast.error("Failed to add bookmark");
|
|
} else {
|
|
setIsBookmarked(true);
|
|
toast.success("Added to bookmarks");
|
|
}
|
|
}
|
|
setLoading(false);
|
|
};
|
|
|
|
return (
|
|
<Button
|
|
variant="outline"
|
|
size="icon"
|
|
onClick={toggleBookmark}
|
|
disabled={loading}
|
|
className={cn("bg-gray-800 border-gray-700 hover:bg-gray-700 transition-all", className)}
|
|
>
|
|
{isBookmarked ? (
|
|
<Bookmark className="h-5 w-5 text-red-500 fill-red-500" />
|
|
) : (
|
|
<Bookmark className="h-5 w-5 text-white" />
|
|
)}
|
|
</Button>
|
|
);
|
|
}
|