fixes issue with selected locals (#1200)

fixes: #1179
This commit is contained in:
Erik Jan de Wit 2021-09-23 16:15:37 +02:00 committed by GitHub
parent 453b5a07e7
commit 8a9f96e53a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -70,7 +70,6 @@ export const LocalizationTab = ({
control, control,
name: "supportedLocales", name: "supportedLocales",
}); });
const internationalizationEnabled = useWatch({ const internationalizationEnabled = useWatch({
control, control,
name: "internationalizationEnabled", name: "internationalizationEnabled",
@ -208,110 +207,107 @@ export const LocalizationTab = ({
)} )}
/> />
</FormGroup> </FormGroup>
{internationalizationEnabled && ( <FormGroup
<> label={t("supportedLocales")}
<FormGroup fieldId="kc-l-supported-locales"
label={t("supportedLocales")} >
fieldId="kc-l-supported-locales" <Controller
> name="supportedLocales"
<Controller control={control}
name="supportedLocales" render={({ onChange, value }) => {
control={control} return internationalizationEnabled ? (
render={({ onChange }) => ( <Select
<Select toggleId="kc-l-supported-locales"
toggleId="kc-l-supported-locales" onToggle={(open) => {
onToggle={() => { setSupportedLocalesOpen(open);
setSupportedLocalesOpen(!supportedLocalesOpen); }}
}} onSelect={(_, v) => {
onSelect={(_, v) => { const option = v as string;
const option = v as string; if (!value) {
if (!watchSupportedLocales) { onChange([option]);
onChange([option]); } else if (value.includes(option)) {
} else if (watchSupportedLocales!.includes(option)) { onChange(
onChange( value.filter((item: string) => item !== option)
watchSupportedLocales.filter( );
(item: string) => item !== option } else {
) onChange([...value, option]);
);
} else {
onChange([...watchSupportedLocales, option]);
}
}}
onClear={() => {
onChange([]);
}}
selections={watchSupportedLocales}
variant={SelectVariant.typeaheadMulti}
aria-label={t("supportedLocales")}
isOpen={supportedLocalesOpen}
placeholderText={"Select locales"}
>
{themeTypes.login![0].locales.map(
(locale: string, idx: number) => (
<SelectOption
selected={true}
key={`locale-${idx}`}
value={locale}
>
{t(`allSupportedLocales.${locale}`)}
</SelectOption>
)
)}
</Select>
)}
/>
</FormGroup>
<FormGroup
label={t("defaultLocale")}
fieldId="kc-l-default-locale"
>
<Controller
name="defaultLocale"
control={control}
render={({ onChange, value }) => (
<Select
toggleId="kc-default-locale"
onToggle={() =>
setDefaultLocaleOpen(!defaultLocaleOpen)
} }
onSelect={(_, value) => { }}
onChange(value as string); onClear={() => {
setValueSelected(true); onChange([]);
setDefaultLocaleOpen(false); }}
}} selections={value}
selections={ variant={SelectVariant.typeaheadMulti}
valueSelected aria-label={t("supportedLocales")}
? t(`allSupportedLocales.${value}`) isOpen={supportedLocalesOpen}
: realm.defaultLocale !== "" placeholderText={"Select locales"}
? t( >
`allSupportedLocales.${ {themeTypes.login![0].locales.map(
realm.defaultLocale || DEFAULT_LOCALE (locale: string, idx: number) => (
}` <SelectOption
) selected={true}
: t("placeholderText") key={`locale-${idx}`}
} value={locale}
variant={SelectVariant.single} >
aria-label={t("defaultLocale")} {t(`allSupportedLocales.${locale}`)}
isOpen={defaultLocaleOpen} </SelectOption>
placeholderText={t("placeholderText")} )
data-testid="select-default-locale" )}
> </Select>
{watchSupportedLocales?.map( ) : (
(locale: string, idx: number) => ( <div />
<SelectOption );
key={`default-locale-${idx}`} }}
value={locale} />
> </FormGroup>
{t(`allSupportedLocales.${locale}`)} <FormGroup label={t("defaultLocale")} fieldId="kc-l-default-locale">
</SelectOption> <Controller
) name="defaultLocale"
)} control={control}
</Select> render={({ onChange, value }) => {
)} return internationalizationEnabled ? (
/> <Select
</FormGroup> toggleId="kc-default-locale"
</> onToggle={() => setDefaultLocaleOpen(!defaultLocaleOpen)}
)} onSelect={(_, value) => {
onChange(value as string);
setValueSelected(true);
setDefaultLocaleOpen(false);
}}
selections={
valueSelected
? t(`allSupportedLocales.${value}`)
: realm.defaultLocale !== ""
? t(
`allSupportedLocales.${
realm.defaultLocale || DEFAULT_LOCALE
}`
)
: t("placeholderText")
}
variant={SelectVariant.single}
aria-label={t("defaultLocale")}
isOpen={defaultLocaleOpen}
placeholderText={t("placeholderText")}
data-testid="select-default-locale"
>
{watchSupportedLocales?.map(
(locale: string, idx: number) => (
<SelectOption
key={`default-locale-${idx}`}
value={locale}
>
{t(`allSupportedLocales.${locale}`)}
</SelectOption>
)
)}
</Select>
) : (
<div />
);
}}
/>
</FormGroup>
<ActionGroup> <ActionGroup>
<Button <Button
variant="primary" variant="primary"