@carlonicora/nextjs-jsonapi 5.4.0 → 5.6.0

package/src/features/tokenusage/tokenusage-admin.module.ts

@@ -1,3 +1,4 @@
+import { CoinsIcon } from "lucide-react";
 import { ModuleFactory } from "../../permissions";
 import { TokenUsageAdminBreakdown } from "./data/tokenusage-admin-breakdown";
 import { TokenUsageAdminSummary } from "./data/tokenusage-admin-summary";
@@ -17,10 +18,10 @@ import { TokenUsageAdminTimeline } from "./data/tokenusage-admin-timeline";
  * object. These individual factories are kept for backward compatibility.
  */
 export const TokenUsageAdminSummaryModule = (factory: ModuleFactory) =>
-  factory({ name: "tokenusages/administration/summary", model: TokenUsageAdminSummary });
+  factory({ name: "tokenusages/administration/summary", model: TokenUsageAdminSummary, icon: CoinsIcon });
 
 export const TokenUsageAdminTimelineModule = (factory: ModuleFactory) =>
-  factory({ name: "tokenusages/administration/timeline", model: TokenUsageAdminTimeline });
+  factory({ name: "tokenusages/administration/timeline", model: TokenUsageAdminTimeline, icon: CoinsIcon });
 
 export const TokenUsageAdminBreakdownModule = (factory: ModuleFactory) =>
-  factory({ name: "tokenusages/administration/breakdown", model: TokenUsageAdminBreakdown });
+  factory({ name: "tokenusages/administration/breakdown", model: TokenUsageAdminBreakdown, icon: CoinsIcon });

package/src/features/tokenusage/tokenusage.modules.ts

@@ -1,3 +1,4 @@
+import { CoinsIcon } from "lucide-react";
 import { ModuleFactory, ModuleWithPermissions } from "../../permissions";
 import { TokenUsageAdminBreakdown } from "./data/tokenusage-admin-breakdown";
 import { TokenUsageAdminSummary } from "./data/tokenusage-admin-summary";
