Added dynamic properties to custom provider (#3042)

This commit is contained in:
Erik Jan de Wit 2022-08-04 12:10:59 +02:00 committed by GitHub
parent 760af5db35
commit 2ecbb60d56
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 51 additions and 0 deletions

View file

@ -0,0 +1,37 @@
import { useTranslation } from "react-i18next";
import { useFormContext } from "react-hook-form";
import { FormGroup } from "@patternfly/react-core";
import type { ComponentProps } from "./components";
import { HelpItem } from "../help-enabler/HelpItem";
import { PasswordInput } from "../password-input/PasswordInput";
export const PasswordComponent = ({
name,
label,
helpText,
defaultValue,
isDisabled = false,
}: ComponentProps) => {
const { t } = useTranslation("dynamic");
const { register } = useFormContext();
return (
<FormGroup
label={t(label!)}
labelIcon={
<HelpItem helpText={t(helpText!)} fieldLabelId={`dynamic:${label}`} />
}
fieldId={name!}
>
<PasswordInput
id={name!}
data-testid={name}
isDisabled={isDisabled}
ref={register()}
name={`config.${name}`}
defaultValue={defaultValue?.toString()}
/>
</FormGroup>
);
};

View file

@ -12,6 +12,7 @@ import { MultiValuedStringComponent } from "./MultivaluedStringComponent";
import { MultiValuedListComponent } from "./MultivaluedListComponent";
import { GroupComponent } from "./GroupComponent";
import { FileComponent } from "./FileComponent";
import { PasswordComponent } from "./PasswordComponent";
export type ComponentProps = Omit<ConfigPropertyRepresentation, "type"> & {
isDisabled?: boolean;
@ -29,6 +30,7 @@ const ComponentTypes = [
"ClientList",
"MultivaluedString",
"File",
"Password",
] as const;
export type Components = typeof ComponentTypes[number];
@ -47,6 +49,7 @@ export const COMPONENTS: {
MultivaluedList: MultiValuedListComponent,
MultivaluedString: MultiValuedStringComponent,
File: FileComponent,
Password: PasswordComponent,
} as const;
export const isValidComponentType = (value: string): value is Components =>

View file

@ -21,6 +21,8 @@ import { useRealm } from "../../context/realm-context/RealmContext";
import { useAlerts } from "../../components/alert/Alerts";
import { SettingsCache } from "../shared/SettingsCache";
import { ExtendedHeader } from "../shared/ExtendedHeader";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
import { DynamicComponents } from "../../components/dynamic/DynamicComponents";
import "./custom-provider-settings.css";
@ -44,6 +46,12 @@ export default function CustomProviderSettings() {
const { realm: realmName } = useRealm();
const [parentId, setParentId] = useState("");
const provider = (
useServerInfo().componentTypes?.[
"org.keycloak.storage.UserStorageProvider"
] || []
).find((p) => p.id === providerId);
useFetch(
async () => {
if (id) {
@ -126,6 +134,9 @@ export default function CustomProviderSettings() {
validated={errors.name ? "error" : "default"}
/>
</FormGroup>
<FormProvider {...form}>
<DynamicComponents properties={provider?.properties || []} />
</FormProvider>
<SettingsCache form={form} unWrap />
<ActionGroup>
<Button