diff --git a/frontend/src/components/common/Resource/EditButton.tsx b/frontend/src/components/common/Resource/EditButton.tsx
index 0e9cfc15ba..a11b3a8f77 100644
--- a/frontend/src/components/common/Resource/EditButton.tsx
+++ b/frontend/src/components/common/Resource/EditButton.tsx
@@ -87,7 +87,7 @@ export default function EditButton(props: EditButtonProps) {
}
if (isReadOnly) {
- return ;
+ return ;
}
return (
diff --git a/frontend/src/components/common/Resource/ResourceTable.tsx b/frontend/src/components/common/Resource/ResourceTable.tsx
index 3ac3d4a01f..d2d677cd78 100644
--- a/frontend/src/components/common/Resource/ResourceTable.tsx
+++ b/frontend/src/components/common/Resource/ResourceTable.tsx
@@ -1,4 +1,4 @@
-import { MenuItem, TableCellProps } from '@mui/material';
+import { TableCellProps } from '@mui/material';
import { useTheme } from '@mui/material/styles';
import { MRT_FilterFns, MRT_Row, MRT_SortingFn } from 'material-react-table';
import { ComponentProps, ReactNode, useEffect, useMemo, useRef, useState } from 'react';
@@ -9,7 +9,7 @@ import { ApiError } from '../../../lib/k8s/apiProxy';
import { KubeObject } from '../../../lib/k8s/KubeObject';
import { KubeObjectClass } from '../../../lib/k8s/KubeObject';
import { useFilterFunc } from '../../../lib/util';
-import { DefaultHeaderAction, RowAction } from '../../../redux/actionButtonsSlice';
+import { HeaderAction } from '../../../redux/actionButtonsSlice';
import { HeadlampEventType, useEventCallback } from '../../../redux/headlampEventSlice';
import { useTypedSelector } from '../../../redux/reducers/reducers';
import { useSettings } from '../../App/Settings/hook';
@@ -17,11 +17,7 @@ import { ClusterGroupErrorMessage } from '../../cluster/ClusterGroupErrorMessage
import { DateLabel } from '../Label';
import Link from '../Link';
import Table, { TableColumn } from '../Table';
-import DeleteButton from './DeleteButton';
-import EditButton from './EditButton';
-import { RestartButton } from './RestartButton';
-import ScaleButton from './ScaleButton';
-import ViewButton from './ViewButton';
+import generateRowActionsMenu from './ResourceTableSingleActions';
export type ResourceTableColumn = {
/** Unique id for the column, not required but recommended */
@@ -83,7 +79,7 @@ export interface ResourceTableProps {
columns: (ResourceTableColumn | ColumnType)[];
/** Show or hide row actions @default false*/
enableRowActions?: boolean;
- actions?: null | RowAction[];
+ actions?: null | HeaderAction[];
/** Provide a list of columns that won't be shown and cannot be turned on */
hideColumns?: string[] | null;
/** ID for the table. Will be used by plugins to identify this table.
@@ -411,52 +407,12 @@ function ResourceTableContent(props: ResourceTablePr
tableSettings,
]);
- const defaultActions: RowAction[] = [
- {
- id: DefaultHeaderAction.RESTART,
- action: ({ item }) => ,
- },
- {
- id: DefaultHeaderAction.SCALE,
- action: ({ item }) => ,
- },
- {
- id: DefaultHeaderAction.EDIT,
- action: ({ item, closeMenu }) => (
-
- ),
- },
- {
- id: DefaultHeaderAction.VIEW,
- action: ({ item }) => ,
- },
- {
- id: DefaultHeaderAction.DELETE,
- action: ({ item, closeMenu }) => (
-
- ),
- },
- ];
- let hAccs: RowAction[] = [];
- if (actions !== undefined && actions !== null) {
- hAccs = actions;
- }
-
- const actionsProcessed: RowAction[] = [...hAccs, ...defaultActions];
-
const renderRowActionMenuItems = useMemo(() => {
- if (actionsProcessed.length === 0) {
+ if (!enableRowActions) {
return null;
}
- return ({ closeMenu, row }: { closeMenu: () => void; row: MRT_Row> }) => {
- return actionsProcessed.map(action => {
- if (action.action === undefined || action.action === null) {
- return ;
- }
- return action.action({ item: row.original, closeMenu });
- });
- };
- }, [actionsProcessed]);
+ return generateRowActionsMenu(actions);
+ }, [actions, enableRowActions]);
function onColumnsVisibilityChange(updater: any): void {
setColumnVisibility(oldCols => {
diff --git a/frontend/src/components/common/Resource/ResourceTableSingleActions.tsx b/frontend/src/components/common/Resource/ResourceTableSingleActions.tsx
new file mode 100644
index 0000000000..a1c37a7740
--- /dev/null
+++ b/frontend/src/components/common/Resource/ResourceTableSingleActions.tsx
@@ -0,0 +1,58 @@
+import { MenuItem } from '@mui/material';
+import { MRT_Row } from 'material-react-table';
+import { DefaultHeaderAction, HeaderAction } from '../../../redux/actionButtonsSlice';
+import { ButtonStyle } from '../ActionButton/ActionButton';
+import DeleteButton from './DeleteButton';
+import EditButton from './EditButton';
+import { RestartButton } from './RestartButton';
+import ScaleButton from './ScaleButton';
+
+export function generateActions(actions: HeaderAction[], buttonStyle: ButtonStyle): HeaderAction[] {
+ const defaultActions: HeaderAction[] = [
+ {
+ id: DefaultHeaderAction.RESTART,
+ action: ({ item }) => ,
+ },
+ {
+ id: DefaultHeaderAction.SCALE,
+ action: ({ item }) => ,
+ },
+ {
+ id: DefaultHeaderAction.EDIT,
+ action: ({ item, closeMenu }) => (
+
+ ),
+ },
+ {
+ id: DefaultHeaderAction.DELETE,
+ action: ({ item, closeMenu }) => (
+
+ ),
+ },
+ ];
+ let hAccs: HeaderAction[] = [];
+ if (actions !== undefined && actions !== null) {
+ hAccs = actions;
+ }
+
+ const actionsProcessed: HeaderAction[] = [...hAccs, ...defaultActions];
+ return actionsProcessed;
+}
+
+export default function generateRowActionsMenu(actions: HeaderAction[] | null | undefined) {
+ const actionsProcessed = generateActions(actions || [], 'menu');
+ if (actionsProcessed.length === 0) {
+ return null;
+ }
+ return ({ closeMenu, row }: { closeMenu: () => void; row: MRT_Row> }) => {
+ return actionsProcessed.map(action => {
+ if (action.action === undefined || action.action === null) {
+ return ;
+ }
+ if (typeof action.action === 'function') {
+ return action.action({ item: row.original, closeMenu });
+ }
+ return action.action;
+ });
+ };
+}
diff --git a/frontend/src/components/common/Resource/index.test.ts b/frontend/src/components/common/Resource/index.test.ts
index e4573b53a2..f004146ce0 100644
--- a/frontend/src/components/common/Resource/index.test.ts
+++ b/frontend/src/components/common/Resource/index.test.ts
@@ -27,6 +27,7 @@ const checkExports = [
'ResourceListView',
'ResourceTable',
'resourceTableSlice',
+ 'ResourceTableSingleActions',
'ResourceTableColumnChooser',
'RestartButton',
'ScaleButton',
diff --git a/frontend/src/redux/actionButtonsSlice.ts b/frontend/src/redux/actionButtonsSlice.ts
index cf96080970..5c99b664dd 100644
--- a/frontend/src/redux/actionButtonsSlice.ts
+++ b/frontend/src/redux/actionButtonsSlice.ts
@@ -7,18 +7,12 @@ export type HeaderActionType = ((...args: any[]) => ReactNode) | null | ReactEle
export type DetailsViewFunc = HeaderActionType;
export type AppBarActionType = ((...args: any[]) => ReactNode) | null | ReactElement | ReactNode;
-export type RowActionType = ((item: any) => JSX.Element | null | ReactNode) | null;
export type HeaderAction = {
id: string;
action?: HeaderActionType;
};
-export type RowAction = {
- id: string;
- action?: RowActionType;
-};
-
export type AppBarAction = {
id: string;
action?: AppBarActionType;