@alepha/ui 0.15.3 → 0.15.5

package/dist/admin/AdminApiKeys-DsmGnHNh.js

@@ -0,0 +1,3 @@
+import { t as AdminApiKeys_default } from "./AdminApiKeys-GMORg-1l.js";
+
+export { AdminApiKeys_default as default };

package/dist/admin/AdminApiKeys-GMORg-1l.js

@@ -0,0 +1,442 @@
+import { ActionButton, ClipboardButton, DataTable, Flex, Text, useDialog, useToast } from "@alepha/ui";
+import { t } from "alepha";
+import { IconCalendarOff, IconCheck, IconClock, IconKey, IconNetwork, IconShieldCheck, IconShieldOff, IconTrash, IconUser } from "@tabler/icons-react";
+import { useRouter } from "alepha/react/router";
+import { ActionIcon, Badge, Box, Code, Group, Paper, RingProgress, SimpleGrid, Stack, ThemeIcon, Tooltip } from "@mantine/core";
+import { useClient } from "alepha/react";
+import { useI18n } from "alepha/react/i18n";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useState } from "react";
+
+//#region ../../src/admin/components/keys/AdminApiKeys.tsx
+const getKeyStatus = (key) => {
+	if (key.revokedAt) return "revoked";
+	if (key.expiresAt && new Date(key.expiresAt) < /* @__PURE__ */ new Date()) return "expired";
+	return "active";
+};
+const getStatusColor = (status) => {
+	switch (status) {
+		case "active": return "teal";
+		case "revoked": return "red";
+		case "expired": return "orange";
+	}
+};
+const getStatusIcon = (status) => {
+	switch (status) {
+		case "active": return /* @__PURE__ */ jsx(IconShieldCheck, { size: 14 });
+		case "revoked": return /* @__PURE__ */ jsx(IconShieldOff, { size: 14 });
+		case "expired": return /* @__PURE__ */ jsx(IconCalendarOff, { size: 14 });
+	}
+};
+const formatKeyPreview = (prefix, suffix) => {
+	return `${prefix}...${suffix}`;
+};
+const StatsCards = ({ stats, loading }) => {
+	const activePercentage = stats.total > 0 ? Math.round(stats.active / stats.total * 100) : 0;
+	return /* @__PURE__ */ jsxs(SimpleGrid, {
+		cols: {
+			base: 2,
+			sm: 4
+		},
+		spacing: "md",
+		children: [
+			/* @__PURE__ */ jsx(Paper, {
+				p: "md",
+				radius: "md",
+				withBorder: true,
+				children: /* @__PURE__ */ jsxs(Group, {
+					justify: "space-between",
+					children: [/* @__PURE__ */ jsxs(Box, { children: [/* @__PURE__ */ jsx(Text, {
+						size: "xs",
+						c: "dimmed",
+						tt: "uppercase",
+						fw: 600,
+						children: "Total Keys"
+					}), /* @__PURE__ */ jsx(Text, {
+						size: "xl",
+						fw: 700,
+						ff: "monospace",
+						children: stats.total
+					})] }), /* @__PURE__ */ jsx(ThemeIcon, {
+						size: "lg",
+						radius: "md",
+						variant: "light",
+						color: "blue",
+						children: /* @__PURE__ */ jsx(IconKey, { size: 20 })
+					})]
+				})
+			}),
+			/* @__PURE__ */ jsx(Paper, {
+				p: "md",
+				radius: "md",
+				withBorder: true,
+				children: /* @__PURE__ */ jsxs(Group, {
+					justify: "space-between",
+					children: [/* @__PURE__ */ jsxs(Box, { children: [/* @__PURE__ */ jsx(Text, {
+						size: "xs",
+						c: "dimmed",
+						tt: "uppercase",
+						fw: 600,
+						children: "Active"
+					}), /* @__PURE__ */ jsx(Text, {
+						size: "xl",
+						fw: 700,
+						ff: "monospace",
+						c: "teal",
+						children: stats.active
+					})] }), /* @__PURE__ */ jsx(RingProgress, {
+						size: 48,
+						thickness: 4,
+						roundCaps: true,
+						sections: [{
+							value: activePercentage,
+							color: "teal"
+						}]
+					})]
+				})
+			}),
+			/* @__PURE__ */ jsx(Paper, {
+				p: "md",
+				radius: "md",
+				withBorder: true,
+				children: /* @__PURE__ */ jsxs(Group, {
+					justify: "space-between",
+					children: [/* @__PURE__ */ jsxs(Box, { children: [/* @__PURE__ */ jsx(Text, {
+						size: "xs",
+						c: "dimmed",
+						tt: "uppercase",
+						fw: 600,
+						children: "Revoked"
+					}), /* @__PURE__ */ jsx(Text, {
+						size: "xl",
+						fw: 700,
+						ff: "monospace",
+						c: "red",
+						children: stats.revoked
+					})] }), /* @__PURE__ */ jsx(ThemeIcon, {
+						size: "lg",
+						radius: "md",
+						variant: "light",
+						color: stats.revoked > 0 ? "red" : "gray",
+						children: /* @__PURE__ */ jsx(IconShieldOff, { size: 20 })
+					})]
+				})
+			}),
+			/* @__PURE__ */ jsx(Paper, {
+				p: "md",
+				radius: "md",
+				withBorder: true,
+				children: /* @__PURE__ */ jsxs(Group, {
+					justify: "space-between",
+					children: [/* @__PURE__ */ jsxs(Box, { children: [/* @__PURE__ */ jsx(Text, {
+						size: "xs",
+						c: "dimmed",
+						tt: "uppercase",
+						fw: 600,
+						children: "Never Used"
+					}), /* @__PURE__ */ jsx(Text, {
+						size: "xl",
+						fw: 700,
+						ff: "monospace",
+						c: "yellow",
+						children: stats.neverUsed
+					})] }), /* @__PURE__ */ jsx(ThemeIcon, {
+						size: "lg",
+						radius: "md",
+						variant: "light",
+						color: stats.neverUsed > 0 ? "yellow" : "gray",
+						children: /* @__PURE__ */ jsx(IconClock, { size: 20 })
+					})]
+				})
+			})
+		]
+	});
+};
+const AdminApiKeys = () => {
+	const client = useClient();
+	const router = useRouter();
+	const { l } = useI18n();
+	const toast = useToast();
+	const dialog = useDialog();
+	const [stats, setStats] = useState({
+		total: 0,
+		active: 0,
+		revoked: 0,
+		expired: 0,
+		neverUsed: 0
+	});
+	const [refreshKey, setRefreshKey] = useState(0);
+	const [loading, setLoading] = useState(true);
+	const filters = t.object({
+		userId: t.optional(t.uuid()),
+		includeRevoked: t.optional(t.boolean())
+	});
+	const handleRevoke = useCallback(async (key) => {
+		if (!await dialog.confirm({
+			title: "Revoke API Key",
+			message: `Are you sure you want to revoke "${key.name}"? This action cannot be undone and will immediately invalidate the key.`,
+			confirmLabel: "Revoke Key",
+			confirmColor: "red"
+		})) return;
+		try {
+			await client.revokeApiKey({ params: { id: key.id } });
+			toast.success(`API key "${key.name}" has been revoked`);
+			setRefreshKey((k) => k + 1);
+		} catch (error) {
+			toast.danger(`Failed to revoke API key`);
+		}
+	}, [
+		client,
+		dialog,
+		toast
+	]);
+	const updateStats = useCallback((keys) => {
+		const now = /* @__PURE__ */ new Date();
+		const newStats = {
+			total: keys.length,
+			active: 0,
+			revoked: 0,
+			expired: 0,
+			neverUsed: 0
+		};
+		for (const key of keys) {
+			if (key.revokedAt) newStats.revoked++;
+			else if (key.expiresAt && new Date(key.expiresAt) < now) newStats.expired++;
+			else newStats.active++;
+			if (!key.lastUsedAt) newStats.neverUsed++;
+		}
+		setStats(newStats);
+		setLoading(false);
+	}, []);
+	return /* @__PURE__ */ jsxs(Flex, {
+		flex: 1,
+		direction: "column",
+		gap: "md",
+		children: [/* @__PURE__ */ jsx(StatsCards, {
+			stats,
+			loading
+		}), /* @__PURE__ */ jsx(DataTable, {
+			submitOnInit: true,
+			defaultSize: 15,
+			typeFormProps: {
+				skipSubmitButton: true,
+				columns: 2
+			},
+			tableProps: {
+				horizontalSpacing: "sm",
+				verticalSpacing: "sm",
+				highlightOnHover: true
+			},
+			onFilterChange: (key, _value, form) => {
+				if (key === "userId" || key === "includeRevoked") return form.submit();
+			},
+			filters,
+			tableTrProps: (item) => {
+				const status = getKeyStatus(item);
+				if (status === "revoked") return {
+					opacity: .6,
+					style: {
+						textDecoration: "line-through",
+						textDecorationColor: "var(--mantine-color-red-5)"
+					}
+				};
+				if (status === "expired") return { opacity: .7 };
+				return {};
+			},
+			items: async (filters) => {
+				const response = await client.findApiKeys({ query: {
+					...filters,
+					includeRevoked: filters.includeRevoked ?? true
+				} });
+				updateStats((await client.findApiKeys({ query: {
+					includeRevoked: true,
+					size: 100
+				} })).content);
+				return response;
+			},
+			columns: {
+				name: {
+					label: "Name",
+					value: (item) => /* @__PURE__ */ jsxs(Stack, {
+						gap: 2,
+						children: [/* @__PURE__ */ jsxs(Group, {
+							gap: "xs",
+							children: [/* @__PURE__ */ jsx(ThemeIcon, {
+								size: "xs",
+								radius: "sm",
+								variant: "light",
+								color: getStatusColor(getKeyStatus(item)),
+								children: /* @__PURE__ */ jsx(IconKey, { size: 10 })
+							}), /* @__PURE__ */ jsx(Text, {
+								size: "sm",
+								fw: 600,
+								children: item.name
+							})]
+						}), item.description && /* @__PURE__ */ jsx(Text, {
+							size: "xs",
+							c: "dimmed",
+							lineClamp: 1,
+							children: item.description
+						})]
+					})
+				},
+				token: {
+					label: "Key",
+					fit: true,
+					value: (item) => /* @__PURE__ */ jsxs(Group, {
+						gap: 4,
+						children: [/* @__PURE__ */ jsx(Code, {
+							ff: "monospace",
+							style: {
+								fontSize: 11,
+								letterSpacing: "0.5px"
+							},
+							children: formatKeyPreview(item.tokenPrefix, item.tokenSuffix)
+						}), /* @__PURE__ */ jsx(ClipboardButton, {
+							size: "xs",
+							variant: "subtle",
+							value: formatKeyPreview(item.tokenPrefix, item.tokenSuffix)
+						})]
+					})
+				},
+				status: {
+					label: "Status",
+					fit: true,
+					value: (item) => {
+						const status = getKeyStatus(item);
+						return /* @__PURE__ */ jsx(Badge, {
+							size: "sm",
+							variant: "light",
+							color: getStatusColor(status),
+							leftSection: getStatusIcon(status),
+							children: status.toUpperCase()
+						});
+					}
+				},
+				roles: {
+					label: "Roles",
+					value: (item) => /* @__PURE__ */ jsxs(Group, {
+						gap: 4,
+						wrap: "wrap",
+						children: [item.roles.length > 0 ? item.roles.slice(0, 3).map((role) => /* @__PURE__ */ jsx(Badge, {
+							size: "xs",
+							variant: "outline",
+							color: "gray",
+							children: role
+						}, role)) : /* @__PURE__ */ jsx(Text, {
+							size: "xs",
+							c: "dimmed",
+							children: "No roles"
+						}), item.roles.length > 3 && /* @__PURE__ */ jsx(Tooltip, {
+							label: item.roles.slice(3).join(", "),
+							children: /* @__PURE__ */ jsxs(Badge, {
+								size: "xs",
+								variant: "light",
+								color: "gray",
+								children: ["+", item.roles.length - 3]
+							})
+						})]
+					})
+				},
+				usage: {
+					label: "Usage",
+					fit: true,
+					value: (item) => /* @__PURE__ */ jsxs(Stack, {
+						gap: 2,
+						children: [/* @__PURE__ */ jsxs(Text, {
+							size: "xs",
+							ff: "monospace",
+							fw: 500,
+							children: [item.usageCount.toLocaleString(), " calls"]
+						}), item.lastUsedAt ? /* @__PURE__ */ jsxs(Group, {
+							gap: 4,
+							children: [/* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								c: "dimmed",
+								children: l(item.lastUsedAt, { date: "fromNow" })
+							}), item.lastUsedIp && /* @__PURE__ */ jsx(Tooltip, {
+								label: `Last IP: ${item.lastUsedIp}`,
+								children: /* @__PURE__ */ jsx(IconNetwork, {
+									size: 12,
+									color: "var(--mantine-color-dimmed)"
+								})
+							})]
+						}) : /* @__PURE__ */ jsx(Text, {
+							size: "xs",
+							c: "yellow",
+							children: "Never used"
+						})]
+					})
+				},
+				userId: {
+					label: "Owner",
+					fit: true,
+					value: (item) => /* @__PURE__ */ jsx(ActionButton, {
+						variant: "subtle",
+						size: "xs",
+						href: router.path("adminUserDetails", { params: { userId: item.userId } }),
+						leftSection: /* @__PURE__ */ jsx(IconUser, { size: 12 }),
+						children: /* @__PURE__ */ jsx(Text, {
+							size: "xs",
+							ff: "monospace",
+							children: item.userId.slice(0, 8)
+						})
+					})
+				},
+				createdAt: {
+					label: "Created",
+					fit: true,
+					value: (item) => /* @__PURE__ */ jsx(Text, {
+						size: "xs",
+						c: "dimmed",
+						children: l(item.createdAt, { date: "fromNow" })
+					})
+				},
+				expiresAt: {
+					label: "Expires",
+					fit: true,
+					value: (item) => {
+						if (!item.expiresAt) return /* @__PURE__ */ jsx(Text, {
+							size: "xs",
+							c: "dimmed",
+							children: "Never"
+						});
+						return /* @__PURE__ */ jsx(Text, {
+							size: "xs",
+							c: new Date(item.expiresAt) < /* @__PURE__ */ new Date() ? "orange" : "dimmed",
+							children: l(item.expiresAt, { date: "fromNow" })
+						});
+					}
+				},
+				actions: {
+					label: "",
+					fit: true,
+					value: (item) => {
+						if (getKeyStatus(item) === "revoked") return /* @__PURE__ */ jsx(Tooltip, {
+							label: "Already revoked",
+							children: /* @__PURE__ */ jsx(IconCheck, {
+								size: 14,
+								color: "var(--mantine-color-dimmed)"
+							})
+						});
+						return /* @__PURE__ */ jsx(Tooltip, {
+							label: "Revoke key",
+							children: /* @__PURE__ */ jsx(ActionIcon, {
+								size: "sm",
+								variant: "subtle",
+								color: "red",
+								onClick: () => handleRevoke(item),
+								children: /* @__PURE__ */ jsx(IconTrash, { size: 14 })
+							})
+						});
+					}
+				}
+			}
+		}, refreshKey)]
+	});
+};
+var AdminApiKeys_default = AdminApiKeys;
+
+//#endregion
+export { AdminApiKeys_default as t };
+//# sourceMappingURL=AdminApiKeys-GMORg-1l.js.map

