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

Added search bar (#3347)

Browse source
This commit is contained in:
Erik Jan de Wit 2022-09-19 11:09:16 +02:00 committed by GitHub
parent cba5b7c821
commit 6300f13aa0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
apps/admin-ui/src/authentication/components/modals/AddStepModal.tsx
View file

@ -36,10 +36,8 @@ const AuthenticationProviderList = ({
label={provider.displayName}
data-testid={provider.id}
description={provider.description}
onChange={(_val, event) => {
const { id } = event.currentTarget;
const value = list.find((p) => p.id === id);
setValue(value);
onChange={() => {
setValue(provider);
}}
/>
))}
@ -65,6 +63,7 @@ export const AddStepModal = ({ name, type, onSelect }: AddStepModalProps) => {
useState<AuthenticationProviderRepresentation[]>();
const [max, setMax] = useState(10);
const [first, setFirst] = useState(0);
const [search, setSearch] = useState("");
const localeSort = useLocaleSort();
useFetch(
@ -93,11 +92,13 @@ export const AddStepModal = ({ name, type, onSelect }: AddStepModalProps) => {
const page = useMemo(
() =>
localeSort(providers ?? [], mapByKey("displayName")).slice(
first,
first + max + 1
),
[providers, first, max]
localeSort(providers ?? [], mapByKey("displayName"))
.filter(
(p) =>
p.displayName?.includes(search) || p.description?.includes(search)
)
.slice(first, first + max + 1),
[providers, search, first, max]
);
return (
@ -139,6 +140,9 @@ export const AddStepModal = ({ name, type, onSelect }: AddStepModalProps) => {
setFirst(first);
setMax(max);
}}
inputGroupName="search"
inputGroupPlaceholder={t("common:search")}
inputGroupOnEnter={setSearch}
>
<AuthenticationProviderList list={page} setValue={setValue} />
</PaginatingTableToolbar>