"use client"
import { useRouter } from "next/navigation";
import { Site } from "@/app/types";

export default function Sites({ id, name, description, networks }: Site) {
    const router = useRouter();
    return (
        <div className="card bg-base-200 shadow-xl">
            <div className="card-body">
                <h2 className="card-title">{name}</h2>
                <p>{description}</p>
                { networks && networks.length > 0 && (
                    <p>Networks: {networks.map((network) => network.name).join(", ")}</p>
                )}
                <div className="card-actions justify-end">
                    <button className="btn btn-secondary btn-sm btn-outline" onClick={() => router.push(`/dashboard/sites/${id}`)}>View</button>
                </div>
            </div>
        </div>
    )
}