diff --git a/src/components/dynamic/PasswordComponent.tsx b/src/components/dynamic/PasswordComponent.tsx new file mode 100644 index 0000000000..3f735eac5c --- /dev/null +++ b/src/components/dynamic/PasswordComponent.tsx @@ -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 ( + + } + fieldId={name!} + > + + + ); +}; diff --git a/src/components/dynamic/components.ts b/src/components/dynamic/components.ts index 849572a3de..87ab1cde11 100644 --- a/src/components/dynamic/components.ts +++ b/src/components/dynamic/components.ts @@ -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 & { 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 => diff --git a/src/user-federation/custom/CustomProviderSettings.tsx b/src/user-federation/custom/CustomProviderSettings.tsx index 6714e370c0..d402632748 100644 --- a/src/user-federation/custom/CustomProviderSettings.tsx +++ b/src/user-federation/custom/CustomProviderSettings.tsx @@ -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"} /> + + +