authenticate: update user info dashboard to show group info for enterprise (#3736)

* authenticate: update user info dashboard to show group info for enterprise

* Update ui/src/components/GroupDetails.tsx

Co-authored-by: bobby <1544881+desimone@users.noreply.github.com>

Co-authored-by: bobby <1544881+desimone@users.noreply.github.com>
This commit is contained in:
Caleb Doxsey 2022-11-09 07:44:35 -07:00 committed by GitHub
parent 45ce6f693a
commit 2b319822a4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 118 additions and 26 deletions

View file

@ -1,6 +1,4 @@
import { Group } from "../types";
import IDField from "./IDField";
import Section from "./Section";
import Alert from "@mui/material/Alert";
import Table from "@mui/material/Table";
import TableBody from "@mui/material/TableBody";
import TableCell from "@mui/material/TableCell";
@ -9,32 +7,50 @@ import TableHead from "@mui/material/TableHead";
import TableRow from "@mui/material/TableRow";
import React, { FC } from "react";
import { Group } from "../types";
import IDField from "./IDField";
import Section from "./Section";
export type GroupDetailsProps = {
isEnterprise: boolean;
groups: Group[];
};
export const GroupDetails: FC<GroupDetailsProps> = ({ groups }) => {
export const GroupDetails: FC<GroupDetailsProps> = ({
isEnterprise,
groups,
}) => {
return (
<Section title="Groups">
<TableContainer>
<Table size="small">
<TableHead>
<TableRow>
<TableCell>ID</TableCell>
<TableCell>Name</TableCell>
</TableRow>
</TableHead>
<TableBody>
{groups?.map((group) => (
<TableRow key={group?.id}>
<TableCell>
<IDField value={group?.id} />
</TableCell>
<TableCell>{group?.name}</TableCell>
{isEnterprise ? (
<TableContainer>
<Table size="small">
<TableHead>
<TableRow>
<TableCell>ID</TableCell>
<TableCell>Name</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</TableContainer>
</TableHead>
<TableBody>
{groups?.map((group) => (
<TableRow key={group?.id}>
<TableCell>
<IDField value={group?.id} />
</TableCell>
<TableCell>{group?.name}</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</TableContainer>
) : (
<Alert severity="info">
Groups via directory sync are available in{" "}
<a href="https://www.pomerium.com/enterprise-sales/">
Pomerium Enterprise
</a>
.
</Alert>
)}
</Section>
);
};