diff --git a/apps/gittensory-ui/src/components/site/state-views.test.tsx b/apps/gittensory-ui/src/components/site/state-views.test.tsx
new file mode 100644
index 0000000000..5a64223d78
--- /dev/null
+++ b/apps/gittensory-ui/src/components/site/state-views.test.tsx
@@ -0,0 +1,140 @@
+import { fireEvent, render, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+
+const { notifyApiFailure } = vi.hoisted(() => ({ notifyApiFailure: vi.fn() }));
+vi.mock("@/lib/api/request", () => ({
+ notifyApiFailure: (...args: unknown[]) => notifyApiFailure(...args),
+}));
+vi.mock("sonner", () => ({ toast: Object.assign(vi.fn(), { success: vi.fn(), error: vi.fn() }) }));
+
+import { ErrorState, StateBoundary } from "@/components/site/state-views";
+
+describe("ErrorState network-vs-API distinction (#793)", () => {
+ it("uses the generic 'couldn't load' copy when no errorKind is given (unchanged default)", () => {
+ render();
+ expect(screen.getByText("Couldn't load this")).toBeTruthy();
+ });
+
+ it("uses connectivity-specific copy for a network errorKind", () => {
+ render();
+ expect(screen.getByText("Can't reach the server")).toBeTruthy();
+ });
+
+ it("uses connectivity-specific copy for a timeout errorKind too", () => {
+ render();
+ expect(screen.getByText("Can't reach the server")).toBeTruthy();
+ });
+
+ it("falls back to the generic copy for an http errorKind", () => {
+ render();
+ expect(screen.getByText("Couldn't load this")).toBeTruthy();
+ });
+
+ it("lets an explicit title/description override the errorKind-derived copy", () => {
+ render(
+ ,
+ );
+ expect(screen.getByText("Custom title")).toBeTruthy();
+ expect(screen.getByText("Custom description")).toBeTruthy();
+ expect(screen.queryByText("Can't reach the server")).toBeNull();
+ });
+});
+
+describe("StateBoundary loadingSkeleton (#793)", () => {
+ it("renders the default spinner LoadingState when no skeleton is given", () => {
+ render(
+
+
content
+ ,
+ );
+ expect(screen.getByRole("status")).toBeTruthy();
+ expect(screen.queryByText("content")).toBeNull();
+ });
+
+ it("renders the provided skeleton instead of the spinner when loading", () => {
+ render(
+ placeholder}>
+
content
+ ,
+ );
+ expect(screen.getByTestId("skeleton")).toBeTruthy();
+ expect(screen.queryByRole("status")).toBeNull();
+ expect(screen.queryByText("content")).toBeNull();
+ });
+});
+
+describe("StateBoundary errorKind passthrough (#793)", () => {
+ it("keeps the pre-#793 default error copy when no errorKind is given", () => {
+ render(
+
+
content
+ ,
+ );
+ expect(screen.getByText("Couldn't load data")).toBeTruthy();
+ });
+
+ it("falls through to ErrorState's network-aware copy when errorKind is network and no override is given", () => {
+ render(
+
+
content
+ ,
+ );
+ expect(screen.getByText("Can't reach the server")).toBeTruthy();
+ expect(screen.queryByText("Couldn't load data")).toBeNull();
+ });
+
+ it("lets an explicit errorTitle/errorDescription win even with a network errorKind", () => {
+ render(
+
+
content
+ ,
+ );
+ expect(screen.getByText("Custom title")).toBeTruthy();
+ expect(screen.getByText("Custom description")).toBeTruthy();
+ });
+
+ it("passes the real errorKind (not a hardcoded 'network') to the error-failure notifier", () => {
+ render(
+
+
content
+ ,
+ );
+ expect(notifyApiFailure).toHaveBeenCalledWith(expect.objectContaining({ kind: "http" }));
+ });
+
+ it("defaults the notifier kind to 'network' when no errorKind is given, matching pre-#793 behavior", () => {
+ render(
+
+