shoc-frontend-new/src/test/components/layout/app-sidebar-can-approve.test.tsx

import { screen, waitFor } from "@testing-library/react";
import { beforeEach, describe, expect, it, vi } from "vitest";

import { AppSidebar } from "@/components/layout/app-sidebar";
import { queryKeys } from "@/infra/query-key/query-key";
import { createTestQueryClient, renderWithProviders } from "@/test/test-utils";

const canApproveApiMock = vi.hoisted(() => vi.fn());

vi.mock("@/domain/uplifts/api/uplifts-api", () => ({
  upliftsApi: { canApprove: canApproveApiMock },
}));

describe("AppSidebar Uplift Approvals gating through the can-approve query", () => {
  beforeEach(() => {
    canApproveApiMock.mockReset();
  });

  it("shows the entry when the API allows tier 2 and fails for tier 1", async () => {
    canApproveApiMock.mockImplementation(async (tier: number) => {
      if (tier === 1) throw new Error("503");
      return true;
    });

    renderWithProviders(<AppSidebar collapsed={false} />, { route: "/", withAuth: false });

    expect(await screen.findByRole("link", { name: "Uplift Approvals" })).toHaveAttribute(
      "href",
      "/uplifts",
    );
    expect(canApproveApiMock).toHaveBeenCalledWith(1);
    expect(canApproveApiMock).toHaveBeenCalledWith(2);
  });

  it("keeps the entry hidden once the API has denied both tiers", async () => {
    canApproveApiMock.mockResolvedValue(false);
    const queryClient = createTestQueryClient();

    renderWithProviders(<AppSidebar collapsed={false} />, {
      route: "/",
      withAuth: false,
      queryClient,
    });

    await waitFor(() => {
      for (const tier of [1, 2]) {
        expect(queryClient.getQueryState(queryKeys.uplifts.canApprove(tier))?.status).toBe(
          "success",
        );
      }
    });
    expect(screen.queryByRole("link", { name: "Uplift Approvals" })).toBeNull();
    expect(screen.getByRole("link", { name: "Services" })).toHaveAttribute(
      "href",
      "/settings/services",
    );
  });
});