libre.sh/keycloak-scim
3
0
Fork 0
Code Issues 15 Pull requests Releases 1 Packages Activity Actions

Added search and operational info (#2530)

Browse source
This commit is contained in:
Erik Jan de Wit 2022-05-02 16:30:24 +02:00 committed by GitHub
parent c7c15bbb9a
commit 5ebb50816d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 111 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
package-lock.json generated
View file

@ -7,7 +7,7 @@
"name": "keycloak-admin-ui",
"license": "Apache",
"dependencies": {
"@keycloak/keycloak-admin-client": "^18.0.1-dev.4",
"@keycloak/keycloak-admin-client": "^19.0.0-dev.0",
"@patternfly/patternfly": "^4.185.1",
"@patternfly/react-code-editor": "^4.43.16",
"@patternfly/react-core": "^4.202.16",
@ -3942,9 +3942,9 @@
}
},
"node_modules/@keycloak/keycloak-admin-client": {
"version": "18.0.1-dev.4",
"resolved": "https://registry.npmjs.org/@keycloak/keycloak-admin-client/-/keycloak-admin-client-18.0.1-dev.4.tgz",
"integrity": "sha512-J3do2wqPaSLddVABzZ9K5h/WXNmC751rO+glIORJNwXRIcl38b0oziD5fMzAgRhmsu1egZrEDM8h89phdFj2Cw==",
"version": "19.0.0-dev.0",
"resolved": "https://registry.npmjs.org/@keycloak/keycloak-admin-client/-/keycloak-admin-client-19.0.0-dev.0.tgz",
"integrity": "sha512-QkCPuWUxf0rVw/V24VoaLC4luDLePGScyT12pVYaujZX9VaWQTNdZS3Ipm47W2+kNQQvL2NPWxKkWJmEWXyMiQ==",
"dependencies": {
"axios": "^0.26.1",
"camelize-ts": "^1.0.8",
@ -26699,9 +26699,9 @@
}
},
"@keycloak/keycloak-admin-client": {
"version": "18.0.1-dev.4",
"resolved": "https://registry.npmjs.org/@keycloak/keycloak-admin-client/-/keycloak-admin-client-18.0.1-dev.4.tgz",
"integrity": "sha512-J3do2wqPaSLddVABzZ9K5h/WXNmC751rO+glIORJNwXRIcl38b0oziD5fMzAgRhmsu1egZrEDM8h89phdFj2Cw==",
"version": "19.0.0-dev.0",
"resolved": "https://registry.npmjs.org/@keycloak/keycloak-admin-client/-/keycloak-admin-client-19.0.0-dev.0.tgz",
"integrity": "sha512-QkCPuWUxf0rVw/V24VoaLC4luDLePGScyT12pVYaujZX9VaWQTNdZS3Ipm47W2+kNQQvL2NPWxKkWJmEWXyMiQ==",
"requires": {
"axios": "^0.26.1",
"camelize-ts": "^1.0.8",

2
package.json
View file

@ -25,7 +25,7 @@
"server:import-client": "./scripts/import-client.mjs"
},
"dependencies": {
"@keycloak/keycloak-admin-client": "^18.0.1-dev.4",
"@keycloak/keycloak-admin-client": "^19.0.0-dev.0",
"@patternfly/patternfly": "^4.185.1",
"@patternfly/react-code-editor": "^4.43.16",
"@patternfly/react-core": "^4.202.16",

4
public/resources/en/dashboard.json
View file

@ -16,5 +16,7 @@
"providerInfo": "Provider info",
"providers": "Providers",
"realmInfo": "Realm info",
"spi": "SPI"
"spi": "SPI",
"showMore": "Show more",
"showLess": "Show less"
}

37
src/dashboard/Dashboard.tsx
View file

@ -26,14 +26,6 @@ import {
TextContent,
Title,
} from "@patternfly/react-core";
import {
TableComposable,
Tbody,
Td,
Th,
Thead,
Tr,
} from "@patternfly/react-table";
import { useRealm } from "../context/realm-context/RealmContext";
import { useServerInfo } from "../context/server-info/ServerInfoProvider";
@ -48,6 +40,7 @@ import {
import { DashboardTab, toDashboard } from "./routes/Dashboard";
import "./dashboard.css";
import { ProviderInfo } from "./ProviderInfo";
const EmptyDashboard = () => {
const { t } = useTranslation("dashboard");
@ -221,33 +214,7 @@ const Dashboard = () => {
title={<TabTitleText>{t("providerInfo")}</TabTitleText>}
{...route("providers")}
>
<PageSection variant="light">
<TableComposable variant="compact">
<Thead>
<Tr>
<Th width={20}>{t("spi")}</Th>
<Th>{t("providers")}</Th>
</Tr>
</Thead>
<Tbody>
{Object.keys(serverInfo.providers || []).map((name) => (
<Tr key={name}>
<Td>{name}</Td>
<Td>
<ul>
{Object.keys(
serverInfo.providers?.[name].providers || []
).map((value) => (
<li key={value}>{value}</li>
))}
</ul>
</Td>
</Tr>
))}
</Tbody>
</TableComposable>
<ul></ul>
</PageSection>
<ProviderInfo />
</Tab>
</RoutableTabs>
</PageSection>

98
src/dashboard/ProviderInfo.tsx Normal file
View file

@ -0,0 +1,98 @@
import React, { Fragment, useMemo, useState } from "react";
import { useTranslation } from "react-i18next";
import { ExpandableSection, PageSection } from "@patternfly/react-core";
import {
TableComposable,
Tbody,
Td,
Th,
Thead,
Tr,
} from "@patternfly/react-table";
import { useServerInfo } from "../context/server-info/ServerInfoProvider";
import { TableToolbar } from "../components/table-toolbar/TableToolbar";
export const ProviderInfo = () => {
const { t } = useTranslation("dashboard");
const serverInfo = useServerInfo();
const [filter, setFilter] = useState("");
const [open, setOpen] = useState<string[]>([]);
const providerInfo = useMemo(
() =>
Object.entries(serverInfo.providers || []).filter(([key]) =>
key.includes(filter)
),
[filter]
);
const toggleOpen = (option: string) => {
if (open.includes(option)) {
setOpen(open.filter((item: string) => item !== option));
} else {
setOpen([...open, option]);
}
};
return (
<PageSection variant="light">
<TableToolbar
inputGroupName="search"
inputGroupPlaceholder={t("common:search")}
inputGroupOnEnter={setFilter}
>
<TableComposable variant="compact">
<Thead>
<Tr>
<Th width={20}>{t("spi")}</Th>
<Th>{t("providers")}</Th>
</Tr>
</Thead>
<Tbody>
{providerInfo.map(([name, { providers }]) => (
<Tr key={name}>
<Td>{name}</Td>
<Td>
<ul>
{Object.entries(providers).map(
([key, { operationalInfo }]) => (
<Fragment key={key}>
<li>{key}</li>
{operationalInfo && (
<ExpandableSection
isExpanded={open.includes(key)}
onToggle={() => toggleOpen(key)}
toggleText={
open.includes(key)
? t("showLess")
: t("showMore")
}
>
<TableComposable borders={false}>
<Tbody>
{Object.entries(operationalInfo).map(
([key, value]) => (
<Tr key={key}>
<Td>{key}</Td>
<Td>{value}</Td>
</Tr>
)
)}
</Tbody>
</TableComposable>
</ExpandableSection>
)}
</Fragment>
)
)}
</ul>
</Td>
</Tr>
))}
</Tbody>
</TableComposable>
</TableToolbar>
</PageSection>
);
};