diff --git a/src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.styles.js b/src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.styles.ts similarity index 100% rename from src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.styles.js rename to src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.styles.ts diff --git a/src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.jsx b/src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.tsx similarity index 59% rename from src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.jsx rename to src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.tsx index 45a1a1a87..518f4e9a4 100644 --- a/src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.jsx +++ b/src/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.tsx @@ -1,4 +1,5 @@ import { useTranslation } from 'react-i18next' +import { ReactNode } from 'react' import Box from '@mui/material/Box' import IconButton from '@mui/material/IconButton' @@ -6,18 +7,35 @@ import Tooltip from '@mui/material/Tooltip' import Typography from '@mui/material/Typography' import { styles } from './EnhancedTableToolbar.styles' +import { TableActionFunc } from '~/types' -const EnhancedTableToolbar = ({ refetchData, itemIds, bulkActions }) => { +interface BulkAction { + title: string + func: TableActionFunc + icon: ReactNode +} + +interface EnhancedTableToolbarProps { + refetchData: () => void + itemIds: string[] + bulkActions: BulkAction[] +} + +const EnhancedTableToolbar = ({ + refetchData, + itemIds, + bulkActions +}: EnhancedTableToolbarProps) => { const { t } = useTranslation() - const onAction = async (actionFunc) => { - await actionFunc({ itemIds }) + const onAction = async (actionFunc: TableActionFunc) => { + await actionFunc(itemIds) refetchData() } const actionButtons = bulkActions.map(({ title, func, icon }) => ( - onAction(func)}>{icon} + void onAction(func)}>{icon} )) diff --git a/src/services/user-service.tsx b/src/services/user-service.tsx index 71c6ab917..d462d337f 100644 --- a/src/services/user-service.tsx +++ b/src/services/user-service.tsx @@ -33,7 +33,7 @@ export const userService = { deleteUser: (userId: string): Promise> => { return axiosClient.delete(createUrlPath(URLs.users.get, userId)) }, - deleteUsers: (userIds: string): Promise> => { + deleteUsers: (userIds: string[]): Promise> => { return axiosClient.post(URLs.users.delete, userIds) }, deactivateUser: (userId: string): Promise> => { diff --git a/src/types/components/enhanced-table/enhancedTable.types.ts b/src/types/components/enhanced-table/enhancedTable.types.ts index 99bc91b1c..8ae490498 100644 --- a/src/types/components/enhanced-table/enhancedTable.types.ts +++ b/src/types/components/enhanced-table/enhancedTable.types.ts @@ -1 +1 @@ -export type TableActionFunc = (id: string) => Promise | void +export type TableActionFunc = (id: string | string[]) => Promise | void diff --git a/tests/unit/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.spec.jsx b/tests/unit/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.spec.jsx index 068ad5e04..d0c890ec6 100644 --- a/tests/unit/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.spec.jsx +++ b/tests/unit/components/enhanced-table/enhanced-table-toolbar/EnhancedTableToolbar.spec.jsx @@ -52,6 +52,6 @@ describe('EnhancedTableToolbar test', () => { fireEvent.click(button) - expect(func).toHaveBeenCalledWith({ itemIds: selected }) + expect(func).toHaveBeenCalledWith(selected) }) })