@elevasis/ui 2.74.0 → 2.76.0

package/dist/{chunk-7ARBBELS.js → chunk-BV2RNLPP.js}

@@ -1,4 +1,4 @@
-import { useOptionalElevasisSystems } from './chunk-6JN2TLV2.js';
+import { useOptionalElevasisSystems } from './chunk-K55TU6CC.js';
 import { useRouterContext } from './chunk-Q7DJKLEN.js';
 import { useMemo } from 'react';
 

package/dist/{chunk-FA7LMNQO.js → chunk-CTT4RDXE.js}

@@ -1,148 +1,49 @@
 import { createLiveTempMessageIdentity } from './chunk-QFGNRKIE.js';
-import { sessionsKeys } from './chunk-6JN2TLV2.js';
-import { SessionIdParamSchema, WebSocketSessionTurnSchema, ExecutionIdParamsSchema } from './chunk-2GIJBHZT.js';
+import { sessionsKeys, isExecutionInFlight } from './chunk-K55TU6CC.js';
+import { SessionIdParamSchema, ExecutionIdParamsSchema, WebSocketSessionTurnSchema } from './chunk-2GIJBHZT.js';
 import { useOrganization } from './chunk-DD3CCMCZ.js';
-import { STALE_TIME_MONITORING, STALE_TIME_DEFAULT } from './chunk-R5UGIFYU.js';
-import { WS_MAX_RETRIES_BEFORE_ERROR, WS_RECONNECT_BASE_DELAY, WS_RECONNECT_MAX_DELAY, REFETCH_INTERVAL_RUNNING } from './chunk-Y6I3IC45.js';
+import { STALE_TIME_MONITORING, STALE_TIME_DEFAULT } from './chunk-5ZK7K7YP.js';
+import { REFETCH_INTERVAL_RUNNING, WS_MAX_RETRIES_BEFORE_ERROR, WS_RECONNECT_BASE_DELAY, WS_RECONNECT_MAX_DELAY } from './chunk-Y6I3IC45.js';
 import { useElevasisServices } from './chunk-BI5VDO2K.js';
 import { useAuthContext } from './chunk-BRJ3QZ4E.js';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
+import { useState, useRef, useCallback, useEffect } from 'react';
 import { create } from 'zustand';
 import { persist } from 'zustand/middleware';
-import { useState, useRef, useCallback, useEffect } from 'react';
 
