@streamoid/settings 0.13.0 → 0.15.0

package/dist/index.js

@@ -34,7 +34,9 @@ __export(index_exports, {
   CreditPoolMemberModal: () => CreditPoolMemberModal,
   DEFAULT_PERMISSIONS: () => DEFAULT_PERMISSIONS,
   DEFAULT_USER_LANGUAGE: () => DEFAULT_USER_LANGUAGE,
+  EMPTY_USAGE_LOGS_PAGE: () => EMPTY_USAGE_LOGS_PAGE,
   ExportDateModal: () => ExportDateModal,
+  INITIAL_USAGE_LOGS_STATE: () => INITIAL_USAGE_LOGS_STATE,
   InviteUpdateModal: () => InviteUpdateModal,
   MemberCreditLimitModal: () => MemberCreditLimitModal,
   MemberListFrame: () => MemberListFrame,
@@ -67,7 +69,12 @@ __export(index_exports, {
   TeamsContent: () => TeamsContent,
   TokensContent: () => TokensContent,
   URL_TO_TAB: () => URL_TO_TAB,
+  USAGE_LOGS_EXPORT_BATCH_SIZE: () => USAGE_LOGS_EXPORT_BATCH_SIZE,
+  USAGE_LOGS_EXPORT_EXTRA_REQUESTS: () => USAGE_LOGS_EXPORT_EXTRA_REQUESTS,
+  USAGE_LOGS_EXPORT_MAX_ROWS: () => USAGE_LOGS_EXPORT_MAX_ROWS,
+  USAGE_LOGS_PAGE_SIZE: () => USAGE_LOGS_PAGE_SIZE,
   USER_LANGUAGES: () => USER_LANGUAGES,
+  UsageLogsPager: () => UsageLogsPager,
   WORKSPACE_LIST_PAGE_SIZE: () => WORKSPACE_LIST_PAGE_SIZE,
   WorkspaceGeneralTab: () => WorkspaceGeneralTab,
   WorkspaceListTab: () => WorkspaceListTab,
@@ -79,13 +86,17 @@ __export(index_exports, {
   cleanCreditLimitInput: () => cleanCreditLimitInput,
   cleanPoolValueInput: () => cleanPoolValueInput,
   countLabel: () => countLabel,
+  createUsedByNamesLoader: () => createUsedByNamesLoader,
   creditCycleUnit: () => creditCycleUnit,
   creditsMeter: () => creditsMeter,
   deriveWorkspaceInvitePermission: () => deriveWorkspaceInvitePermission,
   describeAllowance: () => describeAllowance,
   describeDefaultLimit: () => describeDefaultLimit,
   describeMemberLimit: () => describeMemberLimit,
+  entitlementFromBody: () => entitlementFromBody,
+  entitlementFromFailure: () => entitlementFromFailure,
   expiryChoiceFor: () => expiryChoiceFor,
+  fetchUsageLogsInRange: () => fetchUsageLogsInRange,
   findBillingError: () => findBillingError,
   findPoolError: () => findPoolError,
   formatCreditLimit: () => formatCreditLimit,
@@ -93,16 +104,21 @@ __export(index_exports, {
   formatPoolEndsAt: () => formatPoolEndsAt,
   formatPoolSplit: () => formatPoolSplit,
   groupWorkspaceList: () => groupWorkspaceList,
+  hasPaidFeatures: () => hasPaidFeatures,
   isLimitBelowUsage: () => isLimitBelowUsage,
+  isPaidPlan: () => isPaidPlan,
+  isSponsoredEntitlement: () => isSponsoredEntitlement,
   joinMembersWithLimits: () => joinMembersWithLimits,
   lastUsedLabel: () => lastUsedLabel,
   limitBelowUsageUsed: () => limitBelowUsageUsed,
   limitSourceLabel: () => limitSourceLabel,
+  loadCurrentPlan: () => loadCurrentPlan,
   loadWorkspaceOrganization: () => loadWorkspaceOrganization,
   memberRoleUpdate: () => memberRoleUpdate,
   minPoolEndDate: () => minPoolEndDate,
   minimumCreditLimit: () => minimumCreditLimit,
   ownCreditsFirstText: () => ownCreditsFirstText,
+  parseBillingEntitlement: () => parseBillingEntitlement,
   pausedOwnCreditsText: () => pausedOwnCreditsText,
   poolEndsAtFrom: () => poolEndsAtFrom,
   poolErrorMessage: () => poolErrorMessage,
@@ -115,7 +131,17 @@ __export(index_exports, {
   settingsReturnTarget: () => settingsReturnTarget,
   sharedPoolBannerText: () => sharedPoolBannerText,
   sharedPoolEndsText: () => sharedPoolEndsText,
+  sliceUsageLogsPage: () => sliceUsageLogsPage,
+  sponsoredCreditsText: () => sponsoredCreditsText,
+  toCsv: () => toCsv,
   toLocalDateInput: () => toLocalDateInput,
+  usageLogsCsvRows: () => usageLogsCsvRows,
+  usageLogsDateRange: () => usageLogsDateRange,
+  usageLogsExportFileName: () => usageLogsExportFileName,
+  usageLogsPage: () => usageLogsPage,
+  usageLogsReducer: () => usageLogsReducer,
+  usageLogsSpentByOthers: () => usageLogsSpentByOthers,
+  useBillingEntitlement: () => useBillingEntitlement,
   useSettingsAdapters: () => useSettingsAdapters,
   useWorkspaceInvitePermission: () => useWorkspaceInvitePermission,
   useWorkspaceOrganization: () => useWorkspaceOrganization,
@@ -7888,7 +7914,10 @@ function formatDateRange(date) {
 function ExportDateModal({
   title,
   onClose,
-  onExport
+  onExport,
+  busy = false,
+  busyText,
+  notice = null
 }) {
   useOverlayOpen(true, onClose);
   const now = /* @__PURE__ */ new Date();
@@ -7975,6 +8004,7 @@ function ExportDateModal({
     [rangeStart, rangeEnd, isFuture]
   );
   const handleExport = () => {
+    if (busy) return;
     if (rangeStart && rangeEnd) onExport(rangeStart, rangeEnd);
   };
   const getCellVisuals = (cell, idx) => {
@@ -8196,24 +8226,42 @@ function ExportDateModal({
                   borderTop: "1px solid var(--alias-border-subtle)"
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-                    "p",
-                    {
-                      className: "flex-1 min-w-0 truncate",
-                      style: {
-                        fontFamily: "var(--font-family-font-family-body)",
-                        fontSize: "var(--font-size-font-size-md)",
-                        fontWeight: 400,
-                        lineHeight: "var(--line-height-line-height-md)",
-                        color: "var(--alias-text---icons-primary)"
-                      },
-                      children: rangeStart && rangeEnd ? `${formatDateRange(rangeStart)} - ${formatDateRange(rangeEnd)}` : rangeStart ? `${formatDateRange(rangeStart)} - Select end date` : "Select date range"
-                    }
-                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 min-w-0 flex flex-col", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                      "p",
+                      {
+                        className: "min-w-0 truncate",
+                        style: {
+                          fontFamily: "var(--font-family-font-family-body)",
+                          fontSize: "var(--font-size-font-size-md)",
+                          fontWeight: 400,
+                          lineHeight: "var(--line-height-line-height-md)",
+                          color: "var(--alias-text---icons-primary)"
+                        },
+                        "aria-live": "polite",
+                        children: busy && busyText ? busyText : rangeStart && rangeEnd ? `${formatDateRange(rangeStart)} - ${formatDateRange(rangeEnd)}` : rangeStart ? `${formatDateRange(rangeStart)} - Select end date` : "Select date range"
+                      }
+                    ),
+                    notice && !busy && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                      "p",
+                      {
+                        role: "alert",
+                        style: {
+                          fontFamily: "var(--font-family-font-family-body)",
+                          fontSize: "var(--font-size-font-size-sm)",
+                          fontWeight: 400,
+                          lineHeight: "var(--line-height-line-height-sm)",
+                          color: "var(--alias-text---icons-error)"
+                        },
+                        children: notice
+                      }
+                    )
+                  ] }),
                   /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
                     "div",
                     {
-                      className: `flex items-center justify-center shrink-0 ${rangeStart && rangeEnd ? "cursor-pointer" : "opacity-50 cursor-not-allowed"}`,
+                      className: `flex items-center justify-center shrink-0 ${rangeStart && rangeEnd && !busy ? "cursor-pointer" : "opacity-50 cursor-not-allowed"}`,
+                      "aria-disabled": busy || !(rangeStart && rangeEnd),
                       style: {
                         backgroundColor: "var(--alias-text---icons-primary)",
                         borderRadius: "var(--radius-xl)",
@@ -8231,7 +8279,7 @@ function ExportDateModal({
                             lineHeight: "var(--line-height-line-height-sm)",
                             color: "var(--alias-text---icons-inverse)"
                           },
-                          children: "Export"
+                          children: busy ? "Exporting\u2026" : "Export"
                         }
                       )
                     }
@@ -10585,6 +10633,261 @@ function SharedCreditsView() {
   ] });
 }
 
+// src/entitlement.ts
+function parseBillingEntitlement(value) {
+  if (!value || typeof value !== "object") return null;
+  const raw = value;
+  if (typeof raw.paid !== "boolean") return null;
+  const source = raw.source === "plan" || raw.source === "pool" ? raw.source : null;
+  const entitlement = { paid: raw.paid, source };
+  if (typeof raw.sponsorWorkspaceId === "string") entitlement.sponsorWorkspaceId = raw.sponsorWorkspaceId;
+  if (typeof raw.sponsorName === "string") entitlement.sponsorName = raw.sponsorName;
+  if (typeof raw.endsAt === "string" || raw.endsAt === null) entitlement.endsAt = raw.endsAt;
+  return entitlement;
+}
+function entitlementFromBody(body) {
+  if (!body || typeof body !== "object") return null;
+  return parseBillingEntitlement(body.entitlement);
+}
+function entitlementFromFailure(failure) {
+  const seen = /* @__PURE__ */ new Set();
+  const visit = (value, depth) => {
+    if (depth > 4 || value == null || typeof value !== "object" || seen.has(value)) return null;
+    seen.add(value);
+    const found = entitlementFromBody(value);
+    if (found) return found;
+    const error = value;
+    const response = error.response;
+    for (const child of [error.body, error.data, response?.data, error.cause]) {
+      const nested = visit(child, depth + 1);
+      if (nested) return nested;
+    }
+    return null;
+  };
+  return visit(failure, 0);
+}
+function isPaidPlan(subscription) {
+  const amount = subscription?.plan?.amount;
+  return amount != null && amount > 0;
+}
+function hasPaidFeatures({
+  entitlement,
+  subscription
+}) {
+  return entitlement ? entitlement.paid : isPaidPlan(subscription);
+}
+function isSponsoredEntitlement(entitlement) {
+  return entitlement?.source === "pool" && entitlement.paid;
+}
+function sponsoredCreditsText(entitlement) {
+  const sponsor = entitlement.sponsorName?.trim() || "another workspace";
+  const ends = entitlement.endsAt ? ` Sharing ends on ${formatPoolEndsAt(entitlement.endsAt)}.` : "";
+  return `Credits shared by ${sponsor}.${ends}`;
+}
+async function loadCurrentPlan(fetchCurrentPlan) {
+  let response;
+  try {
+    response = await fetchCurrentPlan();
+  } catch (failure) {
+    const entitlement2 = entitlementFromFailure(failure);
+    if (!entitlement2) throw failure;
+    return { subscription: null, entitlement: entitlement2, paid: entitlement2.paid };
+  }
+  const subscription = response?.data ?? null;
+  const entitlement = entitlementFromBody(response);
+  return { subscription, entitlement, paid: hasPaidFeatures({ entitlement, subscription }) };
+}
+
+// src/usage-logs.ts
+var USAGE_LOGS_PAGE_SIZE = 50;
+var USAGE_LOGS_EXPORT_BATCH_SIZE = 100;
+var USAGE_LOGS_EXPORT_MAX_ROWS = 2e4;
+var USAGE_LOGS_EXPORT_EXTRA_REQUESTS = 10;
+function rowsOf(res) {
+  return Array.isArray(res?.data) ? res.data : [];
+}
+function sliceUsageLogsPage(all, page, pageSize = USAGE_LOGS_PAGE_SIZE) {
+  const total = all.length;
+  const totalPages = Math.max(1, Math.ceil(total / pageSize));
+  const safePage = Math.min(Math.max(1, Math.floor(page) || 1), totalPages);
+  return {
+    rows: all.slice((safePage - 1) * pageSize, safePage * pageSize),
+    page: safePage,
+    totalPages,
+    total,
+    unpaged: all
+  };
+}
+function usageLogsPage(res, page, pageSize = USAGE_LOGS_PAGE_SIZE) {
+  const data = rowsOf(res);
+  const pagination = res?.pagination;
+  if (!pagination || !Number.isFinite(pagination.total)) {
+    return sliceUsageLogsPage(data, page, pageSize);
+  }
+  const total = Math.max(0, pagination.total);
+  const limit = pagination.limit > 0 ? pagination.limit : pageSize;
+  const totalPages = Math.max(
+    1,
+    pagination.totalPages > 0 ? pagination.totalPages : Math.ceil(total / limit)
+  );
+  return {
+    rows: data.slice(0, pageSize),
+    page: pagination.page > 0 ? pagination.page : page,
+    totalPages,
+    total,
+    unpaged: null
+  };
+}
+var EMPTY_USAGE_LOGS_PAGE = {
+  rows: [],
+  page: 1,
+  totalPages: 1,
+  total: 0,
+  unpaged: null
+};
+var INITIAL_USAGE_LOGS_STATE = {
+  logs: EMPTY_USAGE_LOGS_PAGE,
+  requestedPage: 1,
+  loading: false,
+  error: null
+};
+function usageLogsReducer(state, action) {
+  switch (action.type) {
+    case "request":
+      return { ...state, requestedPage: action.page, loading: true, error: null };
+    case "loaded":
+      return {
+        logs: action.logs,
+        requestedPage: action.logs.page,
+        loading: false,
+        error: null
+      };
+    case "failed":
+      return { ...state, loading: false, error: action.error };
+    case "turn": {
+      if (!state.logs.unpaged || state.error) return state;
+      const logs = sliceUsageLogsPage(state.logs.unpaged, action.page);
+      return { ...state, logs, requestedPage: logs.page };
+    }
+    case "reset":
+      return INITIAL_USAGE_LOGS_STATE;
+  }
+}
+function usageLogsSpentByOthers(logs, workspaceId) {
+  return (logs.unpaged ?? logs.rows).some(
+    (log) => usedByWorkspaceKey(log, workspaceId) !== null
+  );
+}
+function createUsedByNamesLoader(save) {
+  let savedFor = null;
+  let inFlight = null;
+  return {
+    async load(workspaceId, fetchCreditPool) {
+      if (savedFor === workspaceId || inFlight?.workspaceId === workspaceId) {
+        return;
+      }
+      const lookup = { workspaceId };
+      inFlight = lookup;
+      try {
+        const pool = await fetchCreditPool();
+        if (inFlight !== lookup) return;
+        if (save(workspaceId, usedByNamesFrom(pool))) savedFor = workspaceId;
+      } catch {
+      } finally {
+        if (inFlight === lookup) inFlight = null;
+      }
+    },
+    reset() {
+      savedFor = null;
+      inFlight = null;
+    }
+  };
+}
+function usageLogsExportFileName(start, end) {
+  return `usage_logs_${toLocalDateInput(start)}_${toLocalDateInput(end)}.csv`;
+}
+function usageLogsDateRange(start, end) {
+  const from = new Date(start);
+  from.setHours(0, 0, 0, 0);
+  const to = new Date(end);
+  to.setHours(23, 59, 59, 999);
+  return { startDate: from.toISOString(), endDate: to.toISOString() };
+}
+async function fetchUsageLogsInRange(fetchUsageLogs, range, {
+  batchSize = USAGE_LOGS_EXPORT_BATCH_SIZE,
+  maxRows = USAGE_LOGS_EXPORT_MAX_ROWS,
+  maxRequests,
+  onProgress,
+  signal
+} = {}) {
+  const first = await fetchUsageLogs({ ...range, page: 1, limit: batchSize });
+  if (signal?.aborted) return { status: "cancelled" };
+  if (!first?.pagination || !Number.isFinite(first.pagination.total)) {
+    const from = Date.parse(range.startDate);
+    const to = Date.parse(range.endDate);
+    const rows2 = rowsOf(first).filter((row) => {
+      const at = Date.parse(row.createdAt);
+      return at >= from && at <= to;
+    });
+    if (rows2.length > maxRows) return { status: "too-large", total: rows2.length };
+    onProgress?.(rows2.length, rows2.length);
+    return { status: "ok", rows: rows2, total: rows2.length };
+  }
+  let total = Math.max(0, first.pagination.total);
+  if (total > maxRows) return { status: "too-large", total };
+  const limit = first.pagination.limit > 0 ? first.pagination.limit : batchSize;
+  const requestCap = maxRequests ?? Math.ceil(maxRows / limit) + USAGE_LOGS_EXPORT_EXTRA_REQUESTS;
+  const seen = /* @__PURE__ */ new Set();
+  const rows = [];
+  const add = (batch) => {
+    for (const row of batch) {
+      if (rows.length >= maxRows) return;
+      if (seen.has(row._id)) continue;
+      seen.add(row._id);
+      rows.push(row);
+    }
+  };
+  const hasNextAfter = (pagination, page) => typeof pagination?.hasNextPage === "boolean" ? pagination.hasNextPage : page * limit < total;
+  add(rowsOf(first));
+  onProgress?.(rows.length, total);
+  let hasNext = hasNextAfter(first.pagination, 1);
+  let requests = 1;
+  for (let page = 2; hasNext && rows.length < total; page++) {
+    if (requests >= requestCap) {
+      return { status: "incomplete", fetched: rows.length, total };
+    }
+    if (signal?.aborted) return { status: "cancelled" };
+    const res = await fetchUsageLogs({ ...range, page, limit });
+    requests++;
+    if (signal?.aborted) return { status: "cancelled" };
+    if (res?.pagination && Number.isFinite(res.pagination.total)) {
+      total = Math.max(0, res.pagination.total);
+      if (total > maxRows) return { status: "too-large", total };
+    }
+    const batch = rowsOf(res);
+    if (batch.length === 0) break;
+    add(batch);
+    onProgress?.(rows.length, total);
+    hasNext = hasNextAfter(res?.pagination, page);
+  }
+  return { status: "ok", rows, total };
+}
+function usageLogsCsvRows(logs, userMap, formatDate5) {
+  return [
+    ["Date", "Type", "Credits", "Service", "User ID"],
+    ...logs.map((log) => [
+      formatDate5(log.createdAt),
+      log.type,
+      log.amount.toLocaleString("en-US"),
+      log.service?.serviceGroupName ?? log.meta?.info ?? "",
+      log.triggeredByUserId != null ? userMap[log.triggeredByUserId] ?? log.triggeredByUserId : ""
+    ])
+  ];
+}
+function toCsv(rows) {
+  return rows.map((r) => r.map((cell) => `"${String(cell).replace(/"/g, '""')}"`).join(",")).join("\n");
+}
+
 // src/billing-content.tsx
 var import_jsx_runtime29 = require("react/jsx-runtime");
 var DEFAULT_TOPUP_SERVICE = "catalogix";
@@ -11470,6 +11773,8 @@ function UsageLogsTable({
   logs,
   userMap,
   loading,
+  error = null,
+  onRetry,
   currentWorkspaceId = null,
   usedByNames = {}
 }) {
@@ -11500,6 +11805,50 @@ function UsageLogsTable({
       }
     );
   }
+  if (error) {
+    return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+      "div",
+      {
+        role: "alert",
+        className: "flex flex-col items-center justify-center w-full",
+        style: {
+          backgroundColor: "var(--alias-surface-base)",
+          borderRadius: "var(--radius-3xl)",
+          border: "1px solid var(--alias-border-subtle)",
+          padding: "var(--spacing-6xl)",
+          gap: "var(--spacing-md)"
+        },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+            "span",
+            {
+              style: {
+                fontFamily: "var(--font-family-font-family-body)",
+                fontSize: "var(--font-size-font-size-sm)",
+                fontWeight: 400,
+                lineHeight: "var(--line-height-line-height-sm)",
+                color: "var(--alias-text---icons-muted)",
+                textAlign: "center"
+              },
+              children: [
+                "Couldn't load usage logs. ",
+                error
+              ]
+            }
+          ),
+          onRetry && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+            import_ui17.ScButton,
+            {
+              text: "Try again",
+              variant: "tertiary",
+              size: "sm",
+              onClick: onRetry
+            }
+          )
+        ]
+      }
+    );
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
     "div",
     {
@@ -11675,6 +12024,71 @@ function UsageLogsTable({
     }
   );
 }
+function UsageLogsPager({
+  page,
+  totalPages,
+  total,
+  loading = false,
+  onPageChange
+}) {
+  if (total <= 0) return null;
+  const canPrevious = !loading && page > 1;
+  const canNext = !loading && page < totalPages;
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+    "div",
+    {
+      className: "flex items-center justify-between shrink-0 w-full",
+      style: { gap: "var(--spacing-md)" },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+          "span",
+          {
+            style: {
+              color: "var(--alias-text---icons-muted)",
+              fontFamily: "var(--font-family-font-family-body)",
+              fontSize: "var(--font-size-font-size-sm)",
+              lineHeight: "var(--line-height-line-height-sm)"
+            },
+            children: [
+              "Page ",
+              page.toLocaleString("en-US"),
+              " of",
+              " ",
+              totalPages.toLocaleString("en-US"),
+              " \xB7",
+              " ",
+              total.toLocaleString("en-US"),
+              " ",
+              total === 1 ? "log" : "logs"
+            ]
+          }
+        ),
+        totalPages > 1 && /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex items-center", style: { gap: "var(--spacing-md)" }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+            import_ui17.ScButton,
+            {
+              text: "Previous",
+              variant: "tertiary",
+              size: "sm",
+              state: canPrevious ? "default" : "disabled",
+              onClick: canPrevious ? () => onPageChange(page - 1) : void 0
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+            import_ui17.ScButton,
+            {
+              text: "Next",
+              variant: "tertiary",
+              size: "sm",
+              state: canNext ? "default" : "disabled",
+              onClick: canNext ? () => onPageChange(page + 1) : void 0
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
 function BackToBilling({ onClick }) {
   return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
     "div",
@@ -11716,7 +12130,8 @@ function BillingContent({
   showPerUserLimits: showPerUserLimitsProp,
   onShowPerUserLimitsChange,
   showSharedCredits: showSharedCreditsProp,
-  onShowSharedCreditsChange
+  onShowSharedCreditsChange,
+  onEntitlementChange
 } = {}) {
   const { auth, workspace, organization, api, toast, navigation } = useSettingsAdapters();
   const user = auth.user;
@@ -11753,15 +12168,38 @@ function BillingContent({
     else setShowSharedCreditsInternal(next);
   };
   const [showExportModal, setShowExportModal] = (0, import_react23.useState)(false);
+  const [exportProgress, setExportProgress] = (0, import_react23.useState)(null);
+  const [exportNotice, setExportNotice] = (0, import_react23.useState)(null);
+  const exportAbortRef = (0, import_react23.useRef)(null);
   const [showBuyCreditsModal, setShowBuyCreditsModal] = (0, import_react23.useState)(false);
   const [subscription, setSubscription] = (0, import_react23.useState)(null);
+  const [entitlement, setEntitlement] = (0, import_react23.useState)(
+    null
+  );
   const [availableCredits, setAvailableCredits] = (0, import_react23.useState)(null);
   const [sharedPool, setSharedPool] = (0, import_react23.useState)(null);
   const [usedByNames, setUsedByNames] = (0, import_react23.useState)({});
   const [products, setProducts] = (0, import_react23.useState)([]);
   const [invoices, setInvoices] = (0, import_react23.useState)([]);
   const [totalCredits, setTotalCredits] = (0, import_react23.useState)(null);
-  const [usageLogs, setUsageLogs] = (0, import_react23.useState)([]);
+  const [usageLogsState, dispatchUsageLogs] = (0, import_react23.useReducer)(
+    usageLogsReducer,
+    INITIAL_USAGE_LOGS_STATE
+  );
+  const {
+    logs: usageLogs,
+    loading: loadingUsageLogs,
+    error: usageLogsError
+  } = usageLogsState;
+  const usageLogsRequestRef = (0, import_react23.useRef)(0);
+  const workspaceIdRef = (0, import_react23.useRef)(workspaceId);
+  workspaceIdRef.current = workspaceId;
+  const loadUsedByNamesRef = (0, import_react23.useRef)(null);
+  loadUsedByNamesRef.current ??= createUsedByNamesLoader((forWorkspace, names) => {
+    if (forWorkspace !== workspaceIdRef.current) return false;
+    setUsedByNames(names);
+    return true;
+  });
   const [userMap, setUserMap] = (0, import_react23.useState)({});
   const [customPlanCredits, setCustomPlanCredits] = (0, import_react23.useState)(
     null
@@ -11800,12 +12238,15 @@ function BillingContent({
     try {
       console.log("calling Billing apis");
       const [subRes, creditsRes, productsRes, customRes] = await Promise.all([
-        api.fetchCurrentPlan().catch(() => null),
+        // A sponsored workspace with no subscription of its own gets a 404
+        // that carries its entitlement: loadCurrentPlan answers it, not throws.
+        loadCurrentPlan(api.fetchCurrentPlan).catch(() => null),
         api.fetchAvailableCredits().catch(() => null),
         api.fetchPlans().catch(() => null),
         api.getCustomCreditInfo?.().catch(() => null) ?? Promise.resolve(null)
       ]);
-      if (subRes?.data) setSubscription(subRes.data);
+      if (subRes?.subscription) setSubscription(subRes.subscription);
+      if (subRes) setEntitlement(subRes.entitlement);
       if (creditsRes?.availableCredits != null)
         setAvailableCredits(creditsRes.availableCredits);
       setSharedPool(creditsRes?.sharedPool ?? null);
@@ -11842,8 +12283,68 @@ function BillingContent({
     } catch {
     }
   }, [api]);
+  const ensureUsedByNames = (0, import_react23.useCallback)(
+    (logs) => {
+      const fetchCreditPool = api.fetchCreditPool;
+      if (!fetchCreditPool || !workspaceId || !usageLogsSpentByOthers(logs, workspaceId)) {
+        return;
+      }
+      void loadUsedByNamesRef.current?.load(
+        workspaceId,
+        () => fetchCreditPool.call(api)
+      );
+    },
+    [api, workspaceId]
+  );
+  const loadUsageLogsPage = (0, import_react23.useCallback)(
+    async (page) => {
+      const request = ++usageLogsRequestRef.current;
+      if (!api.fetchUsageLogs) {
+        dispatchUsageLogs({ type: "loaded", logs: EMPTY_USAGE_LOGS_PAGE });
+        return;
+      }
+      dispatchUsageLogs({ type: "request", page });
+      try {
+        const res = await api.fetchUsageLogs({
+          page,
+          limit: USAGE_LOGS_PAGE_SIZE
+        });
+        if (request !== usageLogsRequestRef.current) return;
+        const next = usageLogsPage(res, page);
+        dispatchUsageLogs({ type: "loaded", logs: next });
+        ensureUsedByNames(next);
+      } catch (err) {
+        if (request !== usageLogsRequestRef.current) return;
+        dispatchUsageLogs({
+          type: "failed",
+          error: errorMessage(err, { method: "GET" })
+        });
+      }
+    },
+    [api, ensureUsedByNames]
+  );
+  const goToUsageLogsPage = (0, import_react23.useCallback)(
+    (page) => {
+      if (usageLogs.unpaged && !usageLogsError) {
+        dispatchUsageLogs({ type: "turn", page });
+        ensureUsedByNames(usageLogs);
+        return;
+      }
+      void loadUsageLogsPage(page);
+    },
+    [usageLogs, usageLogsError, loadUsageLogsPage, ensureUsedByNames]
+  );
+  (0, import_react23.useEffect)(() => {
+    if (!loadingUsageLogs && !usageLogsError && usageLogs.unpaged === null && usageLogs.rows.length === 0 && usageLogs.total > 0 && usageLogs.page > usageLogs.totalPages) {
+      void loadUsageLogsPage(usageLogs.totalPages);
+    }
+  }, [usageLogs, loadingUsageLogs, usageLogsError, loadUsageLogsPage]);
   const fetchTableData = (0, import_react23.useCallback)(
     async (tab) => {
+      if (tab === "usage") {
+        await loadUsageLogsPage(1);
+        return;
+      }
       setLoadingTable(true);
       try {
         if (tab === "invoice") {
@@ -11855,25 +12356,14 @@ function BillingContent({
               (item) => item.expiresAt && item.expiresAt.split("T")[0] > today
             ).reduce((total, item) => total + item.amount, 0)
           );
-        } else if (api.fetchUsageLogs) {
-          const res = await api.fetchUsageLogs();
-          const logs = res.data?.length ? res.data : [];
-          setUsageLogs(logs);
-          if (api.fetchCreditPool && logs.some((log) => usedByWorkspaceKey(log, workspaceId))) {
-            const pool = await api.fetchCreditPool().catch(() => null);
-            setUsedByNames(usedByNamesFrom(pool));
-          }
-        } else {
-          setUsageLogs([]);
         }
       } catch {
-        if (tab === "invoice") setInvoices([]);
-        else setUsageLogs([]);
+        setInvoices([]);
       } finally {
         setLoadingTable(false);
       }
     },
-    [api, workspaceId]
+    [api, loadUsageLogsPage]
   );
   const handlePlanAction = (0, import_react23.useCallback)(
     async ({ productId, priceId, planName: planName2 }) => {
@@ -11975,10 +12465,15 @@ function BillingContent({
     setInitialFetchTriggered(false);
     setBillingOverviewLoaded(false);
     setSubscription(null);
+    setEntitlement(null);
     setAvailableCredits(null);
     setProducts([]);
     setTotalCredits(null);
     setCustomPlanCredits(null);
+    usageLogsRequestRef.current++;
+    dispatchUsageLogs({ type: "reset" });
+    loadUsedByNamesRef.current?.reset();
+    setUsedByNames({});
   }, [workspaceId]);
   (0, import_react23.useEffect)(() => {
     setInitialFetchTriggered(true);
@@ -12030,7 +12525,16 @@ function BillingContent({
     subscription?.scheduledDowngradeEffectiveDate
   );
   const scheduledDowngradeText = subscription?.downgradeScheduled && subscription.plan?.name ? `Downgrades to ${subscription.plan.name}${scheduledDowngradeDateLabel ? ` ${scheduledDowngradeDateLabel}` : ""}` : void 0;
-  const isPlanDetailsLoading = !billingOverviewLoaded || loadingBilling || subscription?.plan == null || !planName || planName === "-" || !planAmount || currentPlanCredits == null;
+  const sponsored = isSponsoredEntitlement(entitlement);
+  const sponsoredWithoutPlan = sponsored && billingOverviewLoaded && !loadingBilling && subscription == null;
+  const isPlanDetailsLoading = sponsoredWithoutPlan ? false : !billingOverviewLoaded || loadingBilling || subscription?.plan == null || !planName || planName === "-" || !planAmount || currentPlanCredits == null;
+  const paidFeatures = hasPaidFeatures({ entitlement, subscription });
+  const onEntitlementChangeRef = (0, import_react23.useRef)(onEntitlementChange);
+  onEntitlementChangeRef.current = onEntitlementChange;
+  (0, import_react23.useEffect)(() => {
+    if (!billingOverviewLoaded) return;
+    onEntitlementChangeRef.current?.({ entitlement, paid: paidFeatures });
+  }, [billingOverviewLoaded, entitlement, paidFeatures]);
   const {
     used: usedCredits,
     remaining: remainingCredits,
@@ -12072,35 +12576,74 @@ function BillingContent({
         toast.success(`Opened ${successCount} invoice PDF(s).`);
       }
     } else {
-      const filtered = usageLogs.filter((log) => {
-        const d = new Date(log.createdAt);
-        return d >= startDate && d <= end;
+      await exportUsageLogs(startDate, endDate);
+    }
+  };
+  const closeExportModal = () => {
+    exportAbortRef.current?.abort();
+    exportAbortRef.current = null;
+    setExportProgress(null);
+    setExportNotice(null);
+    setShowExportModal(false);
+  };
+  (0, import_react23.useEffect)(() => () => exportAbortRef.current?.abort(), []);
+  const exportUsageLogs = async (startDate, endDate) => {
+    if (!api.fetchUsageLogs) {
+      toast.info?.("Usage logs are not available in this workspace.");
+      closeExportModal();
+      return;
+    }
+    exportAbortRef.current?.abort();
+    const controller = new AbortController();
+    exportAbortRef.current = controller;
+    setExportNotice(null);
+    setExportProgress({ fetched: 0, total: 0 });
+    const range = usageLogsDateRange(startDate, endDate);
+    try {
+      const result = await fetchUsageLogsInRange(api.fetchUsageLogs, range, {
+        signal: controller.signal,
+        onProgress: (fetched, total) => {
+          if (!controller.signal.aborted) setExportProgress({ fetched, total });
+        }
       });
-      if (filtered.length === 0) {
+      if (result.status === "cancelled" || controller.signal.aborted) return;
+      if (result.status === "too-large") {
+        setExportNotice(
+          `${result.total.toLocaleString("en-US")} logs in this range; an export holds up to ${USAGE_LOGS_EXPORT_MAX_ROWS.toLocaleString("en-US")}. Choose a shorter range.`
+        );
+        return;
+      }
+      if (result.status === "incomplete") {
+        setExportNotice(
+          "Usage logs kept changing while exporting, so some were missed. Try again."
+        );
+        return;
+      }
+      if (result.rows.length === 0) {
         toast.info?.("No usage logs found in the selected date range.");
-        setShowExportModal(false);
+        closeExportModal();
         return;
       }
-      const headers = ["Date", "Type", "Credits", "Service", "User ID"];
-      const rows = filtered.map((log) => [
-        formatDate3(log.createdAt),
-        log.type,
-        log.amount.toLocaleString("en-US"),
-        log.service?.serviceGroupName ?? log.meta?.info ?? "",
-        log.triggeredByUserId != null ? userMap[log.triggeredByUserId] ?? log.triggeredByUserId : ""
-      ]);
       downloadCsv(
-        [headers, ...rows],
-        `usage_logs_${fmtFilename(startDate)}_${fmtFilename(end)}.csv`
+        usageLogsCsvRows(result.rows, userMap, formatDate3),
+        usageLogsExportFileName(startDate, endDate)
       );
-      toast.success(`Exported ${filtered.length} log(s).`);
-      setShowExportModal(false);
+      toast.success(`Exported ${result.rows.length.toLocaleString("en-US")} log(s).`);
+      closeExportModal();
+    } catch (err) {
+      if (controller.signal.aborted) return;
+      setExportNotice(
+        `Couldn't export usage logs. ${errorMessage(err, { method: "GET" })}`
+      );
+    } finally {
+      if (exportAbortRef.current === controller) {
+        exportAbortRef.current = null;
+        setExportProgress(null);
+      }
     }
   };
   function downloadCsv(rows, filename) {
-    const csv = rows.map(
-      (r) => r.map((cell) => `"${String(cell).replace(/"/g, '""')}"`).join(",")
-    ).join("\n");
+    const csv = toCsv(rows);
     const blob = new Blob([csv], { type: "text/csv;charset=utf-8;" });
     const url = URL.createObjectURL(blob);
     const a = document.createElement("a");
@@ -12111,9 +12654,6 @@ function BillingContent({
     document.body.removeChild(a);
     URL.revokeObjectURL(url);
   }
-  function fmtFilename(d) {
-    return d.toISOString().slice(0, 10);
-  }
   async function handleBuyCredits(credits2, price) {
     if (!workspaceId) {
       toast.error("Missing workspace details for credit top-up");
@@ -12267,9 +12807,9 @@ function BillingContent({
           /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
             import_ui17.ScPlanDetailsCard,
             {
-              planName,
-              planCredits: planCreditsText,
-              planPrice: planAmount,
+              planName: sponsoredWithoutPlan ? "Free" : planName,
+              planCredits: sponsoredWithoutPlan ? "Shared credits" : planCreditsText,
+              planPrice: sponsoredWithoutPlan ? `${workspace.current?.country?.trim().toUpperCase() === "IN" ? "\u20B9" : "$"}0.00 / month` : planAmount,
               badgeText: "Active",
               badgeSubText: scheduledDowngradeText,
               currentPlanLabel: "Current plan",
@@ -12358,6 +12898,50 @@ function BillingContent({
           )
         ]
       }
+    ) : sponsored && entitlement ? (
+      // Billing says a pool entitles it, but the balance carried no
+      // allowance (an older credits answer, or it failed): say whose.
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+        "div",
+        {
+          role: "status",
+          className: "flex flex-col shrink-0 w-full",
+          style: {
+            gap: 4,
+            padding: 16,
+            backgroundColor: "var(--alias-surface-base)",
+            border: "1px solid var(--alias-border-subtle)",
+            borderRadius: "var(--radius-3xl)"
+          },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+              "span",
+              {
+                style: {
+                  fontFamily: "var(--font-family-font-family-body)",
+                  fontSize: "var(--font-size-font-size-sm)",
+                  fontWeight: 500,
+                  lineHeight: "var(--line-height-line-height-sm)",
+                  color: "var(--alias-text---icons-primary)"
+                },
+                children: sponsoredCreditsText(entitlement)
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+              "span",
+              {
+                style: {
+                  fontFamily: "var(--font-family-font-family-body)",
+                  fontSize: "var(--font-size-font-size-sm)",
+                  lineHeight: "var(--line-height-line-height-sm)",
+                  color: "var(--alias-text---icons-muted)"
+                },
+                children: ownCreditsFirstText()
+              }
+            )
+          ]
+        }
+      )
     ) : null,
     usage ? /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
       "div",
@@ -12522,22 +13106,39 @@ function BillingContent({
         loading: loadingTable,
         workspaceCountry: workspace.current?.country
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-      UsageLogsTable,
-      {
-        logs: usageLogs,
-        userMap,
-        loading: loadingTable,
-        currentWorkspaceId: workspaceId,
-        usedByNames
-      }
-    ),
+    ) : /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_jsx_runtime29.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        UsageLogsTable,
+        {
+          logs: usageLogs.rows,
+          userMap,
+          loading: loadingUsageLogs,
+          error: usageLogsError,
+          onRetry: () => void loadUsageLogsPage(usageLogsState.requestedPage),
+          currentWorkspaceId: workspaceId,
+          usedByNames
+        }
+      ),
+      !usageLogsError && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        UsageLogsPager,
+        {
+          page: usageLogs.page,
+          totalPages: usageLogs.totalPages,
+          total: usageLogs.total,
+          loading: loadingUsageLogs,
+          onPageChange: goToUsageLogsPage
+        }
+      )
+    ] }),
     showExportModal && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
       ExportDateModal,
       {
         title: activeTab === "invoice" ? "Export invoices" : "Export log",
-        onClose: () => setShowExportModal(false),
-        onExport: handleExport
+        onClose: closeExportModal,
+        onExport: handleExport,
+        busy: exportProgress !== null,
+        busyText: exportProgress && exportProgress.total > 0 ? `Fetched ${exportProgress.fetched.toLocaleString("en-US")} of ${exportProgress.total.toLocaleString("en-US")} logs\u2026` : "Fetching logs\u2026",
+        notice: exportNotice
       }
     ),
     showBuyCreditsModal && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
@@ -16732,6 +17333,30 @@ function OrganizationPicker({
   );
 }
 
+// src/use-billing-entitlement.ts
+var import_react30 = require("react");
+function useBillingEntitlement(fetchCurrentPlan, key) {
+  const fetchRef = (0, import_react30.useRef)(fetchCurrentPlan);
+  fetchRef.current = fetchCurrentPlan;
+  const [state, setState] = (0, import_react30.useState)(null);
+  const [loading, setLoading] = (0, import_react30.useState)(false);
+  (0, import_react30.useEffect)(() => {
+    const fetch2 = fetchRef.current;
+    setState(null);
+    if (!key || !fetch2) {
+      setLoading(false);
+      return;
+    }
+    let live = true;
+    setLoading(true);
+    loadCurrentPlan(fetch2).then((next) => live && setState(next)).catch(() => live && setState(null)).finally(() => live && setLoading(false));
+    return () => {
+      live = false;
+    };
+  }, [key]);
+  return { state, loading };
+}
+
 // src/administration-navigation.ts
 var normalizedBase = (base) => base.replace(/\/$/, "");
 var returnKey = (base, entryKey) => `streamoid:settings:return:${base}:${entryKey}`;
@@ -16778,7 +17403,7 @@ function readSettingsCaller(base, state, entryKey, fallback = `${normalizedBase(
 }
 
 // src/app-settings-page.tsx
-var import_react30 = require("react");
+var import_react31 = require("react");
 var import_icons20 = require("@streamoid/icons");
 
 // src/app-settings-page.module.css
@@ -16841,7 +17466,7 @@ function AppSettingsSection({ title, action, children }) {
   ] });
 }
 function AppSettingsRow({ title, description, summary, href, onClick, disabled, disabledReason, ariaLabel, trailing }) {
-  const reasonId = (0, import_react30.useId)();
+  const reasonId = (0, import_react31.useId)();
   const content = /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("span", { className: app_settings_page_default.rowCopy, children: [
       /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: app_settings_page_default.rowTitle, children: title }),