@checkstack/incident-frontend 0.8.3 → 0.8.5

package/CHANGELOG.md

@@ -1,5 +1,70 @@
 # @checkstack/incident-frontend
 
+## 0.8.5
+
+### Patch Changes
+
+- f23f3c9: Gate decorative motion and blur effects behind
+  `usePerformance().isLowPower` on a focused set of high-traffic plugin
+  pages (Dashboard, Dependency map, System node, Notification bell,
+  Announcement banner / cards, Anomaly field overrides editor, SLO
+  attribution chart, Catalog droppable group). Hover scales, backdrop
+  blurs, `animate-pulse`/`animate-ping` accents, and entry transitions
+  now drop to static states on low-power devices; functional UX
+  transitions (Drawer/Dialog open-close, colour transitions) are left
+  alone.
+
+  Standardise the post-mutation error-toast voice on plugin pages by
+  migrating multi-clause `toast.error(extractErrorMessage(error, "Failed
+to X"))` call sites onto the `toastError(toast, "Failed to X", error)`
+  helper from `@checkstack/ui`. The helper applies the canonical
+  `"action: message"` prefix and 100-character truncation in one place,
+  and the now-orphaned `extractErrorMessage` imports are dropped from
+  the affected files. No business logic or component APIs changed.
+
+- f23f3c9: Standardise the empty / loading / error story on key list pages using
+  the shared `ListEmptyState`, `QueryErrorState`, and `Skeleton`
+  primitives from `@checkstack/ui`. Each affected page now branches
+  through the same `isLoading -> isError -> empty -> data` ladder, so
+  failed queries surface a retry-able inline error instead of silently
+  rendering an empty table, and loading states match the final layout
+  rather than flashing a generic spinner. No layout, business logic, or
+  query input shapes changed.
+- Updated dependencies [f23f3c9]
+- Updated dependencies [f23f3c9]
+- Updated dependencies [f23f3c9]
+- Updated dependencies [f23f3c9]
+- Updated dependencies [f23f3c9]
+- Updated dependencies [f23f3c9]
+- Updated dependencies [f23f3c9]
+- Updated dependencies [f23f3c9]
+  - @checkstack/common@0.11.0
+  - @checkstack/auth-frontend@0.6.5
+  - @checkstack/notification-common@1.2.0
+  - @checkstack/notification-frontend@0.4.5
+  - @checkstack/frontend-api@0.5.2
+  - @checkstack/dashboard-frontend@0.7.5
+  - @checkstack/ui@1.10.0
+  - @checkstack/catalog-common@2.2.2
+  - @checkstack/incident-common@1.2.2
+  - @checkstack/tips-frontend@0.2.5
+  - @checkstack/signal-frontend@0.1.4
+
+## 0.8.4
+
+### Patch Changes
+
+- Updated dependencies [a06b899]
+- Updated dependencies [a06b899]
+  - @checkstack/notification-common@1.1.1
+  - @checkstack/ui@1.9.0
+  - @checkstack/catalog-common@2.2.1
+  - @checkstack/dashboard-frontend@0.7.4
+  - @checkstack/incident-common@1.2.1
+  - @checkstack/notification-frontend@0.4.4
+  - @checkstack/auth-frontend@0.6.4
+  - @checkstack/tips-frontend@0.2.4
+
 ## 0.8.3
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@checkstack/incident-frontend",
-  "version": "0.8.3",
+  "version": "0.8.5",
   "license": "Elastic-2.0",
   "type": "module",
   "main": "src/index.tsx",
