@acmekit/dashboard 2.13.21 → 2.13.23

package/dist/{api-key-management-list-HYZG23AG.mjs → api-key-management-list-QK4Q7Y5I.mjs}

@@ -5,8 +5,9 @@ import {
   prettifyRedactedToken
 } from "./chunk-J6XIB6ZU.mjs";
 import {
-  StatusCell
-} from "./chunk-WILMJYUB.mjs";
+  DateCell,
+  PlaceholderCell
+} from "./chunk-QZOY6YYT.mjs";
 import {
   _DataTable,
   useDataTable
@@ -14,9 +15,7 @@ import {
 import {
   useQueryParams
 } from "./chunk-C76H5USB.mjs";
-import {
-  useDate
-} from "./chunk-DFFLVEZ5.mjs";
+import "./chunk-DFFLVEZ5.mjs";
 import "./chunk-535OVBXR.mjs";
 import {
   SingleColumnPage
@@ -48,57 +47,59 @@ import { useLocation } from "react-router-dom";
 // src/routes/api-key-management/api-key-management-list/components/api-key-management-list-table/api-key-management-list-table.tsx
 import { Button, Container, Heading, Text } from "@acmekit/ui";
 import { keepPreviousData } from "@tanstack/react-query";
-import { useTranslation as useTranslation5 } from "react-i18next";
+import { useTranslation as useTranslation4 } from "react-i18next";
 import { Link } from "react-router-dom";
 
 // src/routes/api-key-management/api-key-management-list/components/api-key-management-list-table/use-api-key-management-table-columns.tsx
 import { Badge } from "@acmekit/ui";
 import { createColumnHelper } from "@tanstack/react-table";
 import { useMemo } from "react";
-import { useTranslation as useTranslation3 } from "react-i18next";
-
-// src/components/table/table-cells/common/date-cell/date-cell.tsx
-import { Tooltip } from "@acmekit/ui";
-import { useTranslation } from "react-i18next";
-
-// src/components/table/table-cells/common/placeholder-cell/placeholder-cell.tsx
-import { jsx } from "react/jsx-runtime";
-var PlaceholderCell = () => {
-  return /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center", children: /* @__PURE__ */ jsx("span", { className: "text-ui-fg-muted", children: "-" }) });
-};
+import { useTranslation as useTranslation2 } from "react-i18next";
 
-// src/components/table/table-cells/common/date-cell/date-cell.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var DateCell = ({ date }) => {
-  const { getFullDate } = useDate();
-  if (!date) {
-    return /* @__PURE__ */ jsx2(PlaceholderCell, {});
-  }
-  return /* @__PURE__ */ jsx2("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx2(
-    Tooltip,
-    {
-      className: "z-10",
-      content: /* @__PURE__ */ jsx2("span", { className: "text-pretty", children: `${getFullDate({
-        date,
-        includeTime: true
-      })}` }),
-      children: /* @__PURE__ */ jsx2("span", { className: "truncate", children: getFullDate({ date, includeTime: false }) })
-    }
-  ) });
+// src/components/table/table-cells/common/status-cell/status-cell.tsx
+import { clx } from "@acmekit/ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+var StatusCell = ({ color, children }) => {
+  return /* @__PURE__ */ jsxs("div", { className: "txt-compact-small text-ui-fg-subtle flex h-full w-full items-center gap-x-2 overflow-hidden", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "presentation",
+        className: "flex h-5 w-2 items-center justify-center",
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: clx(
+              "h-2 w-2 rounded-sm shadow-[0px_0px_0px_1px_rgba(0,0,0,0.12)_inset]",
+              {
+                "bg-ui-tag-neutral-icon": color === "grey",
+                "bg-ui-tag-green-icon": color === "green",
+                "bg-ui-tag-red-icon": color === "red",
+                "bg-ui-tag-blue-icon": color === "blue",
+                "bg-ui-tag-orange-icon": color === "orange",
+                "bg-ui-tag-purple-icon": color === "purple"
+              }
+            )
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: "truncate", children })
+  ] });
 };
 
 // src/components/table/table-cells/common/text-cell/text-cell.tsx
