diff --git a/src/frontend/src/components/tables/RowActions.tsx b/src/frontend/src/components/tables/RowActions.tsx
index 49c3a325b433..a9f46e3afc6e 100644
--- a/src/frontend/src/components/tables/RowActions.tsx
+++ b/src/frontend/src/components/tables/RowActions.tsx
@@ -1,5 +1,5 @@
import { t } from '@lingui/macro';
-import { ActionIcon, Group, Tooltip } from '@mantine/core';
+import { ActionIcon, Tooltip } from '@mantine/core';
import { Menu } from '@mantine/core';
import { IconCopy, IconDots, IconEdit, IconTrash } from '@tabler/icons-react';
import { ReactNode, useMemo, useState } from 'react';
@@ -9,6 +9,7 @@ import { notYetImplemented } from '../../functions/notifications';
// Type definition for a table row action
export type RowAction = {
title: string;
+ tooltip?: string;
color?: string;
icon: ReactNode;
onClick?: () => void;
@@ -18,14 +19,17 @@ export type RowAction = {
// Component for duplicating a row in a table
export function RowDuplicateAction({
onClick,
+ tooltip,
hidden
}: {
onClick?: () => void;
+ tooltip?: string;
hidden?: boolean;
}): RowAction {
return {
title: t`Duplicate`,
color: 'green',
+ tooltip: tooltip,
onClick: onClick,
icon: ,
hidden: hidden
@@ -35,14 +39,17 @@ export function RowDuplicateAction({
// Component for editing a row in a table
export function RowEditAction({
onClick,
+ tooltip,
hidden
}: {
onClick?: () => void;
+ tooltip?: string;
hidden?: boolean;
}): RowAction {
return {
title: t`Edit`,
color: 'blue',
+ tooltip: tooltip,
onClick: onClick,
icon: ,
hidden: hidden
@@ -52,14 +59,17 @@ export function RowEditAction({
// Component for deleting a row in a table
export function RowDeleteAction({
onClick,
+ tooltip,
hidden
}: {
onClick?: () => void;
+ tooltip?: string;
hidden?: boolean;
}): RowAction {
return {
title: t`Delete`,
color: 'red',
+ tooltip: tooltip,
onClick: onClick,
icon: ,
hidden: hidden
@@ -97,10 +107,14 @@ export function RowActions({
// Render a single action icon
function RowActionIcon(action: RowAction) {
return (
-
-
+ {
// Prevent clicking on the action from selecting the row itself
event?.preventDefault();
@@ -116,23 +130,18 @@ export function RowActions({
setOpened(false);
}}
>
- {action.icon}
-
+ {action.title}
+
);
}
- // If only a single action is available, display that
- if (visibleActions.length == 1) {
- return ;
- }
-
return (
visibleActions.length > 0 && (
)
diff --git a/src/frontend/src/components/tables/part/PartParameterTable.tsx b/src/frontend/src/components/tables/part/PartParameterTable.tsx
index 54788134b132..ffaa67252284 100644
--- a/src/frontend/src/components/tables/part/PartParameterTable.tsx
+++ b/src/frontend/src/components/tables/part/PartParameterTable.tsx
@@ -110,6 +110,7 @@ export function PartParameterTable({ partId }: { partId: any }) {
actions.push(
RowEditAction({
+ tooltip: t`Edit Part Parameter`,
hidden: !user.hasChangeRole(UserRoles.part),
onClick: () => {
openEditApiForm({
@@ -132,6 +133,7 @@ export function PartParameterTable({ partId }: { partId: any }) {
actions.push(
RowDeleteAction({
+ tooltip: t`Delete Part Parameter`,
hidden: !user.hasDeleteRole(UserRoles.part),
onClick: () => {
openDeleteApiForm({