@@ -13,17 +13,17 @@
     "lint:code": "eslint . --max-warnings 0"
   },
   "dependencies": {
-    "@checkstack/auth-frontend": "0.6.2",
-    "@checkstack/catalog-common": "2.2.0",
+    "@checkstack/auth-frontend": "0.6.4",
+    "@checkstack/catalog-common": "2.2.1",
     "@checkstack/common": "0.10.0",
-    "@checkstack/dashboard-frontend": "0.7.2",
+    "@checkstack/dashboard-frontend": "0.7.4",
     "@checkstack/frontend-api": "0.5.1",
-    "@checkstack/incident-common": "1.2.0",
-    "@checkstack/notification-common": "1.1.0",
-    "@checkstack/notification-frontend": "0.4.2",
+    "@checkstack/incident-common": "1.2.1",
+    "@checkstack/notification-common": "1.1.1",
+    "@checkstack/notification-frontend": "0.4.4",
     "@checkstack/signal-frontend": "0.1.3",
-    "@checkstack/tips-frontend": "0.2.2",
-    "@checkstack/ui": "1.8.2",
+    "@checkstack/tips-frontend": "0.2.4",
+    "@checkstack/ui": "1.9.0",
     "date-fns": "^4.1.0",
     "lucide-react": "^0.344.0",
     "react": "^18.2.0",

package/src/components/IncidentEditor.tsx

@@ -27,12 +27,12 @@ import {
   SelectItem,
   StatusUpdateTimeline,
   LinksEditor,
+  toastError,
 } from "@checkstack/ui";
 import { Plus, MessageSquare, Loader2, AlertCircle } from "lucide-react";
 import { IncidentUpdateForm } from "./IncidentUpdateForm";
 import { getIncidentStatusBadge } from "../utils/badges";
 import { TeamAccessEditor } from "@checkstack/auth-frontend";
-import { extractErrorMessage } from "@checkstack/common";
 
 interface Props {
   open: boolean;
@@ -73,7 +73,7 @@ export const IncidentEditor: React.FC<Props> = ({
       onSave();
     },
     onError: (error) => {
-      toast.error(extractErrorMessage(error, "Failed to save"));
+      toastError(toast, "Failed to create incident", error);
     },
   });
 
@@ -83,7 +83,7 @@ export const IncidentEditor: React.FC<Props> = ({
       onSave();
     },
     onError: (error) => {
-      toast.error(extractErrorMessage(error, "Failed to save"));
+      toastError(toast, "Failed to update incident", error);
     },
   });
 
@@ -92,7 +92,7 @@ export const IncidentEditor: React.FC<Props> = ({
       void refetchDetail();
     },
     onError: (error) => {
-      toast.error(extractErrorMessage(error, "Failed to add link"));
+      toastError(toast, "Failed to add link", error);
     },
   });
 
@@ -101,7 +101,7 @@ export const IncidentEditor: React.FC<Props> = ({
       void refetchDetail();
     },
     onError: (error) => {
-      toast.error(extractErrorMessage(error, "Failed to remove link"));
+      toastError(toast, "Failed to remove link", error);
     },
   });
 

package/src/pages/IncidentConfigPage.tsx

@@ -27,6 +27,7 @@ import {
   Badge,
   LoadingSpinner,
   EmptyState,
+  QueryErrorState,
   Table,
   TableHeader,
   TableRow,
@@ -83,15 +84,16 @@ const IncidentConfigPageContent: React.FC = () => {
   const [resolveId, setResolveId] = useState<string | undefined>();
 
   // Fetch incidents with useQuery
-  const {
-    data: incidentsData,
-    isLoading: incidentsLoading,
-    refetch: refetchIncidents,
-  } = incidentClient.listIncidents.useQuery(
+  const incidentsQuery = incidentClient.listIncidents.useQuery(
     statusFilter === "all"
       ? { includeResolved: showResolved }
       : { status: statusFilter, includeResolved: showResolved },
   );
+  const {
+    data: incidentsData,
+    isLoading: incidentsLoading,
+    refetch: refetchIncidents,
+  } = incidentsQuery;
 
   // Fetch systems with useQuery
   const { data: systemsData, isLoading: systemsLoading } =
@@ -273,6 +275,14 @@ const IncidentConfigPageContent: React.FC = () => {
             <div className="p-12 flex justify-center">
               <LoadingSpinner />
             </div>
+          ) : incidentsQuery.isError ? (
+            <div className="p-4">
+              <QueryErrorState
+                error={incidentsQuery.error}
+                onRetry={() => void incidentsQuery.refetch()}
+                resource="incidents"
+              />
+            </div>
           ) : incidents.length === 0 ? (
             <EmptyState
               icon={<AlertTriangle className="size-10" />}