package/dist/admin/AdminApiKeys-GMORg-1l.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminApiKeys-GMORg-1l.js","names":[],"sources":["../../src/admin/components/keys/AdminApiKeys.tsx"],"sourcesContent":["import {\n  ActionButton,\n  ClipboardButton,\n  DataTable,\n  Flex,\n  Text,\n  useDialog,\n  useToast,\n} from \"@alepha/ui\";\nimport {\n  ActionIcon,\n  Badge,\n  Box,\n  Code,\n  Group,\n  Paper,\n  RingProgress,\n  SimpleGrid,\n  Stack,\n  ThemeIcon,\n  Tooltip,\n} from \"@mantine/core\";\nimport {\n  IconCalendarOff,\n  IconCheck,\n  IconClock,\n  IconKey,\n  IconNetwork,\n  IconShieldCheck,\n  IconShieldOff,\n  IconTrash,\n  IconUser,\n} from \"@tabler/icons-react\";\nimport { type Page, t } from \"alepha\";\nimport type { AdminApiKeyController } from \"alepha/api/keys\";\nimport { useClient } from \"alepha/react\";\nimport { useI18n } from \"alepha/react/i18n\";\nimport { useRouter } from \"alepha/react/router\";\nimport { useCallback, useState } from \"react\";\nimport type { AdminRouter } from \"../../AdminRouter.ts\";\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────────────────────\n\ninterface ApiKeyResource {\n  id: string;\n  userId: string;\n  name: string;\n  description?: string;\n  tokenPrefix: string;\n  tokenSuffix: string;\n  roles: string[];\n  createdAt: string;\n  lastUsedAt?: string;\n  lastUsedIp?: string;\n  expiresAt?: string;\n  revokedAt?: string;\n  usageCount: number;\n}\n\ninterface KeyStats {\n  total: number;\n  active: number;\n  revoked: number;\n  expired: number;\n  neverUsed: number;\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Utilities\n// ─────────────────────────────────────────────────────────────────────────────\n\nconst getKeyStatus = (\n  key: ApiKeyResource,\n): \"active\" | \"revoked\" | \"expired\" => {\n  if (key.revokedAt) return \"revoked\";\n  if (key.expiresAt && new Date(key.expiresAt) < new Date()) return \"expired\";\n  return \"active\";\n};\n\nconst getStatusColor = (status: \"active\" | \"revoked\" | \"expired\") => {\n  switch (status) {\n    case \"active\":\n      return \"teal\";\n    case \"revoked\":\n      return \"red\";\n    case \"expired\":\n      return \"orange\";\n  }\n};\n\nconst getStatusIcon = (status: \"active\" | \"revoked\" | \"expired\") => {\n  switch (status) {\n    case \"active\":\n      return <IconShieldCheck size={14} />;\n    case \"revoked\":\n      return <IconShieldOff size={14} />;\n    case \"expired\":\n      return <IconCalendarOff size={14} />;\n  }\n};\n\nconst formatKeyPreview = (prefix: string, suffix: string) => {\n  return `${prefix}...${suffix}`;\n};\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Stats Cards\n// ─────────────────────────────────────────────────────────────────────────────\n\ninterface StatsCardsProps {\n  stats: KeyStats;\n  loading: boolean;\n}\n\nconst StatsCards = ({ stats, loading }: StatsCardsProps) => {\n  const activePercentage =\n    stats.total > 0 ? Math.round((stats.active / stats.total) * 100) : 0;\n\n  return (\n    <SimpleGrid cols={{ base: 2, sm: 4 }} spacing=\"md\">\n      <Paper p=\"md\" radius=\"md\" withBorder>\n        <Group justify=\"space-between\">\n          <Box>\n            <Text size=\"xs\" c=\"dimmed\" tt=\"uppercase\" fw={600}>\n              Total Keys\n            </Text>\n            <Text size=\"xl\" fw={700} ff=\"monospace\">\n              {stats.total}\n            </Text>\n          </Box>\n          <ThemeIcon size=\"lg\" radius=\"md\" variant=\"light\" color=\"blue\">\n            <IconKey size={20} />\n          </ThemeIcon>\n        </Group>\n      </Paper>\n\n      <Paper p=\"md\" radius=\"md\" withBorder>\n        <Group justify=\"space-between\">\n          <Box>\n            <Text size=\"xs\" c=\"dimmed\" tt=\"uppercase\" fw={600}>\n              Active\n            </Text>\n            <Text size=\"xl\" fw={700} ff=\"monospace\" c=\"teal\">\n              {stats.active}\n            </Text>\n          </Box>\n          <RingProgress\n            size={48}\n            thickness={4}\n            roundCaps\n            sections={[{ value: activePercentage, color: \"teal\" }]}\n          />\n        </Group>\n      </Paper>\n\n      <Paper p=\"md\" radius=\"md\" withBorder>\n        <Group justify=\"space-between\">\n          <Box>\n            <Text size=\"xs\" c=\"dimmed\" tt=\"uppercase\" fw={600}>\n              Revoked\n            </Text>\n            <Text size=\"xl\" fw={700} ff=\"monospace\" c=\"red\">\n              {stats.revoked}\n            </Text>\n          </Box>\n          <ThemeIcon\n            size=\"lg\"\n            radius=\"md\"\n            variant=\"light\"\n            color={stats.revoked > 0 ? \"red\" : \"gray\"}\n          >\n            <IconShieldOff size={20} />\n          </ThemeIcon>\n        </Group>\n      </Paper>\n\n      <Paper p=\"md\" radius=\"md\" withBorder>\n        <Group justify=\"space-between\">\n          <Box>\n            <Text size=\"xs\" c=\"dimmed\" tt=\"uppercase\" fw={600}>\n              Never Used\n            </Text>\n            <Text size=\"xl\" fw={700} ff=\"monospace\" c=\"yellow\">\n              {stats.neverUsed}\n            </Text>\n          </Box>\n          <ThemeIcon\n            size=\"lg\"\n            radius=\"md\"\n            variant=\"light\"\n            color={stats.neverUsed > 0 ? \"yellow\" : \"gray\"}\n          >\n            <IconClock size={20} />\n          </ThemeIcon>\n        </Group>\n      </Paper>\n    </SimpleGrid>\n  );\n};\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Main Component\n// ─────────────────────────────────────────────────────────────────────────────\n\nconst AdminApiKeys = () => {\n  const client = useClient<AdminApiKeyController>();\n  const router = useRouter<AdminRouter>();\n  const { l } = useI18n();\n  const toast = useToast();\n  const dialog = useDialog();\n\n  const [stats, setStats] = useState<KeyStats>({\n    total: 0,\n    active: 0,\n    revoked: 0,\n    expired: 0,\n    neverUsed: 0,\n  });\n  const [refreshKey, setRefreshKey] = useState(0);\n  const [loading, setLoading] = useState(true);\n\n  const filters = t.object({\n    userId: t.optional(t.uuid()),\n    includeRevoked: t.optional(t.boolean()),\n  });\n\n  const handleRevoke = useCallback(\n    async (key: ApiKeyResource) => {\n      const confirmed = await dialog.confirm({\n        title: \"Revoke API Key\",\n        message: `Are you sure you want to revoke \"${key.name}\"? This action cannot be undone and will immediately invalidate the key.`,\n        confirmLabel: \"Revoke Key\",\n        confirmColor: \"red\",\n      });\n\n      if (!confirmed) return;\n\n      try {\n        await client.revokeApiKey({ params: { id: key.id } });\n        toast.success(`API key \"${key.name}\" has been revoked`);\n        setRefreshKey((k) => k + 1);\n      } catch (error) {\n        toast.danger(`Failed to revoke API key`);\n      }\n    },\n    [client, dialog, toast],\n  );\n\n  // Calculate stats from loaded data\n  const updateStats = useCallback((keys: ApiKeyResource[]) => {\n    const now = new Date();\n    const newStats: KeyStats = {\n      total: keys.length,\n      active: 0,\n      revoked: 0,\n      expired: 0,\n      neverUsed: 0,\n    };\n\n    for (const key of keys) {\n      if (key.revokedAt) {\n        newStats.revoked++;\n      } else if (key.expiresAt && new Date(key.expiresAt) < now) {\n        newStats.expired++;\n      } else {\n        newStats.active++;\n      }\n\n      if (!key.lastUsedAt) {\n        newStats.neverUsed++;\n      }\n    }\n\n    setStats(newStats);\n    setLoading(false);\n  }, []);\n\n  return (\n    <Flex flex={1} direction=\"column\" gap=\"md\">\n      {/* Stats Header */}\n      <StatsCards stats={stats} loading={loading} />\n\n      {/* API Keys Table */}\n      <DataTable<ApiKeyResource, typeof filters>\n        key={refreshKey}\n        submitOnInit\n        defaultSize={15}\n        typeFormProps={{\n          skipSubmitButton: true,\n          columns: 2,\n        }}\n        tableProps={{\n          horizontalSpacing: \"sm\",\n          verticalSpacing: \"sm\",\n          highlightOnHover: true,\n        }}\n        onFilterChange={(key, _value, form) => {\n          if (key === \"userId\" || key === \"includeRevoked\") {\n            return form.submit();\n          }\n        }}\n        filters={filters}\n        tableTrProps={(item) => {\n          const status = getKeyStatus(item);\n          if (status === \"revoked\") {\n            return {\n              opacity: 0.6,\n              style: {\n                textDecoration: \"line-through\",\n                textDecorationColor: \"var(--mantine-color-red-5)\",\n              },\n            };\n          }\n          if (status === \"expired\") {\n            return { opacity: 0.7 };\n          }\n          return {};\n        }}\n        items={async (filters) => {\n          const response = await client.findApiKeys({\n            query: {\n              ...filters,\n              includeRevoked: filters.includeRevoked ?? true,\n            },\n          });\n\n          // Update stats with all keys (need to fetch all for accurate stats)\n          const allKeys = await client.findApiKeys({\n            query: { includeRevoked: true, size: 100 },\n          });\n          updateStats(allKeys.content as ApiKeyResource[]);\n\n          return response as Page<ApiKeyResource>;\n        }}\n        columns={{\n          name: {\n            label: \"Name\",\n            value: (item) => (\n              <Stack gap={2}>\n                <Group gap=\"xs\">\n                  <ThemeIcon\n                    size=\"xs\"\n                    radius=\"sm\"\n                    variant=\"light\"\n                    color={getStatusColor(getKeyStatus(item))}\n                  >\n                    <IconKey size={10} />\n                  </ThemeIcon>\n                  <Text size=\"sm\" fw={600}>\n                    {item.name}\n                  </Text>\n                </Group>\n                {item.description && (\n                  <Text size=\"xs\" c=\"dimmed\" lineClamp={1}>\n                    {item.description}\n                  </Text>\n                )}\n              </Stack>\n            ),\n          },\n          token: {\n            label: \"Key\",\n            fit: true,\n            value: (item) => (\n              <Group gap={4}>\n                <Code\n                  ff=\"monospace\"\n                  style={{\n                    fontSize: 11,\n                    letterSpacing: \"0.5px\",\n                  }}\n                >\n                  {formatKeyPreview(item.tokenPrefix, item.tokenSuffix)}\n                </Code>\n                <ClipboardButton\n                  size=\"xs\"\n                  variant=\"subtle\"\n                  value={formatKeyPreview(item.tokenPrefix, item.tokenSuffix)}\n                />\n              </Group>\n            ),\n          },\n          status: {\n            label: \"Status\",\n            fit: true,\n            value: (item) => {\n              const status = getKeyStatus(item);\n              return (\n                <Badge\n                  size=\"sm\"\n                  variant=\"light\"\n                  color={getStatusColor(status)}\n                  leftSection={getStatusIcon(status)}\n                >\n                  {status.toUpperCase()}\n                </Badge>\n              );\n            },\n          },\n          roles: {\n            label: \"Roles\",\n            value: (item) => (\n              <Group gap={4} wrap=\"wrap\">\n                {item.roles.length > 0 ? (\n                  item.roles.slice(0, 3).map((role) => (\n                    <Badge key={role} size=\"xs\" variant=\"outline\" color=\"gray\">\n                      {role}\n                    </Badge>\n                  ))\n                ) : (\n                  <Text size=\"xs\" c=\"dimmed\">\n                    No roles\n                  </Text>\n                )}\n                {item.roles.length > 3 && (\n                  <Tooltip label={item.roles.slice(3).join(\", \")}>\n                    <Badge size=\"xs\" variant=\"light\" color=\"gray\">\n                      +{item.roles.length - 3}\n                    </Badge>\n                  </Tooltip>\n                )}\n              </Group>\n            ),\n          },\n          usage: {\n            label: \"Usage\",\n            fit: true,\n            value: (item) => (\n              <Stack gap={2}>\n                <Text size=\"xs\" ff=\"monospace\" fw={500}>\n                  {item.usageCount.toLocaleString()} calls\n                </Text>\n                {item.lastUsedAt ? (\n                  <Group gap={4}>\n                    <Text size=\"xs\" c=\"dimmed\">\n                      {l(item.lastUsedAt, { date: \"fromNow\" })}\n                    </Text>\n                    {item.lastUsedIp && (\n                      <Tooltip label={`Last IP: ${item.lastUsedIp}`}>\n                        <IconNetwork\n                          size={12}\n                          color=\"var(--mantine-color-dimmed)\"\n                        />\n                      </Tooltip>\n                    )}\n                  </Group>\n                ) : (\n                  <Text size=\"xs\" c=\"yellow\">\n                    Never used\n                  </Text>\n                )}\n              </Stack>\n            ),\n          },\n          userId: {\n            label: \"Owner\",\n            fit: true,\n            value: (item) => (\n              <ActionButton\n                variant=\"subtle\"\n                size=\"xs\"\n                href={router.path(\"adminUserDetails\", {\n                  params: { userId: item.userId },\n                })}\n                leftSection={<IconUser size={12} />}\n              >\n                <Text size=\"xs\" ff=\"monospace\">\n                  {item.userId.slice(0, 8)}\n                </Text>\n              </ActionButton>\n            ),\n          },\n          createdAt: {\n            label: \"Created\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {l(item.createdAt, { date: \"fromNow\" })}\n              </Text>\n            ),\n          },\n          expiresAt: {\n            label: \"Expires\",\n            fit: true,\n            value: (item) => {\n              if (!item.expiresAt) {\n                return (\n                  <Text size=\"xs\" c=\"dimmed\">\n                    Never\n                  </Text>\n                );\n              }\n\n              const isExpired = new Date(item.expiresAt) < new Date();\n              return (\n                <Text size=\"xs\" c={isExpired ? \"orange\" : \"dimmed\"}>\n                  {l(item.expiresAt, { date: \"fromNow\" })}\n                </Text>\n              );\n            },\n          },\n          actions: {\n            label: \"\",\n            fit: true,\n            value: (item) => {\n              const status = getKeyStatus(item);\n              if (status === \"revoked\") {\n                return (\n                  <Tooltip label=\"Already revoked\">\n                    <IconCheck size={14} color=\"var(--mantine-color-dimmed)\" />\n                  </Tooltip>\n                );\n              }\n\n              return (\n                <Tooltip label=\"Revoke key\">\n                  <ActionIcon\n                    size=\"sm\"\n                    variant=\"subtle\"\n                    color=\"red\"\n                    onClick={() => handleRevoke(item)}\n                  >\n                    <IconTrash size={14} />\n                  </ActionIcon>\n                </Tooltip>\n              );\n            },\n          },\n        }}\n      />\n    </Flex>\n  );\n};\n\nexport default AdminApiKeys;\n"],"mappings":"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"}