@@ -28,11 +29,20 @@ import { TokenUsageReportTimeline } from "./data/tokenusage-report-timeline";
  */
 export const tokenUsageModules = (factory: ModuleFactory) =>
   ({
-    TokenUsageAdminSummary: factory({ name: "tokenusages/administration/summary", model: TokenUsageAdminSummary }),
-    TokenUsageAdminTimeline: factory({ name: "tokenusages/administration/timeline", model: TokenUsageAdminTimeline }),
+    TokenUsageAdminSummary: factory({
+      name: "tokenusages/administration/summary",
+      model: TokenUsageAdminSummary,
+      icon: CoinsIcon,
+    }),
+    TokenUsageAdminTimeline: factory({
+      name: "tokenusages/administration/timeline",
+      model: TokenUsageAdminTimeline,
+      icon: CoinsIcon,
+    }),
     TokenUsageAdminBreakdown: factory({
       name: "tokenusages/administration/breakdown",
       model: TokenUsageAdminBreakdown,
+      icon: CoinsIcon,
     }),
     TokenUsageReportSummary: factory({ name: "tokenusages/reports/summary", model: TokenUsageReportSummary }),
     TokenUsageReportTimeline: factory({ name: "tokenusages/reports/timeline", model: TokenUsageReportTimeline }),

package/src/features/user/contexts/CurrentUserContext.tsx

@@ -225,6 +225,31 @@ export const CurrentUserProvider = ({ children }: { children: React.ReactNode })
   // Track refresh in progress to prevent duplicate API calls
   const isRefreshingRef = useRef(false);
 
+  // Revalidate the cached user each time the live connection comes up.
+  //
+  // The cache above is trusted on mount, and changes reach an open page through
+  // `company:subscription_updated`. A change made while no page was connected
+  // (the browser closed when a Stripe webhook ended the subscription) never
+  // arrives, so the cache kept the old company until a token refresh: the sidebar
+  // hid "Upgrade" for a company that no longer had a plan, across reloads. The
+  // moment the connection comes up (page load, or back from a network drop) is
+  // exactly when such an event may have been missed, so re-read the user once.
+  const wasConnectedRef = useRef(false);
+  useEffect(() => {
+    if (!isConnected) {
+      wasConnectedRef.current = false;
+      return;
+    }
+    if (wasConnectedRef.current) return;
+    wasConnectedRef.current = true;
+
+    if (!getCookie("token") || isRefreshingRef.current) return;
+    isRefreshingRef.current = true;
+    refreshUserRef.current({ skipCookieUpdate: true }).finally(() => {
+      isRefreshingRef.current = false;
+    });
+  }, [isConnected]);
+
   // Listen for company WebSocket events that trigger user refresh
   useEffect(() => {
     if (!socket || !isConnected || !currentUser?.company?.id) {

package/src/features/user/contexts/UserContext.tsx

@@ -7,6 +7,7 @@ import { JsonApiHydratedDataInterface, Modules, rehydrate } from "../../../core"
 import { usePageUrlGenerator } from "../../../hooks";
 import { BreadcrumbItemData } from "../../../interfaces";
 import { Action } from "../../../permissions";
+import { getRoleId } from "../../../roles";
 import { UserDeleter, UserEditor, UserReactivator, UserResentInvitationEmail } from "../components/forms";
 import { UserInterface } from "../data";
 import { useCurrentUserContext } from "./CurrentUserContext";
@@ -18,6 +19,14 @@ interface UserContextType {
 
 const UserContext = createContext<UserContextType | undefined>(undefined);
 
+/**
+ * The platform-wide user list administrators use (PlatformUsersContainer). The
+ * User module's own `pageUrl` (/users) is the company-scoped list, which a
+ * system administrator, who belongs to no company, sees empty. Same path
+ * convention as the hrefs in AdminIndexContainer.
+ */
+const USERS_ADMIN_PAGE_URL = "/administration/users";
+
 type UserProviderProps = {
   children: ReactNode;
   dehydratedUser?: JsonApiHydratedDataInterface;
@@ -25,7 +34,7 @@ type UserProviderProps = {
 
 export const UserProvider = ({ children, dehydratedUser }: UserProviderProps) => {
   const generateUrl = usePageUrlGenerator();
-  const { hasPermissionToModule } = useCurrentUserContext<UserInterface>();
+  const { hasPermissionToModule, hasRole } = useCurrentUserContext<UserInterface>();
   const t = useTranslations();
 
   const [user, setUser] = useState<UserInterface | undefined>(
@@ -35,10 +44,16 @@ export const UserProvider = ({ children, dehydratedUser }: UserProviderProps) =>
   const breadcrumb = () => {
     const response: BreadcrumbItemData[] = [];
 
-    if (hasPermissionToModule({ module: Modules.User, action: Action.Update })) {
+    // Administrators are checked by role, as CompanyProvider does: an app may
+    // grant them no module permission, and their list is the administration one.
+    const isAdministrator = hasRole(getRoleId().Administrator);
+
+    // The list root comes first, linked ONLY when it is not the current page
+    // (same rule as CompanyProvider).
+    if (isAdministrator || hasPermissionToModule({ module: Modules.User, action: Action.Update })) {
       response.push({
         name: t(`entities.users`, { count: 2 }),
-        href: generateUrl({ page: Modules.User }),
+        ...(user ? { href: generateUrl({ page: isAdministrator ? USERS_ADMIN_PAGE_URL : Modules.User }) } : {}),
       });
     }
 

package/src/features/user/contexts/__tests__/CurrentUserContext.spec.tsx

@@ -21,6 +21,8 @@ const permissionsMock = vi.hoisted(() => ({
 const socketMock = vi.hoisted(() => {
   const handlers: Record<string, ((data: any) => void)[]> = {};
   return {
+    // Read on every render, so a test can drop and restore the live connection
+    isConnected: false,
     socket: {
       on: (event: string, handler: (data: any) => void) => {
         (handlers[event] ??= []).push(handler);
@@ -39,7 +41,7 @@ const socketMock = vi.hoisted(() => {
 });
 
 vi.mock("../../../../contexts/SocketContext", () => ({
-  useSocketContext: () => ({ socket: socketMock.socket, isConnected: true }),
+  useSocketContext: () => ({ socket: socketMock.socket, isConnected: socketMock.isConnected }),
 }));
 
 vi.mock("../../../../core", () => {
@@ -113,6 +115,8 @@ describe("CurrentUserProvider", () => {
   beforeEach(() => {
     localStorage.clear();
     vi.clearAllMocks();
+    socketMock.reset();
+    socketMock.isConnected = false;
   });
 
   it("keeps user hydrated from localStorage when token cookie is absent", async () => {
@@ -161,7 +165,7 @@ describe("CurrentUserProvider", () => {
     expect(updateToken).not.toHaveBeenCalled();
   });
 
-  it("does not hit the API when localStorage already holds the user", async () => {
+  it("does not hit the API on mount when localStorage already holds the user and no live connection is up", async () => {
     vi.mocked(getCookie).mockImplementation((name: any) => (name === "token" ? "jwt" : undefined));
     localStorage.setItem("user", JSON.stringify({ id: "cached", roles: [], company: null, modules: [] }));
 
@@ -239,6 +243,117 @@ describe("CurrentUserProvider", () => {
   });
 });
 
+describe("CurrentUserProvider live connection revalidation", () => {
+  const ACTIVE = { id: "user-1", roles: [], modules: [], company: { id: "company-1", isActiveSubscription: true } };
+  const ENDED = { id: "user-1", roles: [], modules: [], company: { id: "company-1", isActiveSubscription: false } };
+
+  function SubscriptionConsumer() {
+    const { company } = useCurrentUserContext();
+    return <div data-testid="active">{company ? String((company as any).isActiveSubscription) : "null"}</div>;
+  }
+
+  beforeEach(() => {
+    localStorage.clear();
+    socketMock.reset();
+    vi.clearAllMocks();
+    vi.mocked(getCookie).mockImplementation((name: any) => (name === "token" ? "jwt" : undefined));
+    vi.mocked(UserService.findFullUser).mockResolvedValue({ ...ENDED, dehydrate: () => ENDED } as any);
+  });
+
+  it("re-reads the user when the live connection comes up, so a change missed while no page was open shows", async () => {
+    // The subscription ended (Stripe webhook) while the browser was closed: the cache still says active
+    localStorage.setItem("user", JSON.stringify(ACTIVE));
+    socketMock.isConnected = true;
+
+    const { getByTestId } = render(
+      <CurrentUserProvider>
+        <SubscriptionConsumer />
+      </CurrentUserProvider>,
+    );
+
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 50));
+    });
+
+    expect(UserService.findFullUser).toHaveBeenCalledTimes(1);
+    expect(getByTestId("active").textContent).toBe("false");
+  });
+
+  it("re-reads once per connection, not on every render", async () => {
+    localStorage.setItem("user", JSON.stringify(ACTIVE));
+    socketMock.isConnected = true;
+
+    const { rerender } = render(
+      <CurrentUserProvider>
+        <SubscriptionConsumer />
+      </CurrentUserProvider>,
+    );
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 50));
+    });
+    rerender(
+      <CurrentUserProvider>
+        <SubscriptionConsumer />
+      </CurrentUserProvider>,
+    );
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 50));
+    });
+
+    expect(UserService.findFullUser).toHaveBeenCalledTimes(1);
+  });
+
+  it("re-reads again after the connection drops and comes back", async () => {
+    localStorage.setItem("user", JSON.stringify(ACTIVE));
+    socketMock.isConnected = true;
+
+    const tree = (
+      <CurrentUserProvider>
+        <SubscriptionConsumer />
+      </CurrentUserProvider>
+    );
+    const { rerender } = render(tree);
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 50));
+    });
+
+    socketMock.isConnected = false;
+    rerender(
+      <CurrentUserProvider>
+        <SubscriptionConsumer />
+      </CurrentUserProvider>,
+    );
+    socketMock.isConnected = true;
+    rerender(
+      <CurrentUserProvider>
+        <SubscriptionConsumer />
+      </CurrentUserProvider>,
+    );
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 50));
+    });
+
+    expect(UserService.findFullUser).toHaveBeenCalledTimes(2);
+  });
+
+  it("does not re-read without a session cookie", async () => {
+    vi.mocked(getCookie).mockReturnValue(undefined);
+    localStorage.setItem("user", JSON.stringify(ACTIVE));
+    socketMock.isConnected = true;
+
+    render(
+      <CurrentUserProvider>
+        <SubscriptionConsumer />
+      </CurrentUserProvider>,
+    );
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 50));
+    });
+
+    expect(UserService.findFullUser).not.toHaveBeenCalled();
+  });
+});
+
 describe("CurrentUserProvider token updates", () => {
   const STORED_USER = {
     id: "user-1",
@@ -265,6 +380,9 @@ describe("CurrentUserProvider token updates", () => {
     localStorage.clear();
     socketMock.reset();
     vi.clearAllMocks();
+    // Connected, with no session cookie: these tests are about socket events, not the reconnect re-read
+    socketMock.isConnected = true;
+    vi.mocked(getCookie).mockReturnValue(undefined);
   });
 
   it("patches balances from company:credits_updated without refetching the user", async () => {
@@ -352,6 +470,7 @@ describe("CurrentUserProvider path permissions", () => {
   beforeEach(() => {
     localStorage.clear();
     vi.clearAllMocks();
+    socketMock.isConnected = false;
     ctx = undefined;
     permissionsMock.checkPermissions.mockImplementation(() => true);
   });

package/src/features/user/contexts/__tests__/UserContext.spec.tsx

@@ -0,0 +1,95 @@
+import { render, screen } from "@testing-library/react";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { useSharedContext } from "../../../../contexts/SharedContext";
+import { UserProvider } from "../UserContext";
+
+const access = vi.hoisted(() => ({ isAdministrator: false, canUpdateUsers: false }));
+
+vi.mock("../CurrentUserContext", () => ({
+  useCurrentUserContext: () => ({
+    hasRole: (roleId: string) => access.isAdministrator && roleId === "administrator",
+    hasPermissionToModule: () => access.canUpdateUsers,
+  }),
+}));
+
+vi.mock("../../../../roles", () => ({
+  getRoleId: () => ({ Administrator: "administrator" }),
+}));
+
+// The title functions are not under test; the real forms pull in the editor stack.
+vi.mock("../../components/forms", () => ({
+  UserDeleter: () => null,
+  UserEditor: () => null,
+  UserReactivator: () => null,
+  UserResentInvitationEmail: () => null,
+}));
+
+// The registry throws for modules nobody registered. The dehydrated user is
+// handed back as-is so the spec does not depend on the User model.
+vi.mock("../../../../core", async (importOriginal) => {
+  const actual = await importOriginal<typeof import("../../../../core")>();
+  return {
+    ...actual,
+    Modules: { User: { name: "users", pageUrl: "/users" } },
+    rehydrate: (_module: unknown, data: unknown) => data,
+  };
+});
+
+// next-intl is globally mocked in vitest.setup.ts with `t = (key) => key`, so a
+// translated label renders as its own key.
+function BreadcrumbProbe() {
+  const { breadcrumbs } = useSharedContext();
+  return <span data-testid="breadcrumbs">{JSON.stringify(breadcrumbs)}</span>;
+}
+
+const user = { id: "u1", name: "Ada", isDeleted: false, isActivated: true } as any;
+
+const renderBreadcrumbs = (dehydratedUser?: any) => {
+  render(
+    <UserProvider dehydratedUser={dehydratedUser}>
+      <BreadcrumbProbe />
+    </UserProvider>,
+  );
+  return JSON.parse(screen.getByTestId("breadcrumbs").textContent ?? "[]");
+};
+
+describe("UserContext breadcrumb", () => {
+  beforeEach(() => {
+    access.isAdministrator = false;
+    access.canUpdateUsers = false;
+  });
+
+  it("shows an administrator the users list as an unlinked root, even without the module permission", () => {
+    access.isAdministrator = true;
+
+    expect(renderBreadcrumbs()).toEqual([{ name: "entities.users" }]);
+  });
+
+  it("links an administrator's user detail back to the administration users list", () => {
+    access.isAdministrator = true;
+
+    expect(renderBreadcrumbs(user)).toEqual([
+      { name: "entities.users", href: "/administration/users" },
+      { name: "Ada", href: "/users/u1" },
+    ]);
+  });
+
+  it("shows a user manager the company users list as an unlinked root", () => {
+    access.canUpdateUsers = true;
+
+    expect(renderBreadcrumbs()).toEqual([{ name: "entities.users" }]);
+  });
+
+  it("links a user manager's user detail back to the company users list", () => {
+    access.canUpdateUsers = true;
+
+    expect(renderBreadcrumbs(user)).toEqual([
+      { name: "entities.users", href: "/users" },
+      { name: "Ada", href: "/users/u1" },
+    ]);
+  });
+
+  it("shows only the user to a viewer who can neither manage users nor administer", () => {
+    expect(renderBreadcrumbs(user)).toEqual([{ name: "Ada", href: "/users/u1" }]);
+  });
+});