import { User } from "@/types";
import { Link } from "@inertiajs/react";
import { PropsWithChildren } from "react";
import { Book, FileMinus } from "react-feather";

export default function BookmarkedPages({ user }: PropsWithChildren<{ user: User }>) {
    const thisUser = user;

    return (
        <div className="h-full w-full bg-neutral-10 shadow-md p-6 rounded-lg flex flex-col">
            <p className="font-bold text-xl flex items-center"><Book className="stroke-[#29BF12] mr-2" />Bookmarked Pages</p>
            <table className="table mt-2">
                <tbody>
                    <tr className="hover:cursor-pointer hover:bg-secondary-background active:bg-primary-main active:text-white">
                        <td className='text-md leading-4 py-2 w-full'><Link href=''>
                            Page Title<br />
                            <span className="text-xs"><i>Subject Category</i></span>
                        </Link></td>
                        <td><FileMinus className="stroke-error-main active:stroke-neutral-10" size={20} /></td>
                    </tr>
                    <tr className="hover:cursor-pointer hover:bg-secondary-background active:bg-primary-main active:text-white">
                        <td className='text-md leading-4 py-2 w-full'><Link href=''>
                            Page Title<br />
                            <span className="text-xs"><i>Subject Category</i></span>
                        </Link></td>
                        <td><FileMinus className="stroke-error-main active:stroke-neutral-10" size={20} /></td>
                    </tr>
                    <tr className="hover:cursor-pointer hover:bg-secondary-background active:bg-primary-main active:text-white">
                        <td className='text-md leading-4 py-2 w-full'><Link href=''>
                            Page Title<br />
                            <span className="text-xs"><i>Subject Category</i></span>
                        </Link></td>
                        <td><FileMinus className="stroke-error-main active:stroke-neutral-10" size={20} /></td>
                    </tr>
                </tbody>
            </table>
            <div className="btn btn-link text-secondary-main p-0 mt-auto mb-0">View all bookmarks</div>
        </div>
    )
}