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

Added my PR review comments after the merge (#1605)

Browse source
This commit is contained in:
Erik Jan de Wit 2021-11-29 13:51:31 +01:00 committed by GitHub
parent 8c62acfd63
commit f4f52ad2c8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 91 additions and 134 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

190
src/components/dynamic/MultivaluedChipsComponent.tsx
View file

@ -17,11 +17,12 @@ import type ClientScopeRepresentation from "@keycloak/keycloak-admin-client/lib/
import { useParams } from "react-router"; import { useParams } from "react-router";
import type { EditClientPolicyConditionParams } from "../../realm-settings/routes/EditCondition"; import type { EditClientPolicyConditionParams } from "../../realm-settings/routes/EditCondition";
import { GroupPickerDialog } from "../group/GroupPickerDialog"; import { GroupPickerDialog } from "../group/GroupPickerDialog";
import type GroupRepresentation from "@keycloak/keycloak-admin-client/lib/defs/groupRepresentation";
export const MultivaluedChipsComponent = ({ export const MultivaluedChipsComponent = ({
defaultValue, defaultValue,
name, name,
label,
helpText,
}: ComponentProps) => { }: ComponentProps) => {
const { t } = useTranslation("dynamic"); const { t } = useTranslation("dynamic");
const { control } = useFormContext(); const { control } = useFormContext();
@ -31,9 +32,6 @@ export const MultivaluedChipsComponent = ({
const [clientScopes, setClientScopes] = useState<ClientScopeRepresentation[]>( const [clientScopes, setClientScopes] = useState<ClientScopeRepresentation[]>(
[] []
); );
const [selectedGroups, setSelectedGroups] = useState<GroupRepresentation[]>(
[]
);
useFetch( useFetch(
() => adminClient.clientScopes.find(), () => adminClient.clientScopes.find(),
@ -49,26 +47,9 @@ export const MultivaluedChipsComponent = ({
return ( return (
<FormGroup <FormGroup
label={ label={t(label!)}
name === "scopes"
? t("realm-settings:clientScopesCondition")
: t("common:groups")
}
id={name === "scopes" ? "expected-scopes" : "expected-groups"}
labelIcon={ labelIcon={
<HelpItem <HelpItem helpText={t(helpText!)} forLabel={label!} forID={name!} />
helpText={
name === "scopes"
? t("realm-settings-help:clientScopesConditionTooltip")
: t("realm-settings-help:clientUpdaterSourceGroupsTooltip")
}
forLabel={
name === "scopes"
? t("clientScopes")
: t("clientUpdaterSourceGroups")
}
forID={name!}
/>
} }
fieldId={name!} fieldId={name!}
> >
@ -77,95 +58,84 @@ export const MultivaluedChipsComponent = ({
control={control} control={control}
defaultValue={[defaultValue]} defaultValue={[defaultValue]}
rules={{ required: true }} rules={{ required: true }}
render={({ onChange, value }) => { render={({ onChange, value }) => (
return ( <>
<> {open && name === "scopes" && (
{open && name === "scopes" && ( <AddScopeDialog
<AddScopeDialog clientScopes={clientScopes.filter(
clientScopes={clientScopes.filter( (scope) => !value.includes(scope.name!)
(scope) => !value.includes(scope.name!) )}
)} isClientScopesConditionType
isClientScopesConditionType open={open}
open={open} toggleDialog={() => setOpen(!open)}
toggleDialog={() => setOpen(!open)} onAdd={(scopes) => {
onAdd={(scopes) => { onChange([
onChange([ ...value,
...value, ...scopes
...scopes .map((scope) => scope.scope)
.map((scope) => scope.scope) .map((item) => item.name!),
.map((item) => item.name!), ]);
]);
}}
/>
)}
{open && name === "groups" && (
<GroupPickerDialog
type="selectMany"
text={{
title: "users:selectGroups",
ok: "users:join",
}}
onConfirm={(groups) => {
onChange([...value, ...groups.map((group) => group.name)]);
setSelectedGroups([...selectedGroups!, ...groups]);
setOpen(false);
}}
onClose={() => {
setOpen(false);
}}
filterGroups={value}
/>
)}
{value.length === 0 && !conditionName && (
<TextInput
type="text"
id="kc-scopes"
value={value}
data-testid="client-scope-input"
name="config.client-scopes"
isDisabled
/>
)}
<ChipGroup
className="kc-client-scopes-chip-group"
isClosable
onClick={() => {
onChange([]);
if (name === "groups") {
setSelectedGroups([]);
}
}} }}
> />
{value.map((currentChip: string) => ( )}
<Chip {open && name === "groups" && (
key={currentChip} <GroupPickerDialog
onClick={() => { type="selectMany"
onChange( text={{
value.filter((item: string) => item !== currentChip) title: "users:selectGroups",
); ok: "users:join",
if (name === "groups") {
setSelectedGroups(
value.filter((item: string) => item !== currentChip)
);
}
}}
>
{currentChip}
</Chip>
))}
</ChipGroup>
<Button
data-testid="select-scope-button"
variant="secondary"
onClick={() => {
toggleModal();
}} }}
> onConfirm={(groups) => {
{t("common:select")} onChange([...value, ...groups.map((group) => group.name)]);
</Button> setOpen(false);
</> }}
); onClose={() => {
}} setOpen(false);
}}
filterGroups={value}
/>
)}
{value.length === 0 && !conditionName && (
<TextInput
type="text"
id="kc-scopes"
value={value}
data-testid="client-scope-input"
name="config.client-scopes"
isDisabled
/>
)}
<ChipGroup
className="kc-client-scopes-chip-group"
isClosable
onClick={() => {
onChange([]);
}}
>
{value.map((currentChip: string) => (
<Chip
key={currentChip}
onClick={() => {
onChange(
value.filter((item: string) => item !== currentChip)
);
}}
>
{currentChip}
</Chip>
))}
</ChipGroup>
<Button
data-testid="select-scope-button"
variant="secondary"
onClick={() => {
toggleModal();
}}
>
{t("common:select")}
</Button>
</>
)}
/> />
</FormGroup> </FormGroup>
); );

2
src/components/dynamic/labels.ts
View file

@ -168,7 +168,7 @@ export default {
"client-updater-source-groups": { "client-updater-source-groups": {
label: "Groups", label: "Groups",
tooltip: tooltip:
"Name of groups to check. Condition evaluates to true if the entity, who creates/updates client is member of some of the specified groups. Configured groups are specified by their simple name, which must match to the name of the Keycloak group. No support for group hierarchy is used here.}", "Name of groups to check. Condition evaluates to true if the entity, who creates/updates client is member of some of the specified groups. Configured groups are specified by their simple name, which must match to the name of the Keycloak group. No support for group hierarchy is used here.",
}, },
"client-updater-trusted-hosts": { "client-updater-trusted-hosts": {
label: "Trusted hosts", label: "Trusted hosts",

33
src/realm-settings/NewClientPolicyCondition.tsx
View file

@ -291,35 +291,22 @@ export default function NewClientPolicyCondition() {
<FormProvider {...form}> <FormProvider {...form}>
{conditionProperties.map((property) => { {conditionProperties.map((property) => {
const componentType = property.type!; const componentType = property.type!;
if ( if (property.name === "roles") {
property.name === "roles" &&
(conditionType === "client-roles" ||
conditionName === "client-roles")
) {
return <MultivaluedRoleComponent {...property} />; return <MultivaluedRoleComponent {...property} />;
} else if ( }
property.name === "scopes" &&
(conditionType === "client-scopes" || if (property.name === "scopes" || property.name === "groups") {
conditionName === "client-scopes")
) {
return ( return (
<MultivaluedChipsComponent <MultivaluedChipsComponent
defaultValue="offline_access" defaultValue={
property.name === "scopes" ? "offline_access" : "topgroup"
}
{...property} {...property}
/> />
); );
} else if ( }
property.name === "groups" &&
(conditionType === "client-updater-source-groups" || if (isValidComponentType(componentType)) {
conditionName === "client-updater-source-groups")
) {
return (
<MultivaluedChipsComponent
defaultValue="topgroup"
{...property}
/>
);
} else if (isValidComponentType(componentType)) {
const Component = COMPONENTS[componentType]; const Component = COMPONENTS[componentType];
return <Component key={property.name} {...property} />; return <Component key={property.name} {...property} />;
} else { } else {