feat(admin,admin-ui,medusa): Add Medusa Admin plugin (#3334)

packages/admin-ui/ui/test/fixtures/index.ts

@@ -0,0 +1,27 @@
+import data from "./fixtures.json"
+
+const resources = data["resources"]
+
+export type Resources = typeof resources
+
+type ResourcesWithKey<Entity extends string, T> = {
+  [K in keyof T]: { [_ in Entity]: K } & T[K]
+}
+
+type KeyedResources = ResourcesWithKey<"entity", Resources>
+
+export const fixtures = {
+  get<Entity extends keyof Resources>(
+    entity: Entity
+  ): Omit<KeyedResources[Entity], "entity"> {
+    return (resources as any)[entity]
+  },
+  list<Entity extends keyof Resources>(
+    entity: Entity,
+    number = 2
+  ): Omit<KeyedResources[Entity], "entity">[] {
+    return Array(number)
+      .fill(null)
+      .map((_) => fixtures.get(entity))
+  },
+} as const

packages/admin-ui/ui/test/mocks/medusa-react.tsx

@@ -0,0 +1,49 @@
+import { vi } from "vitest"
+import { fixtures, Resources } from "../fixtures"
+
+vi.mock("medusa-react", async () => {
+  const actual = await vi.importActual("medusa-react")
+  return {
+    // @ts-ignore
+    ...actual,
+    MedusaProvider: vi.fn(({ children }) => children),
+    // Get queries
+    useAdminGetSession: vi.fn(() => mockGetQuery("user")),
+    useAdminStore: vi.fn(() => mockGetQuery("store")),
+    useAdminProduct: vi.fn(() => mockGetQuery("product")),
+    useAdminCustomer: vi.fn(() => mockGetQuery("customer")),
+    useAdminOrder: vi.fn(() => mockGetQuery("order")),
+    // List queries
+    useAdminCustomers: vi.fn(() => mockListQuery("customer")),
+    useAdminProducts: vi.fn(() => mockListQuery("product")),
+    useAdminOrders: vi.fn(() => mockListQuery("order")),
+    useAdminShippingOptions: vi.fn(() => mockListQuery("shipping_option")),
+    useAdminReturnReasons: vi.fn(() => mockListQuery("return_reason")),
+    useAdminBatchJobs: vi.fn(() => {
+      return []
+    }),
+    // Mutations
+    useAdminCreateClaim: vi.fn(() => mockMutation),
+  }
+})
+
+const mockMutation = {
+  mutate: vi.fn().mockImplementation((data) => console.log(data)),
+  mutateAsync: vi.fn(),
+  isLoading: false,
+}
+
+const mockListQuery = (resource: keyof Resources) => {
+  return {
+    [`${resource}s`]: fixtures.list(resource, 5),
+    isLoading: false,
+    count: 5,
+  }
+}
+
+const mockGetQuery = (resource: keyof Resources) => {
+  return {
+    [`${resource}`]: fixtures.get(resource),
+    isLoading: false,
+  }
+}

packages/admin-ui/ui/test/setup.ts

@@ -0,0 +1,19 @@
+import "@testing-library/jest-dom"
+import { vi } from "vitest"
+import "./mocks/medusa-react"
+
+const IntersectionObserverMock = vi.fn(() => ({
+  disconnect: vi.fn(),
+  observe: vi.fn(),
+  takeRecords: vi.fn(),
+  unobserve: vi.fn(),
+}))
+
+const ResizeObserverMock = vi.fn(() => ({
+  disconnect: vi.fn(),
+  observe: vi.fn(),
+  unobserve: vi.fn(),
+}))
+
+vi.stubGlobal("IntersectionObserver", IntersectionObserverMock)
+vi.stubGlobal("ResizeObserver", ResizeObserverMock)

packages/admin-ui/ui/test/utils/render-with-providers.tsx

@@ -0,0 +1,27 @@
+import { render, RenderOptions } from "@testing-library/react"
+import { PropsWithChildren, ReactElement } from "react"
+import { BrowserRouter } from "react-router-dom"
+import { Providers } from "../../src/providers/providers"
+
+const Wrapper = ({ children }: PropsWithChildren) => {
+  return (
+    <BrowserRouter>
+      <Providers>{children}</Providers>
+    </BrowserRouter>
+  )
+}
+
+const customRender = (
+  ui: ReactElement,
+  options?: Omit<RenderOptions, "wrapper">
+) => render(ui, { wrapper: Wrapper, ...options })
+
+export const renderWithProviders = (
+  ui: ReactElement,
+  { route = "/" } = {},
+  options?: Omit<RenderOptions, "wrapper">
+) => {
+  window.history.pushState({}, "Test page", route)
+
+  return customRender(ui, options)
+}