package/dist/admin/AdminAudits-8SM96viT.js

@@ -0,0 +1,3 @@
+import { t as AdminAudits_default } from "./AdminAudits-pkWrjq1Z.js";
+
+export { AdminAudits_default as default };

package/dist/admin/{AdminAudits-Oh7iAfQa.js → AdminAudits-pkWrjq1Z.js}

@@ -2,10 +2,10 @@ import { DataTable, Flex, Text } from "@alepha/ui";
 import { t } from "alepha";
 import { IconAlertTriangle, IconCheck, IconInfoCircle, IconUser, IconX } from "@tabler/icons-react";
 import { useRouter } from "alepha/react/router";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { Badge, Group, Stack, Tooltip } from "@mantine/core";
 import { useClient } from "alepha/react";
 import { useI18n } from "alepha/react/i18n";
+import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region ../../src/admin/components/audits/AdminAudits.tsx
 const getSeverityColor = (severity) => {
@@ -213,4 +213,4 @@ var AdminAudits_default = AdminAudits;
 
 //#endregion
 export { AdminAudits_default as t };
-//# sourceMappingURL=AdminAudits-Oh7iAfQa.js.map
+//# sourceMappingURL=AdminAudits-pkWrjq1Z.js.map

package/dist/admin/{AdminAudits-Oh7iAfQa.js.map → AdminAudits-pkWrjq1Z.js.map}

@@ -1 +1 @@
-{"version":3,"file":"AdminAudits-Oh7iAfQa.js","names":[],"sources":["../../src/admin/components/audits/AdminAudits.tsx"],"sourcesContent":["import { DataTable, Flex, Text } from \"@alepha/ui\";\nimport { Badge, Group, Stack, Tooltip } from \"@mantine/core\";\nimport {\n  IconAlertTriangle,\n  IconCheck,\n  IconInfoCircle,\n  IconUser,\n  IconX,\n} from \"@tabler/icons-react\";\nimport { type Page, t } from \"alepha\";\nimport type { AdminAuditController, AuditEntity } from \"alepha/api/audits\";\nimport { useClient } from \"alepha/react\";\nimport { useI18n } from \"alepha/react/i18n\";\nimport { useRouter } from \"alepha/react/router\";\nimport type { AdminRouter } from \"../../AdminRouter.ts\";\n\nexport interface AdminAuditsProps {\n  userRealmName?: string;\n}\n\nconst getSeverityColor = (severity: string) => {\n  switch (severity) {\n    case \"critical\":\n      return \"red\";\n    case \"warning\":\n      return \"yellow\";\n    default:\n      return \"blue\";\n  }\n};\n\nconst getSeverityIcon = (severity: string) => {\n  switch (severity) {\n    case \"critical\":\n      return <IconAlertTriangle size={12} />;\n    case \"warning\":\n      return <IconAlertTriangle size={12} />;\n    default:\n      return <IconInfoCircle size={12} />;\n  }\n};\n\nconst getTypeColor = (type: string) => {\n  switch (type) {\n    case \"auth\":\n      return \"blue\";\n    case \"user\":\n      return \"grape\";\n    case \"security\":\n      return \"red\";\n    case \"system\":\n      return \"orange\";\n    case \"access\":\n      return \"cyan\";\n    case \"payment\":\n      return \"green\";\n    case \"order\":\n      return \"teal\";\n    default:\n      return \"gray\";\n  }\n};\n\nconst AdminAudits = (props: AdminAuditsProps) => {\n  const client = useClient<AdminAuditController>();\n  const router = useRouter<AdminRouter>();\n  const { l } = useI18n();\n\n  const filters = t.object({\n    type: t.optional(t.text()),\n    action: t.optional(t.text()),\n    severity: t.optional(t.enum([\"info\", \"warning\", \"critical\"])),\n    success: t.optional(t.boolean()),\n    resourceType: t.optional(t.text()),\n    search: t.optional(t.text()),\n    from: t.optional(t.datetime()),\n    to: t.optional(t.datetime()),\n  });\n\n  return (\n    <Flex flex={1} direction=\"column\">\n      <DataTable<AuditEntity, typeof filters>\n        submitOnInit\n        defaultSize={20}\n        typeFormProps={{\n          skipSubmitButton: true,\n          columns: 4,\n        }}\n        tableProps={{\n          horizontalSpacing: \"xs\",\n          verticalSpacing: \"xs\",\n          striped: false,\n          highlightOnHover: true,\n        }}\n        filters={filters}\n        tableTrProps={(item) => ({\n          style: {\n            cursor: item.userId ? \"pointer\" : \"default\",\n            opacity: item.success ? 1 : 0.85,\n          },\n          onClick: () => {\n            if (item.userId) {\n              router.push(\"adminUserDetails\", {\n                params: { userId: item.userId },\n              });\n            }\n          },\n        })}\n        items={async (query) => {\n          const response = await client.findAudits({\n            query: {\n              ...query,\n              userRealm: props.userRealmName,\n            },\n          });\n          return response as Page<AuditEntity>;\n        }}\n        columns={{\n          type: {\n            label: \"Type\",\n            fit: true,\n            value: (item) => (\n              <Badge size=\"sm\" variant=\"light\" color={getTypeColor(item.type)}>\n                {item.type}\n              </Badge>\n            ),\n          },\n          action: {\n            label: \"Action\",\n            fit: true,\n            value: (item) => (\n              <Badge size=\"sm\" variant=\"outline\">\n                {item.action}\n              </Badge>\n            ),\n          },\n          severity: {\n            label: \"Severity\",\n            fit: true,\n            value: (item) => (\n              <Badge\n                size=\"xs\"\n                variant=\"light\"\n                color={getSeverityColor(item.severity)}\n                leftSection={getSeverityIcon(item.severity)}\n              >\n                {item.severity}\n              </Badge>\n            ),\n          },\n          user: {\n            label: \"User\",\n            fit: true,\n            value: (item) =>\n              item.userId ? (\n                <Tooltip\n                  label={\n                    <Stack gap={2}>\n                      <Text size=\"xs\">{item.userEmail || \"No email\"}</Text>\n                      <Text size=\"xs\" c=\"dimmed\">\n                        {item.userRealm || \"default\"}\n                      </Text>\n                    </Stack>\n                  }\n                >\n                  <Group gap={4}>\n                    <IconUser size={12} />\n                    <Text size=\"xs\" lineClamp={1} maw={100}>\n                      {item.userEmail?.split(\"@\")[0] || item.userId.slice(0, 8)}\n                    </Text>\n                  </Group>\n                </Tooltip>\n              ) : (\n                <Text size=\"xs\" c=\"dimmed\">\n                  System\n                </Text>\n              ),\n          },\n          description: {\n            label: \"Description\",\n            value: (item) => (\n              <Text size=\"sm\" lineClamp={1}>\n                {item.description || \"-\"}\n              </Text>\n            ),\n          },\n          resource: {\n            label: \"Resource\",\n            fit: true,\n            value: (item) =>\n              item.resourceType ? (\n                <Tooltip label={`${item.resourceType}: ${item.resourceId}`}>\n                  <Badge size=\"xs\" variant=\"dot\" color=\"gray\">\n                    {item.resourceType}\n                  </Badge>\n                </Tooltip>\n              ) : (\n                <Text size=\"xs\" c=\"dimmed\">\n                  -\n                </Text>\n              ),\n          },\n          success: {\n            label: \"Status\",\n            fit: true,\n            value: (item) =>\n              item.success ? (\n                <IconCheck size={14} color=\"var(--mantine-color-green-6)\" />\n              ) : (\n                <Tooltip label={item.errorMessage || \"Failed\"}>\n                  <IconX size={14} color=\"var(--mantine-color-red-6)\" />\n                </Tooltip>\n              ),\n          },\n          ipAddress: {\n            label: \"IP\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\" ff=\"monospace\">\n                {item.ipAddress || \"-\"}\n              </Text>\n            ),\n          },\n          createdAt: {\n            label: \"Time\",\n            fit: true,\n            value: (item) => (\n              <Tooltip label={l(item.createdAt, { date: \"medium\" })}>\n                <Text size=\"xs\" c=\"dimmed\">\n                  {l(item.createdAt, { date: \"fromNow\" })}\n                </Text>\n              </Tooltip>\n            ),\n          },\n        }}\n      />\n    </Flex>\n  );\n};\n\nexport default AdminAudits;\n"],"mappings":"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"}
+{"version":3,"file":"AdminAudits-pkWrjq1Z.js","names":[],"sources":["../../src/admin/components/audits/AdminAudits.tsx"],"sourcesContent":["import { DataTable, Flex, Text } from \"@alepha/ui\";\nimport { Badge, Group, Stack, Tooltip } from \"@mantine/core\";\nimport {\n  IconAlertTriangle,\n  IconCheck,\n  IconInfoCircle,\n  IconUser,\n  IconX,\n} from \"@tabler/icons-react\";\nimport { type Page, t } from \"alepha\";\nimport type { AdminAuditController, AuditEntity } from \"alepha/api/audits\";\nimport { useClient } from \"alepha/react\";\nimport { useI18n } from \"alepha/react/i18n\";\nimport { useRouter } from \"alepha/react/router\";\nimport type { AdminRouter } from \"../../AdminRouter.ts\";\n\nexport interface AdminAuditsProps {\n  userRealmName?: string;\n}\n\nconst getSeverityColor = (severity: string) => {\n  switch (severity) {\n    case \"critical\":\n      return \"red\";\n    case \"warning\":\n      return \"yellow\";\n    default:\n      return \"blue\";\n  }\n};\n\nconst getSeverityIcon = (severity: string) => {\n  switch (severity) {\n    case \"critical\":\n      return <IconAlertTriangle size={12} />;\n    case \"warning\":\n      return <IconAlertTriangle size={12} />;\n    default:\n      return <IconInfoCircle size={12} />;\n  }\n};\n\nconst getTypeColor = (type: string) => {\n  switch (type) {\n    case \"auth\":\n      return \"blue\";\n    case \"user\":\n      return \"grape\";\n    case \"security\":\n      return \"red\";\n    case \"system\":\n      return \"orange\";\n    case \"access\":\n      return \"cyan\";\n    case \"payment\":\n      return \"green\";\n    case \"order\":\n      return \"teal\";\n    default:\n      return \"gray\";\n  }\n};\n\nconst AdminAudits = (props: AdminAuditsProps) => {\n  const client = useClient<AdminAuditController>();\n  const router = useRouter<AdminRouter>();\n  const { l } = useI18n();\n\n  const filters = t.object({\n    type: t.optional(t.text()),\n    action: t.optional(t.text()),\n    severity: t.optional(t.enum([\"info\", \"warning\", \"critical\"])),\n    success: t.optional(t.boolean()),\n    resourceType: t.optional(t.text()),\n    search: t.optional(t.text()),\n    from: t.optional(t.datetime()),\n    to: t.optional(t.datetime()),\n  });\n\n  return (\n    <Flex flex={1} direction=\"column\">\n      <DataTable<AuditEntity, typeof filters>\n        submitOnInit\n        defaultSize={20}\n        typeFormProps={{\n          skipSubmitButton: true,\n          columns: 4,\n        }}\n        tableProps={{\n          horizontalSpacing: \"xs\",\n          verticalSpacing: \"xs\",\n          striped: false,\n          highlightOnHover: true,\n        }}\n        filters={filters}\n        tableTrProps={(item) => ({\n          style: {\n            cursor: item.userId ? \"pointer\" : \"default\",\n            opacity: item.success ? 1 : 0.85,\n          },\n          onClick: () => {\n            if (item.userId) {\n              router.push(\"adminUserDetails\", {\n                params: { userId: item.userId },\n              });\n            }\n          },\n        })}\n        items={async (query) => {\n          const response = await client.findAudits({\n            query: {\n              ...query,\n              userRealm: props.userRealmName,\n            },\n          });\n          return response as Page<AuditEntity>;\n        }}\n        columns={{\n          type: {\n            label: \"Type\",\n            fit: true,\n            value: (item) => (\n              <Badge size=\"sm\" variant=\"light\" color={getTypeColor(item.type)}>\n                {item.type}\n              </Badge>\n            ),\n          },\n          action: {\n            label: \"Action\",\n            fit: true,\n            value: (item) => (\n              <Badge size=\"sm\" variant=\"outline\">\n                {item.action}\n              </Badge>\n            ),\n          },\n          severity: {\n            label: \"Severity\",\n            fit: true,\n            value: (item) => (\n              <Badge\n                size=\"xs\"\n                variant=\"light\"\n                color={getSeverityColor(item.severity)}\n                leftSection={getSeverityIcon(item.severity)}\n              >\n                {item.severity}\n              </Badge>\n            ),\n          },\n          user: {\n            label: \"User\",\n            fit: true,\n            value: (item) =>\n              item.userId ? (\n                <Tooltip\n                  label={\n                    <Stack gap={2}>\n                      <Text size=\"xs\">{item.userEmail || \"No email\"}</Text>\n                      <Text size=\"xs\" c=\"dimmed\">\n                        {item.userRealm || \"default\"}\n                      </Text>\n                    </Stack>\n                  }\n                >\n                  <Group gap={4}>\n                    <IconUser size={12} />\n                    <Text size=\"xs\" lineClamp={1} maw={100}>\n                      {item.userEmail?.split(\"@\")[0] || item.userId.slice(0, 8)}\n                    </Text>\n                  </Group>\n                </Tooltip>\n              ) : (\n                <Text size=\"xs\" c=\"dimmed\">\n                  System\n                </Text>\n              ),\n          },\n          description: {\n            label: \"Description\",\n            value: (item) => (\n              <Text size=\"sm\" lineClamp={1}>\n                {item.description || \"-\"}\n              </Text>\n            ),\n          },\n          resource: {\n            label: \"Resource\",\n            fit: true,\n            value: (item) =>\n              item.resourceType ? (\n                <Tooltip label={`${item.resourceType}: ${item.resourceId}`}>\n                  <Badge size=\"xs\" variant=\"dot\" color=\"gray\">\n                    {item.resourceType}\n                  </Badge>\n                </Tooltip>\n              ) : (\n                <Text size=\"xs\" c=\"dimmed\">\n                  -\n                </Text>\n              ),\n          },\n          success: {\n            label: \"Status\",\n            fit: true,\n            value: (item) =>\n              item.success ? (\n                <IconCheck size={14} color=\"var(--mantine-color-green-6)\" />\n              ) : (\n                <Tooltip label={item.errorMessage || \"Failed\"}>\n                  <IconX size={14} color=\"var(--mantine-color-red-6)\" />\n                </Tooltip>\n              ),\n          },\n          ipAddress: {\n            label: \"IP\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\" ff=\"monospace\">\n                {item.ipAddress || \"-\"}\n              </Text>\n            ),\n          },\n          createdAt: {\n            label: \"Time\",\n            fit: true,\n            value: (item) => (\n              <Tooltip label={l(item.createdAt, { date: \"medium\" })}>\n                <Text size=\"xs\" c=\"dimmed\">\n                  {l(item.createdAt, { date: \"fromNow\" })}\n                </Text>\n              </Tooltip>\n            ),\n          },\n        }}\n      />\n    </Flex>\n  );\n};\n\nexport default AdminAudits;\n"],"mappings":"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"}

package/dist/admin/AdminFiles-B56ocq4H.js

@@ -0,0 +1,3 @@
+import { t as AdminFiles_default } from "./AdminFiles-WeQbsCsl.js";
+
+export { AdminFiles_default as default };

package/dist/admin/{AdminFiles-Cu8GHgQ3.js → AdminFiles-WeQbsCsl.js}

@@ -1,9 +1,9 @@
 import { DataTable, Flex, Text } from "@alepha/ui";
 import { t } from "alepha";
-import { jsx } from "react/jsx-runtime";
 import { Badge } from "@mantine/core";
 import { useClient } from "alepha/react";
 import { useI18n } from "alepha/react/i18n";
+import { jsx } from "react/jsx-runtime";
 import { files } from "alepha/api/files";
 
 //#region ../../src/admin/components/files/AdminFiles.tsx
@@ -115,4 +115,4 @@ var AdminFiles_default = AdminFiles;
 
 //#endregion
 export { AdminFiles_default as t };
-//# sourceMappingURL=AdminFiles-Cu8GHgQ3.js.map
+//# sourceMappingURL=AdminFiles-WeQbsCsl.js.map

package/dist/admin/{AdminFiles-Cu8GHgQ3.js.map → AdminFiles-WeQbsCsl.js.map}

@@ -1 +1 @@
-{"version":3,"file":"AdminFiles-Cu8GHgQ3.js","names":[],"sources":["../../src/admin/components/files/AdminFiles.tsx"],"sourcesContent":["import { DataTable, Flex, Text } from \"@alepha/ui\";\nimport { Badge } from \"@mantine/core\";\nimport { type Page, t } from \"alepha\";\nimport { type FileController, type FileEntity, files } from \"alepha/api/files\";\nimport { useClient } from \"alepha/react\";\nimport { useI18n } from \"alepha/react/i18n\";\n\nconst AdminFiles = () => {\n  const client = useClient<FileController>();\n  const { l } = useI18n();\n\n  const filters = t.object({\n    bucket: t.optional(t.string()),\n    name: t.optional(\n      t.string({\n        $control: {\n          query: t.pick(files.schema, [\"name\", \"bucket\", \"mimeType\"]),\n        },\n      }),\n    ),\n  });\n\n  const formatFileSize = (bytes: number) => {\n    if (bytes === 0) return \"0 B\";\n    const k = 1024;\n    const sizes = [\"B\", \"KB\", \"MB\", \"GB\"];\n    const i = Math.floor(Math.log(bytes) / Math.log(k));\n    return `${Number.parseFloat((bytes / k ** i).toFixed(1))} ${sizes[i]}`;\n  };\n\n  return (\n    <Flex flex={1} direction={\"column\"}>\n      <DataTable<FileEntity, typeof filters>\n        submitOnInit\n        defaultSize={10}\n        typeFormProps={{\n          skipSubmitButton: true,\n          columns: 3,\n        }}\n        tableProps={{\n          horizontalSpacing: \"xs\",\n          verticalSpacing: \"xs\",\n        }}\n        onFilterChange={(key, _value, form) => {\n          if (key === \"name\" || key === \"bucket\") {\n            return form.submit();\n          }\n        }}\n        filters={filters}\n        items={async (filters) => {\n          const response = await client.findFiles({\n            query: filters,\n          });\n\n          return response as Page<FileEntity>;\n        }}\n        columns={{\n          name: {\n            label: \"Name\",\n            value: (item) => (\n              <Text size=\"sm\" fw={500} lineClamp={1}>\n                {item.name}\n              </Text>\n            ),\n          },\n          bucket: {\n            label: \"Bucket\",\n            fit: true,\n            value: (item) => (\n              <Badge size=\"sm\" variant=\"light\" color=\"blue\">\n                {item.bucket}\n              </Badge>\n            ),\n          },\n          mimeType: {\n            label: \"Type\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {item.mimeType}\n              </Text>\n            ),\n          },\n          size: {\n            label: \"Size\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {formatFileSize(item.size)}\n              </Text>\n            ),\n          },\n          creatorName: {\n            label: \"Creator\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {item.creatorName || \"-\"}\n              </Text>\n            ),\n          },\n          createdAt: {\n            label: \"Created\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {l(item.createdAt, { date: \"fromNow\" })}\n              </Text>\n            ),\n          },\n        }}\n      />\n    </Flex>\n  );\n};\n\nexport default AdminFiles;\n"],"mappings":";;;;;;;;;AAOA,MAAM,mBAAmB;CACvB,MAAM,SAAS,WAA2B;CAC1C,MAAM,EAAE,MAAM,SAAS;CAEvB,MAAM,UAAU,EAAE,OAAO;EACvB,QAAQ,EAAE,SAAS,EAAE,QAAQ,CAAC;EAC9B,MAAM,EAAE,SACN,EAAE,OAAO,EACP,UAAU,EACR,OAAO,EAAE,KAAK,MAAM,QAAQ;GAAC;GAAQ;GAAU;GAAW,CAAC,EAC5D,EACF,CAAC,CACH;EACF,CAAC;CAEF,MAAM,kBAAkB,UAAkB;AACxC,MAAI,UAAU,EAAG,QAAO;EACxB,MAAM,IAAI;EACV,MAAM,QAAQ;GAAC;GAAK;GAAM;GAAM;GAAK;EACrC,MAAM,IAAI,KAAK,MAAM,KAAK,IAAI,MAAM,GAAG,KAAK,IAAI,EAAE,CAAC;AACnD,SAAO,GAAG,OAAO,YAAY,QAAQ,KAAK,GAAG,QAAQ,EAAE,CAAC,CAAC,GAAG,MAAM;;AAGpE,QACE,oBAAC;EAAK,MAAM;EAAG,WAAW;YACxB,oBAAC;GACC;GACA,aAAa;GACb,eAAe;IACb,kBAAkB;IAClB,SAAS;IACV;GACD,YAAY;IACV,mBAAmB;IACnB,iBAAiB;IAClB;GACD,iBAAiB,KAAK,QAAQ,SAAS;AACrC,QAAI,QAAQ,UAAU,QAAQ,SAC5B,QAAO,KAAK,QAAQ;;GAGf;GACT,OAAO,OAAO,YAAY;AAKxB,WAJiB,MAAM,OAAO,UAAU,EACtC,OAAO,SACR,CAAC;;GAIJ,SAAS;IACP,MAAM;KACJ,OAAO;KACP,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,IAAI;MAAK,WAAW;gBACjC,KAAK;OACD;KAEV;IACD,QAAQ;KACN,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAM,MAAK;MAAK,SAAQ;MAAQ,OAAM;gBACpC,KAAK;OACA;KAEX;IACD,UAAU;KACR,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,GAAE;gBACf,KAAK;OACD;KAEV;IACD,MAAM;KACJ,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,GAAE;gBACf,eAAe,KAAK,KAAK;OACrB;KAEV;IACD,aAAa;KACX,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,GAAE;gBACf,KAAK,eAAe;OAChB;KAEV;IACD,WAAW;KACT,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,GAAE;gBACf,EAAE,KAAK,WAAW,EAAE,MAAM,WAAW,CAAC;OAClC;KAEV;IACF;IACD;GACG;;AAIX,yBAAe"}
+{"version":3,"file":"AdminFiles-WeQbsCsl.js","names":[],"sources":["../../src/admin/components/files/AdminFiles.tsx"],"sourcesContent":["import { DataTable, Flex, Text } from \"@alepha/ui\";\nimport { Badge } from \"@mantine/core\";\nimport { type Page, t } from \"alepha\";\nimport { type FileController, type FileEntity, files } from \"alepha/api/files\";\nimport { useClient } from \"alepha/react\";\nimport { useI18n } from \"alepha/react/i18n\";\n\nconst AdminFiles = () => {\n  const client = useClient<FileController>();\n  const { l } = useI18n();\n\n  const filters = t.object({\n    bucket: t.optional(t.string()),\n    name: t.optional(\n      t.string({\n        $control: {\n          query: t.pick(files.schema, [\"name\", \"bucket\", \"mimeType\"]),\n        },\n      }),\n    ),\n  });\n\n  const formatFileSize = (bytes: number) => {\n    if (bytes === 0) return \"0 B\";\n    const k = 1024;\n    const sizes = [\"B\", \"KB\", \"MB\", \"GB\"];\n    const i = Math.floor(Math.log(bytes) / Math.log(k));\n    return `${Number.parseFloat((bytes / k ** i).toFixed(1))} ${sizes[i]}`;\n  };\n\n  return (\n    <Flex flex={1} direction={\"column\"}>\n      <DataTable<FileEntity, typeof filters>\n        submitOnInit\n        defaultSize={10}\n        typeFormProps={{\n          skipSubmitButton: true,\n          columns: 3,\n        }}\n        tableProps={{\n          horizontalSpacing: \"xs\",\n          verticalSpacing: \"xs\",\n        }}\n        onFilterChange={(key, _value, form) => {\n          if (key === \"name\" || key === \"bucket\") {\n            return form.submit();\n          }\n        }}\n        filters={filters}\n        items={async (filters) => {\n          const response = await client.findFiles({\n            query: filters,\n          });\n\n          return response as Page<FileEntity>;\n        }}\n        columns={{\n          name: {\n            label: \"Name\",\n            value: (item) => (\n              <Text size=\"sm\" fw={500} lineClamp={1}>\n                {item.name}\n              </Text>\n            ),\n          },\n          bucket: {\n            label: \"Bucket\",\n            fit: true,\n            value: (item) => (\n              <Badge size=\"sm\" variant=\"light\" color=\"blue\">\n                {item.bucket}\n              </Badge>\n            ),\n          },\n          mimeType: {\n            label: \"Type\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {item.mimeType}\n              </Text>\n            ),\n          },\n          size: {\n            label: \"Size\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {formatFileSize(item.size)}\n              </Text>\n            ),\n          },\n          creatorName: {\n            label: \"Creator\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {item.creatorName || \"-\"}\n              </Text>\n            ),\n          },\n          createdAt: {\n            label: \"Created\",\n            fit: true,\n            value: (item) => (\n              <Text size=\"xs\" c=\"dimmed\">\n                {l(item.createdAt, { date: \"fromNow\" })}\n              </Text>\n            ),\n          },\n        }}\n      />\n    </Flex>\n  );\n};\n\nexport default AdminFiles;\n"],"mappings":";;;;;;;;;AAOA,MAAM,mBAAmB;CACvB,MAAM,SAAS,WAA2B;CAC1C,MAAM,EAAE,MAAM,SAAS;CAEvB,MAAM,UAAU,EAAE,OAAO;EACvB,QAAQ,EAAE,SAAS,EAAE,QAAQ,CAAC;EAC9B,MAAM,EAAE,SACN,EAAE,OAAO,EACP,UAAU,EACR,OAAO,EAAE,KAAK,MAAM,QAAQ;GAAC;GAAQ;GAAU;GAAW,CAAC,EAC5D,EACF,CAAC,CACH;EACF,CAAC;CAEF,MAAM,kBAAkB,UAAkB;AACxC,MAAI,UAAU,EAAG,QAAO;EACxB,MAAM,IAAI;EACV,MAAM,QAAQ;GAAC;GAAK;GAAM;GAAM;GAAK;EACrC,MAAM,IAAI,KAAK,MAAM,KAAK,IAAI,MAAM,GAAG,KAAK,IAAI,EAAE,CAAC;AACnD,SAAO,GAAG,OAAO,YAAY,QAAQ,KAAK,GAAG,QAAQ,EAAE,CAAC,CAAC,GAAG,MAAM;;AAGpE,QACE,oBAAC;EAAK,MAAM;EAAG,WAAW;YACxB,oBAAC;GACC;GACA,aAAa;GACb,eAAe;IACb,kBAAkB;IAClB,SAAS;IACV;GACD,YAAY;IACV,mBAAmB;IACnB,iBAAiB;IAClB;GACD,iBAAiB,KAAK,QAAQ,SAAS;AACrC,QAAI,QAAQ,UAAU,QAAQ,SAC5B,QAAO,KAAK,QAAQ;;GAGf;GACT,OAAO,OAAO,YAAY;AAKxB,WAJiB,MAAM,OAAO,UAAU,EACtC,OAAO,SACR,CAAC;;GAIJ,SAAS;IACP,MAAM;KACJ,OAAO;KACP,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,IAAI;MAAK,WAAW;gBACjC,KAAK;OACD;KAEV;IACD,QAAQ;KACN,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAM,MAAK;MAAK,SAAQ;MAAQ,OAAM;gBACpC,KAAK;OACA;KAEX;IACD,UAAU;KACR,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,GAAE;gBACf,KAAK;OACD;KAEV;IACD,MAAM;KACJ,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,GAAE;gBACf,eAAe,KAAK,KAAK;OACrB;KAEV;IACD,aAAa;KACX,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,GAAE;gBACf,KAAK,eAAe;OAChB;KAEV;IACD,WAAW;KACT,OAAO;KACP,KAAK;KACL,QAAQ,SACN,oBAAC;MAAK,MAAK;MAAK,GAAE;gBACf,EAAE,KAAK,WAAW,EAAE,MAAM,WAAW,CAAC;OAClC;KAEV;IACF;IACD;GACG;;AAIX,yBAAe"}