161 lines
4.6 KiB
JavaScript
161 lines
4.6 KiB
JavaScript
"use client";
|
|
|
|
import React from "react";
|
|
import styles from "./styles.module.css";
|
|
import TopHeader from "../components/topHeader/TopHeader";
|
|
import globalStyle from "../globalStyle.module.css";
|
|
import { useRouter } from "next/navigation";
|
|
import ActionButton from "../components/actionButton/ActionButton";
|
|
import DeleteIcon from "../components/icons/delete";
|
|
import ViewIcon from "../components/icons/view";
|
|
|
|
const AgentsPage = () => {
|
|
const router = useRouter();
|
|
|
|
const sampleData = [
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
{
|
|
name: "DOKS OneCB Dev",
|
|
endPoint: "http://100.64.1.9:6969",
|
|
type: "Tailscale",
|
|
proxyName: "doks-onecbdev-kube-apiserver-proxy",
|
|
dateCreated: "2/11/2026",
|
|
},
|
|
];
|
|
return (
|
|
<div className={globalStyle.section}>
|
|
<div className={globalStyle.mainContainer}>
|
|
<div className={globalStyle.container}>
|
|
<TopHeader
|
|
buttonText="Add Agents"
|
|
topbarTitle="Agents"
|
|
requiredButtons={["title", "add", "search"]}
|
|
/>
|
|
<div className={styles.tableContainer}>
|
|
<table className={styles.table}>
|
|
<thead>
|
|
<tr>
|
|
<th width="25%">Name</th>
|
|
<th>Endpoint</th>
|
|
<th>Type</th>
|
|
<th>Proxy Name</th>
|
|
<th>Date Created</th>
|
|
|
|
<th width="10%"></th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
{sampleData.map((org, index) => {
|
|
return (
|
|
<tr
|
|
key={index}
|
|
onClick={() => router.push(`/agents/${org.name}`)}
|
|
>
|
|
<td>{org.name}</td>
|
|
<td>{org.endPoint}</td>
|
|
<td>
|
|
<div className={styles.type}>{org.type}</div>
|
|
</td>
|
|
<td>{org.proxyName}</td>
|
|
<td>{org.dateCreated}</td>
|
|
<td>
|
|
<div className={styles.actions}>
|
|
<div>
|
|
<ActionButton icon={<ViewIcon />} />
|
|
</div>
|
|
<div>
|
|
<ActionButton icon={<DeleteIcon />} />
|
|
</div>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
);
|
|
})}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default AgentsPage;
|