-import { clx } from "@acmekit/ui";
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { clx as clx2 } from "@acmekit/ui";
+import { jsx as jsx2 } from "react/jsx-runtime";
 var TextCell = ({ text, align = "left", maxWidth = 220 }) => {
   if (!text) {
-    return /* @__PURE__ */ jsx3(PlaceholderCell, {});
+    return /* @__PURE__ */ jsx2(PlaceholderCell, {});
   }
   const stringLength = text.toString().length;
-  return /* @__PURE__ */ jsx3(ConditionalTooltip, { content: text, showTooltip: stringLength > 20, children: /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx2(ConditionalTooltip, { content: text, showTooltip: stringLength > 20, children: /* @__PURE__ */ jsx2(
     "div",
     {
-      className: clx("flex h-full w-full items-center gap-x-3 overflow-hidden", {
+      className: clx2("flex h-full w-full items-center gap-x-3 overflow-hidden", {
         "justify-start text-start": align === "left",
         "justify-center text-center": align === "center",
         "justify-end text-end": align === "right"
@@ -106,7 +107,7 @@ var TextCell = ({ text, align = "left", maxWidth = 220 }) => {
       style: {
         maxWidth
       },
-      children: /* @__PURE__ */ jsx3("span", { className: "truncate", children: text })
+      children: /* @__PURE__ */ jsx2("span", { className: "truncate", children: text })
     }
   ) });
 };
@@ -114,14 +115,14 @@ var TextCell = ({ text, align = "left", maxWidth = 220 }) => {
 // src/routes/api-key-management/api-key-management-list/components/api-key-management-list-table/api-key-row-actions.tsx
 import { PencilSquare, SquareTwoStack, Trash, XCircle } from "@acmekit/icons";
 import { toast, usePrompt } from "@acmekit/ui";
-import { useTranslation as useTranslation2 } from "react-i18next";
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { jsx as jsx3 } from "react/jsx-runtime";
 var ApiKeyRowActions = ({
   apiKey
 }) => {
   const { mutateAsync: revokeAsync } = useRevokeApiKey(apiKey.id);
   const { mutateAsync: deleteAsync } = useDeleteApiKey(apiKey.id);
-  const { t } = useTranslation2();
+  const { t } = useTranslation();
   const prompt = usePrompt();
   const handleDelete = async () => {
     const res = await prompt({
@@ -177,14 +178,14 @@ var ApiKeyRowActions = ({
     navigator.clipboard.writeText(apiKey.token);
     toast.success(t("apiKeyManagement.actions.copySuccessToast"));
   };
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx3(
     ActionMenu,
     {
       groups: [
         {
           actions: [
             {
-              icon: /* @__PURE__ */ jsx4(PencilSquare, {}),
+              icon: /* @__PURE__ */ jsx3(PencilSquare, {}),
               label: t("actions.edit"),
               to: `${apiKey.id}/edit`
             },
@@ -192,7 +193,7 @@ var ApiKeyRowActions = ({
               {
                 label: t("apiKeyManagement.actions.copy"),
                 onClick: handleCopyToken,
-                icon: /* @__PURE__ */ jsx4(SquareTwoStack, {})
+                icon: /* @__PURE__ */ jsx3(SquareTwoStack, {})
               }
             ] : []
           ]
@@ -200,13 +201,13 @@ var ApiKeyRowActions = ({
         {
           actions: [
             {
-              icon: /* @__PURE__ */ jsx4(XCircle, {}),
+              icon: /* @__PURE__ */ jsx3(XCircle, {}),
               label: t("apiKeyManagement.actions.revoke"),
               onClick: handleRevoke,
               disabled: !!apiKey.revoked_at
             },
             {
-              icon: /* @__PURE__ */ jsx4(Trash, {}),
+              icon: /* @__PURE__ */ jsx3(Trash, {}),
               label: t("actions.delete"),
               onClick: handleDelete,
               disabled: !apiKey.revoked_at
@@ -219,55 +220,55 @@ var ApiKeyRowActions = ({
 };
 
 // src/routes/api-key-management/api-key-management-list/components/api-key-management-list-table/use-api-key-management-table-columns.tsx
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { jsx as jsx4 } from "react/jsx-runtime";
 var columnHelper = createColumnHelper();
 var useApiKeyManagementTableColumns = () => {
-  const { t } = useTranslation3();
+  const { t } = useTranslation2();
   return useMemo(
     () => [
       columnHelper.accessor("title", {
         header: t("fields.title"),
-        cell: ({ getValue }) => /* @__PURE__ */ jsx5("div", { className: "flex size-full items-center", children: /* @__PURE__ */ jsx5("span", { className: "truncate", children: getValue() }) })
+        cell: ({ getValue }) => /* @__PURE__ */ jsx4("div", { className: "flex size-full items-center", children: /* @__PURE__ */ jsx4("span", { className: "truncate", children: getValue() }) })
       }),
       columnHelper.accessor("redacted", {
         header: "Token",
         cell: ({ getValue }) => {
           const token = getValue();
-          return /* @__PURE__ */ jsx5(Badge, { size: "2xsmall", children: prettifyRedactedToken(token) });
+          return /* @__PURE__ */ jsx4(Badge, { size: "2xsmall", children: prettifyRedactedToken(token) });
         }
       }),
       columnHelper.accessor("type", {
         header: t("fields.type"),
         cell: ({ getValue }) => {
           const { label } = getApiKeyTypeProps(getValue(), t);
-          return /* @__PURE__ */ jsx5(TextCell, { text: label });
+          return /* @__PURE__ */ jsx4(TextCell, { text: label });
         }
       }),
       columnHelper.accessor("revoked_at", {
         header: t("fields.status"),
         cell: ({ getValue }) => {
           const { color, label } = getApiKeyStatusProps(getValue(), t);
-          return /* @__PURE__ */ jsx5(StatusCell, { color, children: label });
+          return /* @__PURE__ */ jsx4(StatusCell, { color, children: label });
         }
       }),
       columnHelper.accessor("last_used_at", {
         header: t("apiKeyManagement.table.lastUsedAtHeader"),
         cell: ({ getValue }) => {
           const date = getValue();
-          return /* @__PURE__ */ jsx5(DateCell, { date });
+          return /* @__PURE__ */ jsx4(DateCell, { date });
         }
       }),
       columnHelper.accessor("created_at", {
         header: t("fields.created"),
         cell: ({ getValue }) => {
           const date = getValue();
-          return /* @__PURE__ */ jsx5(DateCell, { date });
+          return /* @__PURE__ */ jsx4(DateCell, { date });
         }
       }),
       columnHelper.display({
         id: "actions",
         cell: ({ row }) => {
-          return /* @__PURE__ */ jsx5(ApiKeyRowActions, { apiKey: row.original });
+          return /* @__PURE__ */ jsx4(ApiKeyRowActions, { apiKey: row.original });
         }
       })
     ],
@@ -276,9 +277,9 @@ var useApiKeyManagementTableColumns = () => {
 };
 
 // src/routes/api-key-management/api-key-management-list/components/api-key-management-list-table/use-api-key-management-table-filters.tsx
-import { useTranslation as useTranslation4 } from "react-i18next";
+import { useTranslation as useTranslation3 } from "react-i18next";
 var useApiKeyManagementTableFilters = () => {
-  const { t } = useTranslation4();
+  const { t } = useTranslation3();
   let filters = [];
   const dateFilters = [
     { label: t("fields.createdAt"), key: "created_at", type: "date" },
@@ -315,12 +316,12 @@ var useApiKeyManagementTableQuery = ({
 };
 
 // src/routes/api-key-management/api-key-management-list/components/api-key-management-list-table/api-key-management-list-table.tsx
-import { jsx as jsx6, jsxs } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
 var PAGE_SIZE = 20;
 var ApiKeyManagementListTable = ({
   keyType
 }) => {
-  const { t } = useTranslation5();
+  const { t } = useTranslation4();
   const { searchParams, raw } = useApiKeyManagementTableQuery({
     pageSize: PAGE_SIZE
   });
@@ -345,15 +346,15 @@ var ApiKeyManagementListTable = ({
   if (isError) {
     throw error;
   }
-  return /* @__PURE__ */ jsxs(Container, { className: "divide-y p-0", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx6(Heading, { level: "h1", children: keyType === "client" ? t(`apiKeyManagement.domain.client`) : t("apiKeyManagement.domain.secret") }),
-        /* @__PURE__ */ jsx6(Text, { className: "text-ui-fg-subtle", size: "small", children: keyType === "client" ? t(`apiKeyManagement.subtitle.client`) : t("apiKeyManagement.subtitle.secret") })
+  return /* @__PURE__ */ jsxs2(Container, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsxs2("div", { children: [
+        /* @__PURE__ */ jsx5(Heading, { level: "h1", children: keyType === "client" ? t(`apiKeyManagement.domain.client`) : t("apiKeyManagement.domain.secret") }),
+        /* @__PURE__ */ jsx5(Text, { className: "text-ui-fg-subtle", size: "small", children: keyType === "client" ? t(`apiKeyManagement.subtitle.client`) : t("apiKeyManagement.subtitle.secret") })
       ] }),
-      /* @__PURE__ */ jsx6(Link, { to: "create", children: /* @__PURE__ */ jsx6(Button, { variant: "secondary", size: "small", children: t("actions.create") }) })
+      /* @__PURE__ */ jsx5(Link, { to: "create", children: /* @__PURE__ */ jsx5(Button, { variant: "secondary", size: "small", children: t("actions.create") }) })
     ] }),
-    /* @__PURE__ */ jsx6(
+    /* @__PURE__ */ jsx5(
       _DataTable,
       {
         table,
@@ -378,12 +379,12 @@ var ApiKeyManagementListTable = ({
 };
 
 // src/routes/api-key-management/api-key-management-list/api-key-management-list.tsx
-import { jsx as jsx7 } from "react/jsx-runtime";
+import { jsx as jsx6 } from "react/jsx-runtime";
 var ApiKeyManagementList = () => {
   const { pathname } = useLocation();
   const { getWidgets } = useExtension();
   const keyType = getApiKeyTypeFromPathname(pathname);
-  return /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsx6(
     SingleColumnPage,
     {
       hasOutlet: true,
@@ -391,7 +392,7 @@ var ApiKeyManagementList = () => {
         before: getWidgets("api_key.list.before"),
         after: getWidgets("api_key.list.after")
       },
-      children: /* @__PURE__ */ jsx7(ApiKeyManagementListTable, { keyType })
+      children: /* @__PURE__ */ jsx6(ApiKeyManagementListTable, { keyType })
     }
   );
 };