-function useCommandViewStats(timeRange = "30d", options) {
-  const { apiRequest, workOSOrganizationId, isReady } = useElevasisServices();
-  return useQuery({
-    queryKey: ["command-view-stats", workOSOrganizationId, timeRange],
-    queryFn: async () => {
-      return apiRequest(`/command-view/stats?timeRange=${timeRange}`);
-    },
-    enabled: isReady && (options?.enabled ?? true),
-    staleTime: STALE_TIME_MONITORING
-  });
-}
-function useCheckpointTasks({ checkpointId, enabled = true }) {
-  const { apiRequest, workOSOrganizationId, isReady } = useElevasisServices();
+function useSessionExecutions(sessionId) {
+  const { apiRequest, isReady } = useElevasisServices();
+  const { currentSupabaseOrganizationId } = useOrganization();
   return useQuery({
-    queryKey: ["checkpoint-tasks", workOSOrganizationId, checkpointId],
+    queryKey: sessionsKeys.executions(currentSupabaseOrganizationId, sessionId),
     queryFn: async () => {
-      return apiRequest(
-        `/command-queue?humanCheckpoint=${checkpointId}&status=pending&limit=10`
-      );
+      SessionIdParamSchema.parse({ sessionId });
+      return apiRequest(`/sessions/${sessionId}/executions`, {
+        method: "GET"
+      });
     },
-    // Only fetch when: org ready, checkpoint selected, and enabled
-    enabled: isReady && !!checkpointId && enabled,
-    staleTime: STALE_TIME_MONITORING
+    enabled: isReady && !!sessionId,
+    staleTime: 0
   });
 }
-function useResourceExecutions({
-  resourceId,
-  timeRange,
-  page = 1,
-  limit = 10,
-  enabled = true
-}) {
-  const { apiRequest, workOSOrganizationId, isReady } = useElevasisServices();
+function useSessionExecution(sessionId, executionId) {
+  const { apiRequest, isReady } = useElevasisServices();
+  const { currentSupabaseOrganizationId } = useOrganization();
   return useQuery({
-    queryKey: ["resource-executions", workOSOrganizationId, resourceId, timeRange, page, limit],
+    queryKey: sessionsKeys.execution(currentSupabaseOrganizationId, sessionId, executionId),
     queryFn: async () => {
-      return apiRequest(
-        `/command-view/resource-executions?resourceId=${resourceId}&timeRange=${timeRange}&page=${page}&limit=${limit}`
-      );
+      ExecutionIdParamsSchema.parse({ sessionId, executionId });
+      return apiRequest(`/sessions/${sessionId}/executions/${executionId}`, {
+        method: "GET"
+      });
     },
-    // Only fetch when: org ready, resource selected, and enabled
-    enabled: isReady && !!resourceId && enabled,
-    staleTime: STALE_TIME_MONITORING
+    enabled: isReady && !!sessionId && !!executionId,
+    refetchInterval: (query) => {
+      const data = query.state.data;
+      return isExecutionInFlight(data?.status) ? REFETCH_INTERVAL_RUNNING : false;
+    }
   });
 }
-var NEW_SESSION_VISUALIZATION_MODE = "explore";
-var LEGACY_VISUALIZATION_MODES = /* @__PURE__ */ new Set(["overview", "cluster", "swimlane", "focus", "network", "force"]);
-function normalizePersistedVisualizationMode(value) {
-  if (value === "explore") return "explore";
-  if (LEGACY_VISUALIZATION_MODES.has(String(value))) return NEW_SESSION_VISUALIZATION_MODE;
-  return NEW_SESSION_VISUALIZATION_MODE;
-}
-var DEFAULT_DIAGNOSTIC_CATEGORIES = ["diagnostic", "testing"];
-var useCommandViewStore = create()(
-  persist(
-    (set) => ({
-      statusFilter: "all",
-      setStatusFilter: (statusFilter) => set({ statusFilter }),
-      showIntegrations: true,
-      setShowIntegrations: (showIntegrations) => set({ showIntegrations }),
-      fitViewOnFilter: true,
-      setFitViewOnFilter: (fitViewOnFilter) => set({ fitViewOnFilter }),
-      // New sessions default to 'explore'; returning sessions get their stored mode via persist.
-      visualizationMode: NEW_SESSION_VISUALIZATION_MODE,
-      setVisualizationMode: (visualizationMode) => set({ visualizationMode, lastUsedVisualizationMode: visualizationMode }),
-      lastUsedVisualizationMode: null,
-      lastOpenBottomTab: null,
-      setLastOpenBottomTab: (lastOpenBottomTab) => set({ lastOpenBottomTab }),
-      selectedNodeId: null,
-      setSelectedNodeId: (selectedNodeId) => set({ selectedNodeId }),
-      resourcesHidden: true,
-      setResourcesHidden: (resourcesHidden) => set({ resourcesHidden, hasVisibilityInteraction: true }),
-      diagnosticsHidden: true,
-      setDiagnosticsHidden: (diagnosticsHidden) => set({ diagnosticsHidden, hasVisibilityInteraction: true }),
-      diagnosticCategories: DEFAULT_DIAGNOSTIC_CATEGORIES,
-      revealedIds: /* @__PURE__ */ new Set(),
-      setRevealedIds: (ids) => set({ revealedIds: new Set(ids) }),
-      clearRevealedIds: () => set({ revealedIds: /* @__PURE__ */ new Set() }),
-      hasVisibilityInteraction: false,
-      markVisibilityInteraction: () => set({ hasVisibilityInteraction: true }),
-      resetVisibilityInteraction: () => set({ hasVisibilityInteraction: false }),
-      expandedClusterDomains: [],
-      toggleClusterDomain: (domain) => set((s) => ({
-        expandedClusterDomains: s.expandedClusterDomains.includes(domain) ? s.expandedClusterDomains.filter((d) => d !== domain) : [...s.expandedClusterDomains, domain]
-      })),
-      setExpandedClusterDomains: (expandedClusterDomains) => set({ expandedClusterDomains }),
-      expandedNodeIdsArray: [],
-      expandedNodeIds: /* @__PURE__ */ new Set(),
-      toggleNodeExpansion: (nodeId) => set((s) => {
-        const currentSet = s.expandedNodeIds;
-        const isCurrentlyExpanded = currentSet.has(nodeId);
-        if (isCurrentlyExpanded) {
-          const next2 = new Set(currentSet);
-          next2.delete(nodeId);
-          const nextArray2 = [...next2];
-          return { expandedNodeIdsArray: nextArray2, expandedNodeIds: next2 };
-        }
-        const next = new Set(currentSet);
-        next.add(nodeId);
-        const nextArray = [...next];
-        return { expandedNodeIdsArray: nextArray, expandedNodeIds: next };
-      }),
-      clearExpandedNodes: () => set({ expandedNodeIdsArray: [], expandedNodeIds: /* @__PURE__ */ new Set() })
-    }),
-    {
-      name: "command-view-store",
-      partialize: (s) => ({
-        showIntegrations: s.showIntegrations,
-        fitViewOnFilter: s.fitViewOnFilter,
-        visualizationMode: s.visualizationMode,
-        lastUsedVisualizationMode: s.lastUsedVisualizationMode,
-        resourcesHidden: s.resourcesHidden,
-        diagnosticsHidden: s.diagnosticsHidden,
-        lastOpenBottomTab: s.lastOpenBottomTab,
-        expandedClusterDomains: s.expandedClusterDomains
-      }),
-      // Guard against stale localStorage with an invalid mode name (e.g. old 'overview' → 'explore' rename).
-      merge: (persisted, current) => {
-        const stored = persisted;
-        const storedMode = stored.visualizationMode;
-        const storedLastUsed = stored.lastUsedVisualizationMode;
-        const { expandedZonesArray: _dropped, ...restStored } = stored;
-        return {
-          ...current,
-          ...restStored,
-          visualizationMode: normalizePersistedVisualizationMode(storedMode),
-          lastUsedVisualizationMode: storedLastUsed === null || storedLastUsed === void 0 ? current.lastUsedVisualizationMode : normalizePersistedVisualizationMode(storedLastUsed)
-        };
-      }
-    }
-  )
-);
 function useSessionMessages(sessionId) {
   const { apiRequest, isReady } = useElevasisServices();
   const { currentSupabaseOrganizationId } = useOrganization();
@@ -388,38 +289,136 @@ function useSessionWebSocket(sessionId, apiUrl) {
     lastTokenUsage
   };
 }
-function useSessionExecutions(sessionId) {
-  const { apiRequest, isReady } = useElevasisServices();
-  const { currentSupabaseOrganizationId } = useOrganization();
+var NEW_SESSION_VISUALIZATION_MODE = "explore";
+var LEGACY_VISUALIZATION_MODES = /* @__PURE__ */ new Set(["overview", "cluster", "swimlane", "focus", "network", "force"]);
+function normalizePersistedVisualizationMode(value) {
+  if (value === "explore") return "explore";
+  if (LEGACY_VISUALIZATION_MODES.has(String(value))) return NEW_SESSION_VISUALIZATION_MODE;
+  return NEW_SESSION_VISUALIZATION_MODE;
+}
+var DEFAULT_DIAGNOSTIC_CATEGORIES = ["diagnostic", "testing"];
+var useCommandViewStore = create()(
+  persist(
+    (set) => ({
+      statusFilter: "all",
+      setStatusFilter: (statusFilter) => set({ statusFilter }),
+      showIntegrations: true,
+      setShowIntegrations: (showIntegrations) => set({ showIntegrations }),
+      fitViewOnFilter: true,
+      setFitViewOnFilter: (fitViewOnFilter) => set({ fitViewOnFilter }),
+      // New sessions default to 'explore'; returning sessions get their stored mode via persist.
+      visualizationMode: NEW_SESSION_VISUALIZATION_MODE,
+      setVisualizationMode: (visualizationMode) => set({ visualizationMode, lastUsedVisualizationMode: visualizationMode }),
+      lastUsedVisualizationMode: null,
+      lastOpenBottomTab: null,
+      setLastOpenBottomTab: (lastOpenBottomTab) => set({ lastOpenBottomTab }),
+      selectedNodeId: null,
+      setSelectedNodeId: (selectedNodeId) => set({ selectedNodeId }),
+      resourcesHidden: true,
+      setResourcesHidden: (resourcesHidden) => set({ resourcesHidden, hasVisibilityInteraction: true }),
+      diagnosticsHidden: true,
+      setDiagnosticsHidden: (diagnosticsHidden) => set({ diagnosticsHidden, hasVisibilityInteraction: true }),
+      diagnosticCategories: DEFAULT_DIAGNOSTIC_CATEGORIES,
+      revealedIds: /* @__PURE__ */ new Set(),
+      setRevealedIds: (ids) => set({ revealedIds: new Set(ids) }),
+      clearRevealedIds: () => set({ revealedIds: /* @__PURE__ */ new Set() }),
+      hasVisibilityInteraction: false,
+      markVisibilityInteraction: () => set({ hasVisibilityInteraction: true }),
+      resetVisibilityInteraction: () => set({ hasVisibilityInteraction: false }),
+      expandedClusterDomains: [],
+      toggleClusterDomain: (domain) => set((s) => ({
+        expandedClusterDomains: s.expandedClusterDomains.includes(domain) ? s.expandedClusterDomains.filter((d) => d !== domain) : [...s.expandedClusterDomains, domain]
+      })),
+      setExpandedClusterDomains: (expandedClusterDomains) => set({ expandedClusterDomains }),
+      expandedNodeIdsArray: [],
+      expandedNodeIds: /* @__PURE__ */ new Set(),
+      toggleNodeExpansion: (nodeId) => set((s) => {
+        const currentSet = s.expandedNodeIds;
+        const isCurrentlyExpanded = currentSet.has(nodeId);
+        if (isCurrentlyExpanded) {
+          const next2 = new Set(currentSet);
+          next2.delete(nodeId);
+          const nextArray2 = [...next2];
+          return { expandedNodeIdsArray: nextArray2, expandedNodeIds: next2 };
+        }
+        const next = new Set(currentSet);
+        next.add(nodeId);
+        const nextArray = [...next];
+        return { expandedNodeIdsArray: nextArray, expandedNodeIds: next };
+      }),
+      clearExpandedNodes: () => set({ expandedNodeIdsArray: [], expandedNodeIds: /* @__PURE__ */ new Set() })
+    }),
+    {
+      name: "command-view-store",
+      partialize: (s) => ({
+        showIntegrations: s.showIntegrations,
+        fitViewOnFilter: s.fitViewOnFilter,
+        visualizationMode: s.visualizationMode,
+        lastUsedVisualizationMode: s.lastUsedVisualizationMode,
+        resourcesHidden: s.resourcesHidden,
+        diagnosticsHidden: s.diagnosticsHidden,
+        lastOpenBottomTab: s.lastOpenBottomTab,
+        expandedClusterDomains: s.expandedClusterDomains
+      }),
+      // Guard against stale localStorage with an invalid mode name (e.g. old 'overview' → 'explore' rename).
+      merge: (persisted, current) => {
+        const stored = persisted;
+        const storedMode = stored.visualizationMode;
+        const storedLastUsed = stored.lastUsedVisualizationMode;
+        const { expandedZonesArray: _dropped, ...restStored } = stored;
+        return {
+          ...current,
+          ...restStored,
+          visualizationMode: normalizePersistedVisualizationMode(storedMode),
+          lastUsedVisualizationMode: storedLastUsed === null || storedLastUsed === void 0 ? current.lastUsedVisualizationMode : normalizePersistedVisualizationMode(storedLastUsed)
+        };
+      }
+    }
+  )
+);
+function useCommandViewStats(timeRange = "30d", options) {
+  const { apiRequest, workOSOrganizationId, isReady } = useElevasisServices();
   return useQuery({
-    queryKey: sessionsKeys.executions(currentSupabaseOrganizationId, sessionId),
+    queryKey: ["command-view-stats", workOSOrganizationId, timeRange],
     queryFn: async () => {
-      SessionIdParamSchema.parse({ sessionId });
-      return apiRequest(`/sessions/${sessionId}/executions`, {
-        method: "GET"
-      });
+      return apiRequest(`/command-view/stats?timeRange=${timeRange}`);
     },
-    enabled: isReady && !!sessionId,
-    staleTime: 0
+    enabled: isReady && (options?.enabled ?? true),
+    staleTime: STALE_TIME_MONITORING
   });
 }
-function useSessionExecution(sessionId, executionId) {
-  const { apiRequest, isReady } = useElevasisServices();
-  const { currentSupabaseOrganizationId } = useOrganization();
+function useCheckpointTasks({ checkpointId, enabled = true }) {
+  const { apiRequest, workOSOrganizationId, isReady } = useElevasisServices();
   return useQuery({
-    queryKey: sessionsKeys.execution(currentSupabaseOrganizationId, sessionId, executionId),
+    queryKey: ["checkpoint-tasks", workOSOrganizationId, checkpointId],
     queryFn: async () => {
-      ExecutionIdParamsSchema.parse({ sessionId, executionId });
-      return apiRequest(`/sessions/${sessionId}/executions/${executionId}`, {
-        method: "GET"
-      });
+      return apiRequest(
+        `/command-queue?humanCheckpoint=${checkpointId}&status=pending&limit=10`
+      );
     },
-    enabled: isReady && !!sessionId && !!executionId,
-    refetchInterval: (query) => {
-      const data = query.state.data;
-      const shouldRefetch = data?.status === "running";
-      return shouldRefetch ? REFETCH_INTERVAL_RUNNING : false;
-    }
+    // Only fetch when: org ready, checkpoint selected, and enabled
+    enabled: isReady && !!checkpointId && enabled,
+    staleTime: STALE_TIME_MONITORING
+  });
+}
+function useResourceExecutions({
+  resourceId,
+  timeRange,
+  page = 1,
+  limit = 10,
+  enabled = true
+}) {
+  const { apiRequest, workOSOrganizationId, isReady } = useElevasisServices();
+  return useQuery({
+    queryKey: ["resource-executions", workOSOrganizationId, resourceId, timeRange, page, limit],
+    queryFn: async () => {
+      return apiRequest(
+        `/command-view/resource-executions?resourceId=${resourceId}&timeRange=${timeRange}&page=${page}&limit=${limit}`
+      );
+    },
+    // Only fetch when: org ready, resource selected, and enabled
+    enabled: isReady && !!resourceId && enabled,
+    staleTime: STALE_TIME_MONITORING
   });
 }
 

package/dist/chunk-E2LJ3FRA.js

@@ -0,0 +1,237 @@
+import { AppearanceContext } from './chunk-K55TU6CC.js';
+import { ElevasisServiceContext } from './chunk-BI5VDO2K.js';
+import { useContext, useState, useRef, useCallback, useEffect } from 'react';
+import { Paper, Stack, Title, Text, Group, Button, Anchor, Collapse, Badge, Code } from '@mantine/core';
+import { IconAlertTriangle, IconLockOff, IconServerBolt, IconPlugConnectedX, IconWifiOff, IconRefresh, IconChevronDown, IconChevronRight } from '@tabler/icons-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/error/classifyConnectionError.ts
+function isApiErrorLike(error) {
+  return error instanceof Error && "statusCode" in error && typeof error.statusCode === "number";
+}
+function isBrowserOffline() {
+  return typeof navigator !== "undefined" && navigator.onLine === false;
+}
+function describeTechnically(error, fallbackMessage) {
+  if (error instanceof Error) {
+    return error.name && error.name !== "Error" ? `${error.name}: ${error.message}` : error.message;
+  }
+  if (typeof error === "string" && error.length > 0) return error;
+  return fallbackMessage;
+}
+function classifyConnectionError(error, fallbackMessage = "Something went wrong") {
+  const technical = describeTechnically(error, fallbackMessage);
+  if (isBrowserOffline()) {
+    return {
+      kind: "offline",
+      title: "You're offline",
+      description: "This device has no network connection. The app reconnects on its own as soon as the connection is back.",
+      autoRecoverable: true,
+      technical
+    };
+  }
+  if (isApiErrorLike(error)) {
+    const { statusCode, requestId } = error;
+    if (statusCode === 401 || statusCode === 403) {
+      return {
+        kind: "unauthorized",
+        title: "Your session is no longer valid",
+        description: "The server rejected this session. Signing in again should clear it.",
+        autoRecoverable: false,
+        statusCode,
+        requestId,
+        technical
+      };
+    }
+    if (statusCode >= 500) {
+      return {
+        kind: "server",
+        title: "The server had a problem",
+        description: statusCode === 502 || statusCode === 503 || statusCode === 504 ? "The API is restarting or temporarily unavailable. This page keeps retrying and loads as soon as it answers." : "The API returned an error while loading your account. This page keeps retrying while the issue clears.",
+        autoRecoverable: true,
+        statusCode,
+        requestId,
+        technical
+      };
+    }
+    return {
+      kind: "unknown",
+      title: "Your account couldn't be loaded",
+      description: "The server rejected the request that loads your account. Retrying may help.",
+      autoRecoverable: false,
+      statusCode,
+      requestId,
+      technical
+    };
+  }
+  if (error instanceof Error) {
+    const name = error.name;
+    const message = error.message.toLowerCase();
+    if (name === "TimeoutError" || name === "AbortError" || message.includes("timed out") || message.includes("timeout")) {
+      return {
+        kind: "timeout",
+        title: "The server took too long to respond",
+        description: "The request timed out before the API answered. This page keeps retrying.",
+        autoRecoverable: true,
+        technical
+      };
+    }
+    if (name === "TypeError" || message.includes("failed to fetch") || message.includes("networkerror")) {
+      return {
+        kind: "unreachable",
+        title: "Can't reach the server",
+        description: "The API is not responding \u2014 it may be restarting or temporarily down. This page keeps retrying and loads as soon as it comes back.",
+        autoRecoverable: true,
+        technical
+      };
+    }
+  }
+  return {
+    kind: "unknown",
+    title: "Your account couldn't be loaded",
+    description: "Something went wrong while starting the app. Retrying may help.",
+    autoRecoverable: false,
+    technical
+  };
+}
+var RETRY_DELAYS_SECONDS = [5, 10, 20, 30, 60];
+var ICONS = {
+  offline: IconWifiOff,
+  unreachable: IconPlugConnectedX,
+  timeout: IconServerBolt,
+  server: IconServerBolt,
+  unauthorized: IconLockOff,
+  unknown: IconAlertTriangle
+};
+function ServiceUnavailableScreen({ message, error, retry, appVersion }) {
+  const appearance = useContext(AppearanceContext);
+  const serviceContext = useContext(ElevasisServiceContext);
+  const failure = classifyConnectionError(error, message);
+  const Icon = ICONS[failure.kind];
+  const [isRetrying, setIsRetrying] = useState(false);
+  const [secondsRemaining, setSecondsRemaining] = useState(null);
+  const [detailsOpen, setDetailsOpen] = useState(false);
+  const attemptRef = useRef(0);
+  const retryRef = useRef(retry);
+  retryRef.current = retry;
+  const runRetry = useCallback(async () => {
+    if (!retryRef.current) return;
+    setIsRetrying(true);
+    setSecondsRemaining(null);
+    try {
+      await retryRef.current();
+    } catch {
+    } finally {
+      setIsRetrying(false);
+    }
+  }, []);
+  const handleManualRetry = useCallback(() => {
+    attemptRef.current = 0;
+    void runRetry();
+  }, [runRetry]);
+  const canAutoRetry = failure.autoRecoverable && !!retry;
+  useEffect(() => {
+    if (!canAutoRetry || isRetrying || secondsRemaining !== null) return;
+    const delay = RETRY_DELAYS_SECONDS[Math.min(attemptRef.current, RETRY_DELAYS_SECONDS.length - 1)];
+    attemptRef.current += 1;
+    setSecondsRemaining(delay);
+  }, [canAutoRetry, isRetrying, secondsRemaining]);
+  useEffect(() => {
+    if (secondsRemaining === null) return;
+    if (secondsRemaining <= 0) {
+      void runRetry();
+      return;
+    }
+    const timer = setTimeout(() => setSecondsRemaining((current) => current === null ? null : current - 1), 1e3);
+    return () => clearTimeout(timer);
+  }, [secondsRemaining, runRetry]);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const onOnline = () => {
+      attemptRef.current = 0;
+      void runRetry();
+    };
+    window.addEventListener("online", onOnline);
+    return () => window.removeEventListener("online", onOnline);
+  }, [runRetry]);
+  const statusLine = isRetrying ? "Reconnecting\u2026" : secondsRemaining !== null ? `Retrying automatically in ${secondsRemaining}s` : null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        position: "fixed",
+        inset: 0,
+        overflow: "auto",
+        background: "var(--color-background)",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        padding: 24,
+        zIndex: 1e4
+      },
+      children: [
+        appearance?.background,
+        /* @__PURE__ */ jsx(
+          Paper,
+          {
+            withBorder: true,
+            radius: "md",
+            p: "xl",
+            style: { position: "relative", zIndex: 1, width: "100%", maxWidth: 520 },
+            "data-testid": "service-unavailable",
+            children: /* @__PURE__ */ jsxs(Stack, { align: "center", gap: "md", children: [
+              /* @__PURE__ */ jsx(Icon, { size: 48, color: failure.kind === "offline" ? "var(--color-text-dimmed)" : "var(--color-error)" }),
+              /* @__PURE__ */ jsxs(Stack, { align: "center", gap: 6, children: [
+                /* @__PURE__ */ jsx(Title, { order: 3, ta: "center", children: failure.title }),
+                /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", ta: "center", children: failure.description })
+              ] }),
+              /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+                /* @__PURE__ */ jsx(Button, { leftSection: /* @__PURE__ */ jsx(IconRefresh, { size: 16 }), onClick: handleManualRetry, loading: isRetrying, children: "Try again" }),
+                /* @__PURE__ */ jsx(Button, { variant: "default", onClick: () => window.location.reload(), children: "Reload page" })
+              ] }),
+              statusLine && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", "data-testid": "service-unavailable-status", children: statusLine }),
+              /* @__PURE__ */ jsxs(Stack, { gap: 6, w: "100%", children: [
+                /* @__PURE__ */ jsxs(
+                  Anchor,
+                  {
+                    component: "button",
+                    type: "button",
+                    size: "xs",
+                    c: "dimmed",
+                    onClick: () => setDetailsOpen((open) => !open),
+                    style: { alignSelf: "center", display: "flex", alignItems: "center", gap: 4 },
+                    children: [
+                      detailsOpen ? /* @__PURE__ */ jsx(IconChevronDown, { size: 12 }) : /* @__PURE__ */ jsx(IconChevronRight, { size: 12 }),
+                      "Technical details"
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx(Collapse, { in: detailsOpen, children: /* @__PURE__ */ jsxs(Stack, { gap: 6, children: [
+                  /* @__PURE__ */ jsxs(Group, { gap: 6, justify: "center", children: [
+                    /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "default", children: failure.kind }),
+                    failure.statusCode !== void 0 && /* @__PURE__ */ jsxs(Badge, { size: "xs", variant: "default", children: [
+                      "HTTP ",
+                      failure.statusCode
+                    ] }),
+                    appVersion && /* @__PURE__ */ jsxs(Badge, { size: "xs", variant: "default", children: [
+                      "v",
+                      appVersion
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsx(Code, { block: true, style: { fontSize: 11, whiteSpace: "pre-wrap", wordBreak: "break-word" }, children: [
+                    failure.technical,
+                    serviceContext?.apiUrl ? `api: ${serviceContext.apiUrl}` : null,
+                    failure.requestId ? `request id: ${failure.requestId}` : null,
+                    `layer message: ${message}`
+                  ].filter(Boolean).join("\n") })
+                ] }) })
+              ] })
+            ] })
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { ServiceUnavailableScreen, classifyConnectionError };

package/dist/{chunk-E6YGA5WH.js → chunk-EFQLXRYT.js}

@@ -1,5 +1,4 @@
-import { useAppearance } from './chunk-6JN2TLV2.js';
-import { topbarHeight } from './chunk-MISHPEJX.js';
+import { topbarHeight, useAppearance } from './chunk-K55TU6CC.js';
 import { Stack, Title, Button } from '@mantine/core';
 import { IconAlertCircle } from '@tabler/icons-react';
 import { jsx, jsxs } from 'react/jsx-runtime';

package/dist/{chunk-FZSG6M6W.js → chunk-EVNLJHDD.js}

@@ -1,6 +1,6 @@
-import { dealKeys } from './chunk-6JN2TLV2.js';
-import { showApiErrorNotification } from './chunk-HYQOGRWG.js';
-import { APIClientError } from './chunk-R5UGIFYU.js';
+import { dealKeys } from './chunk-K55TU6CC.js';
+import { showApiErrorNotification } from './chunk-KXNRTJAE.js';
+import { APIClientError } from './chunk-5ZK7K7YP.js';
 import { useElevasisServices } from './chunk-BI5VDO2K.js';
 import { useQuery, useQueryClient, useMutation } from '@tanstack/react-query';
 

package/dist/{chunk-ZYNVCWDZ.js → chunk-GDQQX5SL.js}

@@ -1,10 +1,9 @@
-import { acquisitionListKeys } from './chunk-6JN2TLV2.js';
-import { showApiErrorNotification, showSuccessNotification } from './chunk-HYQOGRWG.js';
-import { APIClientError } from './chunk-R5UGIFYU.js';
+import { acquisitionListKeys } from './chunk-K55TU6CC.js';
+import { showApiErrorNotification, showSuccessNotification } from './chunk-KXNRTJAE.js';
+import { APIClientError } from './chunk-5ZK7K7YP.js';
 import { useElevasisServices } from './chunk-BI5VDO2K.js';
 import { useQuery, useQueryClient, useMutation } from '@tanstack/react-query';
 import { z } from 'zod';
-import { useState, useCallback, useMemo } from 'react';
 
 z.object({
   replyBody: z.string().trim().min(1).max(1e4)
@@ -12,43 +11,6 @@ z.object({
 function deriveActions(deal, actions = []) {
   return actions.filter((a) => a.isAvailableFor(deal)).map(({ key, label, payloadSchema }) => ({ key, label, payloadSchema }));
 }
-function useTableSort(defaultColumn, defaultDirection = "desc") {
-  const [sort, setSort] = useState({ column: defaultColumn, direction: defaultDirection });
-  const toggleSort = useCallback((column) => {
-    setSort((prev) => {
-      if (prev.column === column) {
-        return { column, direction: prev.direction === "asc" ? "desc" : "asc" };
-      }
-      return { column, direction: "desc" };
-    });
-  }, []);
-  return { sort, toggleSort };
-}
-function sortData(data, sort, accessors) {
-  const accessor = accessors[sort.column];
-  if (!accessor) return data;
-  return [...data].sort((a, b) => {
-    const aVal = accessor(a);
-    const bVal = accessor(b);
-    if (aVal == null && bVal == null) return 0;
-    if (aVal == null) return 1;
-    if (bVal == null) return -1;
-    let comparison = 0;
-    if (typeof aVal === "string" && typeof bVal === "string") {
-      comparison = aVal.localeCompare(bVal);
-    } else if (typeof aVal === "number" && typeof bVal === "number") {
-      comparison = aVal - bVal;
-    } else {
-      comparison = String(aVal).localeCompare(String(bVal));
-    }
-    return sort.direction === "asc" ? comparison : -comparison;
-  });
-}
-function useSortedData(data, defaultColumn, accessors, defaultDirection = "desc") {
-  const { sort, toggleSort } = useTableSort(defaultColumn, defaultDirection);
-  const sorted = useMemo(() => sortData(data, sort, accessors), [data, sort, accessors]);
-  return { sorted, sort, toggleSort };
-}
 var contactKeys = {
   all: ["acquisition-contacts"],
   list: (organizationId, filters) => [...contactKeys.all, "list", organizationId, filters],
@@ -283,4 +245,4 @@ function useDeleteCompanies() {
   });
 }
 
-export { companyKeys, contactKeys, deriveActions, sortData, useCompanies, useCompany, useCompanyFacets, useContact, useContacts, useCreateCompany, useCreateContact, useDeleteCompanies, useDeleteContacts, useSortedData, useTableSort, useUpdateCompany, useUpdateContact };
+export { companyKeys, contactKeys, deriveActions, useCompanies, useCompany, useCompanyFacets, useContact, useContacts, useCreateCompany, useCreateContact, useDeleteCompanies, useDeleteContacts, useUpdateCompany, useUpdateContact };