Moved v3 code from NginxProxyManager/nginx-proxy-manager-3 to NginxProxyManager/nginx-proxy-manager

frontend/src/components/Table/RowActionsMenu.tsx

@@ -0,0 +1,70 @@
+import { ReactNode } from "react";
+
+import {
+	Menu,
+	MenuButton,
+	MenuList,
+	MenuItem,
+	IconButton,
+} from "@chakra-ui/react";
+import { FiMoreVertical } from "react-icons/fi";
+
+// A row action is a single menu item for the actions column
+export interface RowAction {
+	title: string;
+	onClick: (e: any, data: any) => any;
+	show?: (data: any) => any;
+	disabled?: (data: any) => any;
+	icon?: any;
+}
+
+interface RowActionsProps {
+	/**
+	 * Row Data
+	 */
+	data: any;
+	/**
+	 * Actions
+	 */
+	actions: RowAction[];
+}
+function RowActionsMenu({ data, actions }: RowActionsProps) {
+	const elms: ReactNode[] = [];
+	actions.map((action) => {
+		if (!action.show || action.show(data)) {
+			const disabled = action.disabled && action.disabled(data);
+			elms.push(
+				<MenuItem
+					key={`action-${action.title}`}
+					icon={action.icon}
+					isDisabled={disabled}
+					onClick={(e: any) => {
+						action.onClick(e, data);
+					}}>
+					{action.title}
+				</MenuItem>,
+			);
+		}
+		return null;
+	});
+
+	if (!elms.length) {
+		return null;
+	}
+
+	return (
+		<div style={{ textAlign: "right" }}>
+			<Menu>
+				<MenuButton
+					as={IconButton}
+					aria-label="Actions"
+					icon={<FiMoreVertical />}
+					variant="outline"
+				/>
+				<MenuList>{elms}</MenuList>
+			</Menu>
+		</div>
+	);
+}
+
+export { RowActionsMenu };