Added sync period settings to custom UI (#3770)
This commit is contained in:
parent
5553212e35
commit
27d8b35d70
2 changed files with 127 additions and 0 deletions
|
@ -25,6 +25,7 @@ import { ExtendedHeader } from "../shared/ExtendedHeader";
|
|||
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
|
||||
import { DynamicComponents } from "../../components/dynamic/DynamicComponents";
|
||||
import { convertFormValuesToObject, convertToFormValues } from "../../util";
|
||||
import { SyncSettings } from "./SyncSettings";
|
||||
|
||||
import "./custom-provider-settings.css";
|
||||
|
||||
|
@ -33,6 +34,7 @@ export default function CustomProviderSettings() {
|
|||
const { id, providerId } = useParams<ProviderRouteParams>();
|
||||
const navigate = useNavigate();
|
||||
const form = useForm<ComponentRepresentation>({
|
||||
shouldUnregister: false,
|
||||
mode: "onChange",
|
||||
});
|
||||
const {
|
||||
|
@ -146,6 +148,7 @@ export default function CustomProviderSettings() {
|
|||
</FormGroup>
|
||||
<FormProvider {...form}>
|
||||
<DynamicComponents properties={provider?.properties || []} />
|
||||
{provider?.metadata.synchronizable && <SyncSettings />}
|
||||
</FormProvider>
|
||||
<SettingsCache form={form} unWrap />
|
||||
<ActionGroup>
|
||||
|
|
124
apps/admin-ui/src/user-federation/custom/SyncSettings.tsx
Normal file
124
apps/admin-ui/src/user-federation/custom/SyncSettings.tsx
Normal file
|
@ -0,0 +1,124 @@
|
|||
import { useTranslation } from "react-i18next";
|
||||
import { Controller, useFormContext } from "react-hook-form";
|
||||
import { FormGroup, Switch } from "@patternfly/react-core";
|
||||
|
||||
import { HelpItem } from "../../components/help-enabler/HelpItem";
|
||||
import { KeycloakTextInput } from "../../components/keycloak-text-input/KeycloakTextInput";
|
||||
|
||||
export const SyncSettings = () => {
|
||||
const { t } = useTranslation("user-federation");
|
||||
const { control, register, watch } = useFormContext();
|
||||
const watchPeriodicSync = watch("config.fullSyncPeriod", "-1");
|
||||
const watchChangedSync = watch("config.changedSyncPeriod", "-1");
|
||||
|
||||
return (
|
||||
<>
|
||||
<FormGroup
|
||||
label={t("periodicFullSync")}
|
||||
labelIcon={
|
||||
<HelpItem
|
||||
helpText="user-federation-help:periodicFullSyncHelp"
|
||||
fieldLabelId="user-federation:periodicFullSync"
|
||||
/>
|
||||
}
|
||||
fieldId="kc-periodic-full-sync"
|
||||
hasNoPaddingTop
|
||||
>
|
||||
<Controller
|
||||
name="config.fullSyncPeriod"
|
||||
defaultValue="-1"
|
||||
control={control}
|
||||
render={({ onChange, value }) => (
|
||||
<Switch
|
||||
id="kc-periodic-full-sync"
|
||||
data-testid="periodic-full-sync"
|
||||
onChange={(value) => {
|
||||
onChange(value ? "604800" : "-1");
|
||||
}}
|
||||
isChecked={value !== "-1"}
|
||||
label={t("common:on")}
|
||||
labelOff={t("common:off")}
|
||||
aria-label={t("periodicFullSync")}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</FormGroup>
|
||||
{watchPeriodicSync !== "-1" && (
|
||||
<FormGroup
|
||||
hasNoPaddingTop
|
||||
label={t("fullSyncPeriod")}
|
||||
labelIcon={
|
||||
<HelpItem
|
||||
helpText="user-federation-help:fullSyncPeriodHelp"
|
||||
fieldLabelId="user-federation:fullSyncPeriod"
|
||||
/>
|
||||
}
|
||||
fieldId="kc-full-sync-period"
|
||||
>
|
||||
<KeycloakTextInput
|
||||
type="number"
|
||||
min={-1}
|
||||
defaultValue="604800"
|
||||
id="kc-full-sync-period"
|
||||
data-testid="full-sync-period"
|
||||
name="config.fullSyncPeriod"
|
||||
ref={register}
|
||||
/>
|
||||
</FormGroup>
|
||||
)}
|
||||
<FormGroup
|
||||
label={t("periodicChangedUsersSync")}
|
||||
labelIcon={
|
||||
<HelpItem
|
||||
helpText="user-federation-help:periodicChangedUsersSyncHelp"
|
||||
fieldLabelId="user-federation:periodicChangedUsersSync"
|
||||
/>
|
||||
}
|
||||
fieldId="kc-periodic-changed-users-sync"
|
||||
hasNoPaddingTop
|
||||
>
|
||||
<Controller
|
||||
name="config.changedSyncPeriod"
|
||||
defaultValue="-1"
|
||||
control={control}
|
||||
render={({ onChange, value }) => (
|
||||
<Switch
|
||||
id="kc-periodic-changed-users-sync"
|
||||
data-testid="periodic-changed-users-sync"
|
||||
onChange={(value) => {
|
||||
onChange(value ? "86400" : "-1");
|
||||
}}
|
||||
isChecked={value !== "-1"}
|
||||
label={t("common:on")}
|
||||
labelOff={t("common:off")}
|
||||
aria-label={t("periodicChangedUsersSync")}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</FormGroup>
|
||||
{watchChangedSync !== "-1" && (
|
||||
<FormGroup
|
||||
label={t("changedUsersSyncPeriod")}
|
||||
labelIcon={
|
||||
<HelpItem
|
||||
helpText="user-federation-help:changedUsersSyncHelp"
|
||||
fieldLabelId="user-federation:changedUsersSyncPeriod"
|
||||
/>
|
||||
}
|
||||
fieldId="kc-changed-users-sync-period"
|
||||
hasNoPaddingTop
|
||||
>
|
||||
<KeycloakTextInput
|
||||
type="number"
|
||||
min={-1}
|
||||
defaultValue="86400"
|
||||
id="kc-changed-users-sync-period"
|
||||
data-testid="changed-users-sync-period"
|
||||
name="config.changedSyncPeriod"
|
||||
ref={register}
|
||||
/>
|
||||
</FormGroup>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
Loading…
Reference in a new issue