Delte network

This commit is contained in:
headlesdev 2025-05-18 17:07:35 +02:00
parent 2c78ac633a
commit e374ecebe5
2 changed files with 50 additions and 6 deletions

View File

@ -4,8 +4,9 @@ import useSite from "@/hooks/useSite"
import { useEffect, useState } from "react"
import { EditModeToggle } from "@/components/EditModeToggle"
import AddNetwork from "@/components/dialogues/AddNetwork"
import { Plus, Pencil } from "lucide-react"
import { Plus, Pencil, Trash } from "lucide-react"
import EditNetwork from "@/components/dialogues/EditNetwork"
import DeleteNetwork from "@/components/dialogues/DeleteNetwork"
interface SitesPageProps {
username: string
@ -58,7 +59,9 @@ export default function SitesPage({ username, name, siteId }: SitesPageProps) {
<th>IPv4 Subnet</th>
<th>IPv6 Subnet</th>
<th>Gateway</th>
<th></th>
{isEditMode ? (
<th className="w-20">Actions</th>
) : null}
</tr>
</thead>
<tbody>
@ -69,12 +72,26 @@ export default function SitesPage({ username, name, siteId }: SitesPageProps) {
<td>{network.ipv4Subnet}</td>
<td>{network.ipv6Subnet}</td>
<td>{network.gateway}</td>
<td>
<button className="btn btn-primary btn-sm" onClick={() => document.getElementById('edit_network')?.showModal()}>
<Pencil className="w-5 h-5" />
</button>
{isEditMode ? (
<td className="px-0">
<div className="flex gap-1 justify-center">
<button
className="btn btn-primary btn-s px-2"
onClick={() => document.getElementById('edit_network')?.showModal()}
>
<Pencil className="w-3 h-3" />
</button>
<button
className="btn btn-error btn-s px-2"
onClick={() => document.getElementById('delete_network')?.showModal()}
>
<Trash className="w-3 h-3" />
</button>
</div>
<EditNetwork siteId={site.id} network={network} />
<DeleteNetwork networkId={network.id} />
</td>
) : null}
</tr>
))}
</tbody>

View File

@ -0,0 +1,27 @@
"use client";
import useNetworks from "@/hooks/useNetworks";
interface DeleteNetworkProps {
networkId: string;
}
export default function DeleteNetwork({ networkId }: DeleteNetworkProps) {
const { deleteNetwork } = useNetworks();
return (
<div>
<dialog id="delete_network" className="modal">
<div className="modal-box w-2/3 max-w-2/3">
<h3 className="text-lg font-bold">Delete Network</h3>
<p className="py-4">Are you sure you want to delete this network?</p>
<div className="modal-action">
<form method="dialog">
<button className="btn">Cancel</button>
<button className="btn btn-primary" onClick={() => deleteNetwork(networkId)}>Delete</button>
</form>
</div>
</div>
</dialog>
</div>
);
}