Laux/Frontend-Internal-Developer-Platform
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed

Browse Source
This commit is contained in:
Laux Dev
2026-03-16 10:19:36 +08:00
parent 30534eb169
commit e1ec8a90c1
17 changed files with 260 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
frontend/src/app/agents/page.jsx
View File

@@ -8,6 +8,10 @@ import { useRouter } from "next/navigation";
import ActionButton from "../components/actionButton/ActionButton";
import DeleteIcon from "../components/icons/delete";
import ViewIcon from "../components/icons/view";
import useIsMobile from "../hooks/useIsMobile";
import Card from "./card/Card";
import SearchIcon from "../components/icons/search";
import MobileSearchBar from "../components/mobileSearchBar/MobileSearchBar";
const AgentsPage = () => {
const router = useRouter();
@@ -98,6 +102,7 @@ const AgentsPage = () => {
dateCreated: "2/11/2026",
},
];
const isMobile = useIsMobile();
return (
<div className={globalStyle.section}>
<div className={globalStyle.mainContainer}>
@@ -107,50 +112,59 @@ const AgentsPage = () => {
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>
{isMobile ? (
<div className={styles.cardContainer}>
<MobileSearchBar />
{sampleData.map((data, key) => {
return <Card data={data} key={key} />;
})}
</div>
) : (
<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>
<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 />} />
<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>
<div>
<ActionButton icon={<DeleteIcon />} />
</div>
</div>
</td>
</tr>
);
})}
</tbody>
</table>
</div>
</td>
</tr>
);
})}
</tbody>
</table>
</div>
)}
</div>
</div>
</div>