mirror of
https://github.com/keycloak/keycloak.git
synced 2026-01-10 15:32:05 -03:30
add select all to event table (#39444)
fixes: #37532 Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>
This commit is contained in:
parent
8e99d04668
commit
375be14fd8
@ -149,6 +149,15 @@ export const EventsTab = ({ realm }: EventsTabProps) => {
|
||||
refresh();
|
||||
};
|
||||
|
||||
const removeEvents = async (eventTypes: EventType[] = []) => {
|
||||
const values = eventTypes.map((type) => type.id);
|
||||
const enabledEventTypes = events?.enabledEventTypes?.filter(
|
||||
(e) => !values.includes(e),
|
||||
);
|
||||
addEvents(enabledEventTypes);
|
||||
setEvents({ ...events, enabledEventTypes });
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<DeleteConfirm />
|
||||
@ -202,13 +211,8 @@ export const EventsTab = ({ realm }: EventsTabProps) => {
|
||||
key={tableKey}
|
||||
addTypes={() => setAddEventType(true)}
|
||||
eventTypes={events?.enabledEventTypes || []}
|
||||
onDelete={(value) => {
|
||||
const enabledEventTypes = events?.enabledEventTypes?.filter(
|
||||
(e) => e !== value.id,
|
||||
);
|
||||
addEvents(enabledEventTypes);
|
||||
setEvents({ ...events, enabledEventTypes });
|
||||
}}
|
||||
onDelete={(value) => removeEvents([value])}
|
||||
onDeleteAll={removeEvents}
|
||||
/>
|
||||
</PageSection>
|
||||
</Tab>
|
||||
|
||||
@ -1,7 +1,11 @@
|
||||
import {
|
||||
Action,
|
||||
KeycloakDataTable,
|
||||
ListEmptyState,
|
||||
} from "@keycloak/keycloak-ui-shared";
|
||||
import { Button, ToolbarItem } from "@patternfly/react-core";
|
||||
import { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { ListEmptyState } from "@keycloak/keycloak-ui-shared";
|
||||
import { Action, KeycloakDataTable } from "@keycloak/keycloak-ui-shared";
|
||||
import { translationFormatter } from "../../utils/translationFormatter";
|
||||
|
||||
export type EventType = {
|
||||
@ -14,6 +18,7 @@ type EventsTypeTableProps = {
|
||||
addTypes?: () => void;
|
||||
onSelect?: (value: EventType[]) => void;
|
||||
onDelete?: (value: EventType) => void;
|
||||
onDeleteAll?: (value: EventType[]) => void;
|
||||
};
|
||||
|
||||
export function EventsTypeTable({
|
||||
@ -22,8 +27,10 @@ export function EventsTypeTable({
|
||||
addTypes,
|
||||
onSelect,
|
||||
onDelete,
|
||||
onDeleteAll,
|
||||
}: EventsTypeTableProps) {
|
||||
const { t } = useTranslation();
|
||||
const [selectedTypes, setSelectedTypes] = useState<EventType[]>([]);
|
||||
|
||||
const data = eventTypes.map((type) => ({
|
||||
id: type,
|
||||
@ -35,16 +42,30 @@ export function EventsTypeTable({
|
||||
ariaLabelKey={ariaLabelKey}
|
||||
searchPlaceholderKey="searchEventType"
|
||||
loader={data}
|
||||
onSelect={onSelect ? onSelect : undefined}
|
||||
canSelectAll={!!onSelect}
|
||||
onSelect={onSelect ? onSelect : setSelectedTypes}
|
||||
canSelectAll
|
||||
toolbarItem={
|
||||
addTypes && (
|
||||
<ToolbarItem>
|
||||
<Button id="addTypes" onClick={addTypes} data-testid="addTypes">
|
||||
{t("addSavedTypes")}
|
||||
</Button>
|
||||
</ToolbarItem>
|
||||
)
|
||||
<>
|
||||
{addTypes && (
|
||||
<ToolbarItem>
|
||||
<Button id="addTypes" onClick={addTypes} data-testid="addTypes">
|
||||
{t("addSavedTypes")}
|
||||
</Button>
|
||||
</ToolbarItem>
|
||||
)}
|
||||
{onDeleteAll && (
|
||||
<ToolbarItem>
|
||||
<Button
|
||||
onClick={() => onDeleteAll(selectedTypes)}
|
||||
data-testid="removeAll"
|
||||
variant="secondary"
|
||||
isDisabled={selectedTypes.length === 0}
|
||||
>
|
||||
{t("remove")}
|
||||
</Button>
|
||||
</ToolbarItem>
|
||||
)}
|
||||
</>
|
||||
}
|
||||
actions={
|
||||
!onDelete
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user