ben.carrasco/prowler
1
0
Fork 0
mirror of https://github.com/prowler-cloud/prowler.git synced 2026-07-24 13:01:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(poc): Add in more data from api

Browse Source
This commit is contained in:
Sophia Dao
2024-06-26 08:31:02 -05:00
parent 385eb5cc18
commit ccfc46d743
1 changed files with 5 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/clouds/page.tsx
+5 -216
View File
@@ -22,72 +22,6 @@ import { PencilSquareIcon } from "@heroicons/react/24/solid";
import { TrashIcon } from "@heroicons/react/24/solid";
import { EyeIcon } from "@heroicons/react/24/solid";
const statusColorMap = {
active: "success",
paused: "danger",
vacation: "warning",
};
const columns = [
{ name: "NAME", uid: "name" },
{ name: "ROLE", uid: "role" },
{ name: "STATUS", uid: "status" },
{ name: "ACTIONS", uid: "actions" },
];
const users = [
{
id: 1,
name: "Tony Reichert",
role: "CEO",
team: "Management",
status: "active",
age: "29",
avatar: "https://i.pravatar.cc/150?u=a042581f4e29026024d",
email: "tony.reichert@example.com",
},
{
id: 2,
name: "Zoey Lang",
role: "Technical Lead",
team: "Development",
status: "paused",
age: "25",
avatar: "https://i.pravatar.cc/150?u=a042581f4e29026704d",
email: "zoey.lang@example.com",
},
{
id: 3,
name: "Jane Fisher",
role: "Senior Developer",
team: "Development",
status: "active",
age: "22",
avatar: "https://i.pravatar.cc/150?u=a04258114e29026702d",
email: "jane.fisher@example.com",
},
{
id: 4,
name: "William Howard",
role: "Community Manager",
team: "Marketing",
status: "vacation",
age: "28",
avatar: "https://i.pravatar.cc/150?u=a048581f4e29026701d",
email: "william.howard@example.com",
},
{
id: 5,
name: "Kristen Copper",
role: "Sales Manager",
team: "Sales",
status: "active",
age: "24",
avatar: "https://i.pravatar.cc/150?u=a092581d4ef9026700d",
email: "kristen.cooper@example.com",
},
];
export default function CloudsPage() {
const getAccounts = useSWR(
`http://localhost:8080/api/v1/providers/aws/accounts`,
@@ -114,7 +48,7 @@ export default function CloudsPage() {
}
if (detail === "added") {
return new Date(scan?.inserted_at).toString();
return new Date(scan?.inserted_at).toDateString();
}
return;
@@ -126,10 +60,10 @@ export default function CloudsPage() {
// TODO FIX TYPE CHECKING
const rowItems = getAccounts.data?.map((row: any) => (
<TableRow key={row.id}>
<TableCell>{row.account_id}</TableCell>
<TableCell>{row.aws_account_id}</TableCell>
<TableCell>{row.provider_id}</TableCell>
<TableCell>TBD</TableCell>
<TableCell>TBD</TableCell>
<TableCell>{row.alias}</TableCell>
<TableCell>{row.connected && "Connected"}</TableCell>
<TableCell>{row.groups.map(String).join(", ")}</TableCell>
<TableCell>{getScanDetails(row.account_id, "status")}</TableCell>
<TableCell>{getScanDetails(row.account_id, "duration")}</TableCell>
@@ -139,126 +73,7 @@ export default function CloudsPage() {
</TableRow>
));
// console.log("### rows", rows);
// const rows = data;
// const rows = [
// {
// key: "1",
// name: "Tony Reichert",
// role: "CEO",
// status: "Active",
// },
// {
// key: "2",
// name: "Zoey Lang",
// role: "Technical Lead",
// status: "Paused",
// },
// {
// key: "3",
// name: "Jane Fisher",
// role: "Senior Developer",
// status: "Active",
// },
// {
// key: "4",
// name: "William Howard",
// role: "Community Manager",
// status: "Vacation",
// },
// ];
// const columns = [
// {
// key: "provider_id",
// label: "Account",
// },
// {
// key: "groups",
// label: "Group(s)",
// },
// {
// key: "status",
// label: "Scan Status",
// },
// {
// key: "lastScan",
// label: "Last Scan",
// },
// {
// key: "nextScan",
// label: "Next Scan",
// },
// {
// key: "resources",
// label: "Resources",
// },
// {
// key: "added",
// label: "Added",
// },
// ];
const renderCell = React.useCallback((user, columnKey) => {
const cellValue = user[columnKey];
switch (columnKey) {
case "name":
return (
<User
avatarProps={{ radius: "lg", src: user.avatar }}
description={user.email}
name={cellValue}
>
{user.email}
</User>
);
case "role":
return (
<div className="flex flex-col">
<p className="text-bold text-sm capitalize">{cellValue}</p>
<p className="text-bold text-sm capitalize text-default-400">
{user.team}
</p>
</div>
);
case "status":
return (
<Chip
className="capitalize"
color={statusColorMap[user.status]}
size="sm"
variant="flat"
>
{cellValue}
</Chip>
);
case "actions":
return (
<div className="relative flex items-center gap-2">
<Tooltip content="Details">
<span className="text-lg text-default-400 cursor-pointer active:opacity-50">
<EyeIcon className="w-5 h-5" />
</span>
</Tooltip>
<Tooltip content="Edit user">
<span className="text-lg text-default-400 cursor-pointer active:opacity-50">
<PencilSquareIcon className="w-5 h-5" />
</span>
</Tooltip>
<Tooltip color="danger" content="Delete user">
<span className="text-lg text-danger cursor-pointer active:opacity-50">
<TrashIcon className="w-5 h-5" />
</span>
</Tooltip>
</div>
);
default:
return cellValue;
}
}, []);
// TODO IMPLEMENT NEXT UI SPECIFIC TABLE COMPONENT WITH VARIED RENDERING
return (
<div>
@@ -287,32 +102,6 @@ export default function CloudsPage() {
</TableHeader>
<TableBody>{rowItems}</TableBody>
</Table>
// <Table
// isStriped
// aria-label="cloud accounts table"
// className="text-left mt-10"
// >
// <TableHeader columns={columns}>
// {(column) => (
// <TableColumn
// key={column.uid}
// align={column.uid === "actions" ? "center" : "start"}
// >
// {column.name}
// </TableColumn>
// )}
// </TableHeader>
// <TableBody items={users}>
// {(item) => (
// <TableRow key={item.id}>
// {(columnKey) => (
// <TableCell>{renderCell(item, columnKey)}</TableCell>
// )}
// </TableRow>
// )}
// </TableBody>
// </Table>
)}
<p className="mt-24">This is a page with "use client", useSWR</p>
</div>