@kuadrant/kuadrant-backstage-plugin-frontend 0.0.2-dev-7d09bfa → 0.0.2-dev-724df72

package/dist/components/ApprovalQueueCard/ApprovalQueueCard.esm.js

@@ -1,761 +0,0 @@
-import React, { useState } from 'react';
-import { useApi, configApiRef, fetchApiRef, identityApiRef, alertApiRef } from '@backstage/core-plugin-api';
-import { useAsync } from 'react-use';
-import { Progress, ResponseErrorPanel, InfoCard, Table } from '@backstage/core-components';
-import { kuadrantApiKeyUpdateAllPermission, kuadrantApiKeyUpdateOwnPermission } from '../../permissions.esm.js';
-import { useKuadrantPermission } from '../../utils/permissions.esm.js';
-import { Box, Typography, Tabs, Tab, Button, Accordion, AccordionSummary, Chip, AccordionDetails, Dialog, DialogTitle, DialogContent, DialogActions, CircularProgress, Tooltip } from '@material-ui/core';
-import CheckCircleIcon from '@material-ui/icons/CheckCircle';
-import CancelIcon from '@material-ui/icons/Cancel';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-
-const ApprovalDialog = ({
-  open,
-  request,
-  action,
-  processing,
-  onClose,
-  onConfirm
-}) => {
-  const actionLabel = action === "approve" ? "Approve" : "Reject";
-  const processingLabel = action === "approve" ? "Approving..." : "Rejecting...";
-  return /* @__PURE__ */ React.createElement(
-    Dialog,
-    {
-      open,
-      onClose: processing ? undefined : onClose,
-      maxWidth: "sm",
-      fullWidth: true
-    },
-    /* @__PURE__ */ React.createElement(DialogTitle, null, actionLabel, " API Key"),
-    /* @__PURE__ */ React.createElement(DialogContent, null, request && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("strong", null, "User:"), " ", request.spec.requestedBy.userId), /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("strong", null, "API:"), " ", request.spec.apiProductRef?.name || "unknown"), /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("strong", null, "Tier:"), " ", request.spec.planTier), /* @__PURE__ */ React.createElement(Box, { mb: 2 }, /* @__PURE__ */ React.createElement(
-      Typography,
-      {
-        variant: "body2",
-        component: "span",
-        style: { fontWeight: "bold" }
-      },
-      "Use Case:"
-    ), " ", /* @__PURE__ */ React.createElement(
-      Typography,
-      {
-        variant: "body2",
-        component: "span",
-        style: { whiteSpace: "pre-wrap" }
-      },
-      request.spec.useCase || "-"
-    )))),
-    /* @__PURE__ */ React.createElement(DialogActions, null, /* @__PURE__ */ React.createElement(Button, { onClick: onClose, disabled: processing }, "Cancel"), /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        onClick: onConfirm,
-        color: action === "approve" ? "primary" : "secondary",
-        variant: "contained",
-        disabled: processing,
-        startIcon: processing ? /* @__PURE__ */ React.createElement(CircularProgress, { size: 16, color: "inherit" }) : undefined
-      },
-      processing ? processingLabel : actionLabel
-    ))
-  );
-};
-const BulkActionDialog = ({
-  open,
-  requests,
-  action,
-  processing,
-  onClose,
-  onConfirm
-}) => {
-  const isApprove = action === "approve";
-  const actionLabel = isApprove ? "Approve All" : "Reject All";
-  const processingLabel = isApprove ? "Approving..." : "Rejecting...";
-  return /* @__PURE__ */ React.createElement(
-    Dialog,
-    {
-      open,
-      onClose: processing ? undefined : onClose,
-      maxWidth: "md",
-      fullWidth: true
-    },
-    /* @__PURE__ */ React.createElement(DialogTitle, null, isApprove ? "Approve" : "Reject", " ", requests.length, " API Keys"),
-    /* @__PURE__ */ React.createElement(DialogContent, null, /* @__PURE__ */ React.createElement(Typography, { variant: "body2", paragraph: true }, "You are about to ", isApprove ? "approve" : "reject", " the following API keys:"), /* @__PURE__ */ React.createElement(Box, { mb: 2, maxHeight: 200, overflow: "auto" }, requests.map((request) => /* @__PURE__ */ React.createElement(
-      Box,
-      {
-        key: `${request.metadata.namespace}/${request.metadata.name}`,
-        mb: 1,
-        p: 1,
-        bgcolor: "background.default"
-      },
-      /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, /* @__PURE__ */ React.createElement("strong", null, request.spec.requestedBy.userId), " -", " ", request.spec.apiProductRef?.name || "unknown", " (", request.spec.planTier, ")")
-    )))),
-    /* @__PURE__ */ React.createElement(DialogActions, null, /* @__PURE__ */ React.createElement(Button, { onClick: onClose, disabled: processing }, "Cancel"), /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        onClick: onConfirm,
-        color: isApprove ? "primary" : "secondary",
-        variant: "contained",
-        disabled: processing,
-        startIcon: processing ? /* @__PURE__ */ React.createElement(CircularProgress, { size: 16, color: "inherit" }) : undefined
-      },
-      processing ? processingLabel : actionLabel
-    ))
-  );
-};
-const ApprovalQueueCard = () => {
-  const config = useApi(configApiRef);
-  const fetchApi = useApi(fetchApiRef);
-  const identityApi = useApi(identityApiRef);
-  const alertApi = useApi(alertApiRef);
-  const backendUrl = config.getString("backend.baseUrl");
-  const [refresh, setRefresh] = useState(0);
-  const [selectedTab, setSelectedTab] = useState(0);
-  const [selectedRequests, setSelectedRequests] = useState([]);
-  const [dialogState, setDialogState] = useState({
-    open: false,
-    request: null,
-    action: "approve",
-    processing: false
-  });
-  const [bulkDialogState, setBulkDialogState] = useState({
-    open: false,
-    requests: [],
-    action: "approve",
-    processing: false
-  });
-  const {
-    allowed: canUpdateAllRequests,
-    loading: updateAllPermissionLoading,
-    error: updateAllPermissionError
-  } = useKuadrantPermission(kuadrantApiKeyUpdateAllPermission);
-  const {
-    allowed: canUpdateOwnRequests,
-    loading: updateOwnPermissionLoading,
-    error: updateOwnPermissionError
-  } = useKuadrantPermission(kuadrantApiKeyUpdateOwnPermission);
-  const updatePermissionLoading = updateAllPermissionLoading || updateOwnPermissionLoading;
-  const updatePermissionError = updateAllPermissionError || updateOwnPermissionError;
-  const { value, loading, error } = useAsync(async () => {
-    const identity = await identityApi.getBackstageIdentity();
-    const reviewedBy = identity.userEntityRef;
-    console.log(
-      "ApprovalQueueCard: fetching all requests from",
-      `${backendUrl}/api/kuadrant/requests`
-    );
-    const [requestsResponse, apiProductsResponse] = await Promise.all([
-      fetchApi.fetch(`${backendUrl}/api/kuadrant/requests`),
-      fetchApi.fetch(`${backendUrl}/api/kuadrant/apiproducts`)
-    ]);
-    if (!requestsResponse.ok) {
-      console.log(
-        "ApprovalQueueCard: failed to fetch requests, status:",
-        requestsResponse.status
-      );
-      return {
-        pending: [],
-        approved: [],
-        rejected: [],
-        reviewedBy,
-        ownedApiProducts: /* @__PURE__ */ new Set()
-      };
-    }
-    const contentType = requestsResponse.headers.get("content-type");
-    if (!contentType?.includes("application/json")) {
-      console.error("ApprovalQueueCard: received non-json response");
-      alertApi.post({
-        message: "Unexpected content-type from the server response. Please contact support.",
-        display: "transient",
-        severity: "warning"
-      });
-      return {
-        pending: [],
-        approved: [],
-        rejected: [],
-        reviewedBy,
-        ownedApiProducts: /* @__PURE__ */ new Set()
-      };
-    }
-    const data = await requestsResponse.json();
-    const allRequests = data.items || [];
-    const ownedApiProducts = /* @__PURE__ */ new Set();
-    if (apiProductsResponse.ok) {
-      const apiProductsData = await apiProductsResponse.json();
-      for (const product of apiProductsData.items || []) {
-        const owner = product.metadata?.annotations?.["backstage.io/owner"];
-        if (owner === reviewedBy) {
-          ownedApiProducts.add(
-            `${product.metadata.namespace}/${product.metadata.name}`
-          );
-        }
-      }
-    }
-    console.log(
-      "ApprovalQueueCard: received",
-      allRequests.length,
-      "total requests"
-    );
-    console.log(
-      "ApprovalQueueCard: user owns",
-      ownedApiProducts.size,
-      "api products"
-    );
-    const pending2 = allRequests.filter((r) => {
-      const phase = r.status?.phase || "Pending";
-      return phase === "Pending";
-    });
-    const approved2 = allRequests.filter((r) => {
-      const phase = r.status?.phase;
-      return phase === "Approved";
-    });
-    const rejected2 = allRequests.filter((r) => {
-      const phase = r.status?.phase;
-      return phase === "Rejected";
-    });
-    console.log("ApprovalQueueCard: grouped -", {
-      pending: pending2.length,
-      approved: approved2.length,
-      rejected: rejected2.length
-    });
-    return { pending: pending2, approved: approved2, rejected: rejected2, reviewedBy, ownedApiProducts };
-  }, [backendUrl, fetchApi, identityApi, refresh]);
-  const handleApprove = (request) => {
-    setDialogState({
-      open: true,
-      request,
-      action: "approve",
-      processing: false
-    });
-  };
-  const handleReject = (request) => {
-    setDialogState({
-      open: true,
-      request,
-      action: "reject",
-      processing: false
-    });
-  };
-  const handleConfirm = async () => {
-    if (!dialogState.request || !value) return;
-    setDialogState((prev) => ({ ...prev, processing: true }));
-    const endpoint = dialogState.action === "approve" ? `${backendUrl}/api/kuadrant/requests/${dialogState.request.metadata.namespace}/${dialogState.request.metadata.name}/approve` : `${backendUrl}/api/kuadrant/requests/${dialogState.request.metadata.namespace}/${dialogState.request.metadata.name}/reject`;
-    try {
-      const response = await fetchApi.fetch(endpoint, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          reviewedBy: value.reviewedBy
-        })
-      });
-      if (!response.ok) {
-        throw new Error(`failed to ${dialogState.action} request`);
-      }
-      setDialogState({
-        open: false,
-        request: null,
-        action: "approve",
-        processing: false
-      });
-      setRefresh((r) => r + 1);
-      const action = dialogState.action === "approve" ? "approved" : "rejected";
-      alertApi.post({
-        message: `API key ${action}`,
-        severity: "success",
-        display: "transient"
-      });
-    } catch (err) {
-      console.error(`error ${dialogState.action}ing request:`, err);
-      setDialogState((prev) => ({ ...prev, processing: false }));
-      alertApi.post({
-        message: `Failed to ${dialogState.action} API key`,
-        severity: "error",
-        display: "transient"
-      });
-    }
-  };
-  const handleBulkApprove = () => {
-    if (selectedRequests.length === 0) return;
-    setBulkDialogState({
-      open: true,
-      requests: selectedRequests,
-      action: "approve",
-      processing: false
-    });
-  };
-  const handleBulkReject = () => {
-    if (selectedRequests.length === 0) return;
-    setBulkDialogState({
-      open: true,
-      requests: selectedRequests,
-      action: "reject",
-      processing: false
-    });
-  };
-  const handleBulkConfirm = async () => {
-    if (!value || bulkDialogState.requests.length === 0) return;
-    setBulkDialogState((prev) => ({ ...prev, processing: true }));
-    const isApprove = bulkDialogState.action === "approve";
-    const endpoint = isApprove ? `${backendUrl}/api/kuadrant/requests/bulk-approve` : `${backendUrl}/api/kuadrant/requests/bulk-reject`;
-    try {
-      const response = await fetchApi.fetch(endpoint, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          requests: bulkDialogState.requests.map((r) => ({
-            namespace: r.metadata.namespace,
-            name: r.metadata.name
-          })),
-          reviewedBy: value.reviewedBy
-        })
-      });
-      if (!response.ok) {
-        throw new Error(`failed to bulk ${bulkDialogState.action} requests`);
-      }
-      const count = bulkDialogState.requests.length;
-      const action = isApprove ? "approved" : "rejected";
-      setBulkDialogState({
-        open: false,
-        requests: [],
-        action: "approve",
-        processing: false
-      });
-      setSelectedRequests([]);
-      setRefresh((r) => r + 1);
-      alertApi.post({
-        message: `${count} API keys ${action}`,
-        severity: "success",
-        display: "transient"
-      });
-    } catch (err) {
-      console.error(`error bulk ${bulkDialogState.action}ing requests:`, err);
-      setBulkDialogState((prev) => ({ ...prev, processing: false }));
-      alertApi.post({
-        message: `Failed to bulk ${bulkDialogState.action} API keys`,
-        severity: "error",
-        display: "transient"
-      });
-    }
-  };
-  if (loading || updatePermissionLoading) {
-    return /* @__PURE__ */ React.createElement(Progress, null);
-  }
-  if (error) {
-    return /* @__PURE__ */ React.createElement(ResponseErrorPanel, { error });
-  }
-  if (updatePermissionError) {
-    return /* @__PURE__ */ React.createElement(Box, { p: 2 }, /* @__PURE__ */ React.createElement(Typography, { color: "error" }, "Unable to check permissions: ", updatePermissionError.message), /* @__PURE__ */ React.createElement(Typography, { variant: "body2", color: "textSecondary" }, "Permission: kuadrant.apikey.update.all"), /* @__PURE__ */ React.createElement(Typography, { variant: "body2", color: "textSecondary" }, "Please try again or contact your administrator"));
-  }
-  const pending = value?.pending || [];
-  const approved = value?.approved || [];
-  const rejected = value?.rejected || [];
-  const formatDate = (dateString) => {
-    const date = new Date(dateString);
-    return date.toLocaleDateString("en-GB", {
-      year: "numeric",
-      month: "short",
-      day: "numeric",
-      hour: "2-digit",
-      minute: "2-digit"
-    });
-  };
-  const pendingColumns = [
-    {
-      title: "Name",
-      field: "metadata.name",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.metadata.name)
-    },
-    {
-      title: "User",
-      field: "spec.requestedBy.userId",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.spec.requestedBy.userId)
-    },
-    {
-      title: "API",
-      field: "spec.apiProductRef.name",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, /* @__PURE__ */ React.createElement("strong", null, row.spec.apiProductRef?.name || "unknown"))
-    },
-    {
-      title: "Namespace",
-      field: "metadata.namespace",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.metadata.namespace)
-    },
-    {
-      title: "Tier",
-      field: "spec.planTier",
-      render: (row) => /* @__PURE__ */ React.createElement(Chip, { label: row.spec.planTier, size: "small" })
-    },
-    {
-      title: "Use Case",
-      field: "spec.useCase",
-      render: (row) => {
-        if (!row.spec.useCase) {
-          return /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, "-");
-        }
-        return /* @__PURE__ */ React.createElement(Tooltip, { title: row.spec.useCase, placement: "top" }, /* @__PURE__ */ React.createElement(
-          Typography,
-          {
-            variant: "body2",
-            style: {
-              maxWidth: "200px",
-              overflow: "hidden",
-              textOverflow: "ellipsis",
-              whiteSpace: "nowrap"
-            }
-          },
-          row.spec.useCase
-        ));
-      }
-    },
-    {
-      title: "Requested",
-      field: "metadata.creationTimestamp",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.metadata.creationTimestamp ? formatDate(row.metadata.creationTimestamp) : "-")
-    },
-    {
-      title: "Actions",
-      filtering: false,
-      render: (row) => {
-        const apiProductKey = `${row.metadata.namespace}/${row.spec.apiProductRef?.name || "unknown"}`;
-        const ownsApiProduct = value?.ownedApiProducts?.has(apiProductKey) ?? false;
-        const canUpdate = canUpdateAllRequests || canUpdateOwnRequests && ownsApiProduct;
-        if (!canUpdate) return null;
-        return /* @__PURE__ */ React.createElement(Box, { display: "flex", style: { gap: 8 } }, /* @__PURE__ */ React.createElement(
-          Button,
-          {
-            size: "small",
-            startIcon: /* @__PURE__ */ React.createElement(CheckCircleIcon, null),
-            onClick: () => handleApprove(row),
-            color: "primary",
-            variant: "outlined"
-          },
-          "Approve"
-        ), /* @__PURE__ */ React.createElement(
-          Button,
-          {
-            size: "small",
-            startIcon: /* @__PURE__ */ React.createElement(CancelIcon, null),
-            onClick: () => handleReject(row),
-            color: "secondary",
-            variant: "outlined"
-          },
-          "Reject"
-        ));
-      }
-    }
-  ];
-  const approvedColumns = [
-    {
-      title: "Name",
-      field: "metadata.name",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.metadata.name)
-    },
-    {
-      title: "User",
-      field: "spec.requestedBy.userId",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.spec.requestedBy.userId)
-    },
-    {
-      title: "API",
-      field: "spec.apiProductRef.name",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, /* @__PURE__ */ React.createElement("strong", null, row.spec.apiProductRef?.name || "unknown"))
-    },
-    {
-      title: "Namespace",
-      field: "metadata.namespace",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.metadata.namespace)
-    },
-    {
-      title: "Tier",
-      field: "spec.planTier",
-      render: (row) => /* @__PURE__ */ React.createElement(Chip, { label: row.spec.planTier, size: "small" })
-    },
-    {
-      title: "Requested",
-      field: "metadata.creationTimestamp",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.metadata.creationTimestamp ? formatDate(row.metadata.creationTimestamp) : "-")
-    },
-    {
-      title: "Approved",
-      field: "status.reviewedAt",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.status?.reviewedAt ? formatDate(row.status.reviewedAt) : "-")
-    },
-    {
-      title: "Reviewed By",
-      field: "status.reviewedBy",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.status?.reviewedBy || "-")
-    },
-    {
-      title: "Approval Type",
-      field: "status.reviewedBy",
-      render: (row) => {
-        const isAutomatic = row.status?.reviewedBy === "system";
-        return /* @__PURE__ */ React.createElement(
-          Chip,
-          {
-            label: isAutomatic ? "Automatic" : "Manual",
-            size: "small",
-            color: isAutomatic ? "default" : "primary"
-          }
-        );
-      }
-    }
-  ];
-  const rejectedColumns = [
-    {
-      title: "Name",
-      field: "metadata.name",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.metadata.name)
-    },
-    {
-      title: "User",
-      field: "spec.requestedBy.userId",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.spec.requestedBy.userId)
-    },
-    {
-      title: "API",
-      field: "spec.apiProductRef.name",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, /* @__PURE__ */ React.createElement("strong", null, row.spec.apiProductRef?.name || "unknown"))
-    },
-    {
-      title: "Namespace",
-      field: "metadata.namespace",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.metadata.namespace)
-    },
-    {
-      title: "Tier",
-      field: "spec.planTier",
-      render: (row) => /* @__PURE__ */ React.createElement(Chip, { label: row.spec.planTier, size: "small" })
-    },
-    {
-      title: "Requested",
-      field: "metadata.creationTimestamp",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.metadata.creationTimestamp ? formatDate(row.metadata.creationTimestamp) : "-")
-    },
-    {
-      title: "Rejected",
-      field: "status.reviewedAt",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.status?.reviewedAt ? formatDate(row.status.reviewedAt) : "-")
-    },
-    {
-      title: "Reviewed By",
-      field: "status.reviewedBy",
-      render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, row.status?.reviewedBy || "-")
-    }
-  ];
-  const getTabData = () => {
-    const addIds = (data) => data.map((item) => ({ ...item, id: item.metadata.name }));
-    switch (selectedTab) {
-      case 0:
-        const pendingWithSelection = pending.map((row) => {
-          const isSelected = selectedRequests.some(
-            (selected) => selected.metadata.name === row.metadata.name && selected.metadata.namespace === row.metadata.namespace
-          );
-          return {
-            ...row,
-            tableData: { checked: isSelected }
-          };
-        });
-        return {
-          data: pendingWithSelection,
-          columns: pendingColumns,
-          showSelection: true
-        };
-      case 1:
-        return {
-          data: addIds(approved),
-          columns: approvedColumns,
-          showSelection: false
-        };
-      case 2:
-        return {
-          data: addIds(rejected),
-          columns: rejectedColumns,
-          showSelection: false
-        };
-      default:
-        return {
-          data: addIds(pending),
-          columns: pendingColumns,
-          showSelection: true
-        };
-    }
-  };
-  const tabData = getTabData();
-  const groupByApiProduct = (requests) => {
-    const grouped = /* @__PURE__ */ new Map();
-    requests.forEach((request) => {
-      const key = `${request.metadata.namespace}/${request.spec.apiProductRef?.name || "unknown"}`;
-      if (!grouped.has(key)) {
-        grouped.set(key, []);
-      }
-      grouped.get(key).push(request);
-    });
-    return grouped;
-  };
-  const groupedData = groupByApiProduct(tabData.data);
-  const apiProductKeys = Array.from(groupedData.keys()).sort();
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    InfoCard,
-    {
-      title: "API Access Requests",
-      subheader: `${pending.length} pending, ${approved.length} approved, ${rejected.length} rejected`
-    },
-    /* @__PURE__ */ React.createElement(Box, { mb: 2, "data-testid": "approval-queue-card" }, /* @__PURE__ */ React.createElement(
-      Tabs,
-      {
-        value: selectedTab,
-        onChange: (_, newValue) => {
-          setSelectedTab(newValue);
-          setSelectedRequests([]);
-        },
-        indicatorColor: "primary",
-        textColor: "primary",
-        "data-testid": "approval-queue-tabs"
-      },
-      /* @__PURE__ */ React.createElement(
-        Tab,
-        {
-          label: `Pending (${pending.length})`,
-          "data-testid": "approval-queue-pending-tab"
-        }
-      ),
-      /* @__PURE__ */ React.createElement(
-        Tab,
-        {
-          label: `Approved (${approved.length})`,
-          "data-testid": "approval-queue-approved-tab"
-        }
-      ),
-      /* @__PURE__ */ React.createElement(
-        Tab,
-        {
-          label: `Rejected (${rejected.length})`,
-          "data-testid": "approval-queue-rejected-tab"
-        }
-      )
-    )),
-    selectedTab === 0 && selectedRequests.length > 0 && /* @__PURE__ */ React.createElement(
-      Box,
-      {
-        mb: 2,
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "space-between",
-        p: 2,
-        bgcolor: "background.default"
-      },
-      /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, selectedRequests.length, " request", selectedRequests.length !== 1 ? "s" : "", " selected"),
-      /* @__PURE__ */ React.createElement(Box, { display: "flex", style: { gap: 8 } }, /* @__PURE__ */ React.createElement(
-        Button,
-        {
-          size: "small",
-          variant: "contained",
-          color: "primary",
-          startIcon: /* @__PURE__ */ React.createElement(CheckCircleIcon, null),
-          onClick: handleBulkApprove
-        },
-        "Approve Selected"
-      ), /* @__PURE__ */ React.createElement(
-        Button,
-        {
-          size: "small",
-          variant: "contained",
-          color: "secondary",
-          startIcon: /* @__PURE__ */ React.createElement(CancelIcon, null),
-          onClick: handleBulkReject
-        },
-        "Reject Selected"
-      ))
-    ),
-    tabData.data.length === 0 ? /* @__PURE__ */ React.createElement(Box, { p: 3, textAlign: "center" }, /* @__PURE__ */ React.createElement(Typography, { variant: "body1", color: "textSecondary" }, selectedTab === 0 && "No pending requests.", selectedTab === 1 && "No approved requests.", selectedTab === 2 && "No rejected requests.")) : /* @__PURE__ */ React.createElement(Box, null, apiProductKeys.map((apiProductKey) => {
-      const requests = groupedData.get(apiProductKey) || [];
-      const displayName = requests[0]?.spec.apiProductRef?.name || apiProductKey;
-      const ownsThisApiProduct = value?.ownedApiProducts?.has(apiProductKey) ?? false;
-      const canSelectRows = canUpdateAllRequests || canUpdateOwnRequests && ownsThisApiProduct;
-      return /* @__PURE__ */ React.createElement(
-        Accordion,
-        {
-          key: apiProductKey,
-          defaultExpanded: apiProductKeys.length === 1
-        },
-        /* @__PURE__ */ React.createElement(AccordionSummary, { expandIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, null) }, /* @__PURE__ */ React.createElement(
-          Box,
-          {
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "space-between",
-            width: "100%"
-          },
-          /* @__PURE__ */ React.createElement(Typography, { variant: "h6" }, displayName),
-          /* @__PURE__ */ React.createElement(
-            Chip,
-            {
-              label: `${requests.length} request${requests.length !== 1 ? "s" : ""}`,
-              size: "small",
-              color: "primary",
-              style: { marginRight: 16 }
-            }
-          )
-        )),
-        /* @__PURE__ */ React.createElement(AccordionDetails, null, /* @__PURE__ */ React.createElement(Box, { width: "100%" }, /* @__PURE__ */ React.createElement(
-          Table,
-          {
-            options: {
-              selection: canSelectRows && tabData.showSelection,
-              paging: requests.length > 5,
-              pageSize: 20,
-              search: true,
-              filtering: true,
-              debounceInterval: 300,
-              showTextRowsSelected: false,
-              toolbar: true,
-              emptyRowsWhenPaging: false
-            },
-            data: requests,
-            columns: tabData.columns,
-            onSelectionChange: (rows) => {
-              const otherSelections = selectedRequests.filter(
-                (r) => `${r.metadata.namespace}/${r.spec.apiProductRef?.name || "unknown"}` !== apiProductKey
-              );
-              setSelectedRequests([
-                ...otherSelections,
-                ...rows
-              ]);
-            }
-          }
-        )))
-      );
-    }))
-  ), /* @__PURE__ */ React.createElement(
-    ApprovalDialog,
-    {
-      open: dialogState.open,
-      request: dialogState.request,
-      action: dialogState.action,
-      processing: dialogState.processing,
-      onClose: () => setDialogState({
-        open: false,
-        request: null,
-        action: "approve",
-        processing: false
-      }),
-      onConfirm: handleConfirm
-    }
-  ), /* @__PURE__ */ React.createElement(
-    BulkActionDialog,
-    {
-      open: bulkDialogState.open,
-      requests: bulkDialogState.requests,
-      action: bulkDialogState.action,
-      processing: bulkDialogState.processing,
-      onClose: () => setBulkDialogState({
-        open: false,
-        requests: [],
-        action: "approve",
-        processing: false
-      }),
-      onConfirm: handleBulkConfirm
-    }
-  ));
-};
-
-export { ApprovalQueueCard };
-//# sourceMappingURL=ApprovalQueueCard.esm.js.map