134 lines
4.7 KiB
JavaScript
134 lines
4.7 KiB
JavaScript
import React from "react";
|
|
import TopHeader from "../components/topHeader/TopHeader";
|
|
import globalStyle from "../globalStyle.module.css";
|
|
import styles from "./styles.module.css";
|
|
const CredentialsPage = () => {
|
|
const sampleData = [
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
{
|
|
name: "mongo tls ca crt",
|
|
organizationID: "67160a5ae69144ff19aafb86",
|
|
},
|
|
];
|
|
return (
|
|
<div className={globalStyle.section}>
|
|
<div className={globalStyle.mainContainer}>
|
|
<div className={globalStyle.container}>
|
|
<TopHeader buttonText="Add Credentials" topbarTitle="Credentials" />
|
|
<div className={styles.tableContainer}>
|
|
<table className={styles.table}>
|
|
<thead>
|
|
<tr>
|
|
<th width="45%">Name</th>
|
|
<th width="45%">Organization ID</th>
|
|
<th width="10%"></th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
{sampleData.map((org, index) => {
|
|
return (
|
|
<tr key={index}>
|
|
<td>{org.name}</td>
|
|
<td>{org.organizationID}</td>
|
|
<td className={styles.actions}>
|
|
<div>
|
|
<button className={styles.iconButton}>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width={20}
|
|
height={20}
|
|
viewBox="0 0 20 20"
|
|
fill="none"
|
|
>
|
|
<path
|
|
d="M3.61133 6.00684H16.3891"
|
|
stroke="#969AF9"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
<path
|
|
d="M8.40234 9.20117V13.9928"
|
|
stroke="#969AF9"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
<path
|
|
d="M11.5977 9.20117V13.9928"
|
|
stroke="#969AF9"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
<path
|
|
d="M4.41016 6.00684L5.20877 15.5902C5.20877 16.0138 5.37705 16.42 5.67658 16.7196C5.97612 17.0191 6.38238 17.1874 6.80599 17.1874H13.1949C13.6185 17.1874 14.0247 17.0191 14.3243 16.7196C14.6238 16.42 14.7921 16.0138 14.7921 15.5902L15.5907 6.00684"
|
|
stroke="#969AF9"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
<path
|
|
d="M7.60352 6.00694V3.61111C7.60352 3.39931 7.68765 3.19618 7.83742 3.04641C7.98719 2.89664 8.19032 2.8125 8.40213 2.8125H11.5966C11.8084 2.8125 12.0115 2.89664 12.1613 3.04641C12.311 3.19618 12.3952 3.39931 12.3952 3.61111V6.00694"
|
|
stroke="#969AF9"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
);
|
|
})}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default CredentialsPage;
|