feat(admin, admin-ui, medusa-js, medusa-react, medusa): Support Admin Extensions (#4761)

Co-authored-by: Rares Stefan <948623+StephixOne@users.noreply.github.com>
Co-authored-by: Oli Juhl <59018053+olivermrbl@users.noreply.github.com>

packages/medusa-react/src/hooks/admin/collections/mutations.ts

@@ -19,7 +19,7 @@ import { adminCollectionKeys } from "./queries"
 
 export const useAdminCreateCollection = (
   options?: UseMutationOptions<
-    Response<AdminCollectionsRes>,
+    Response<AdminCollectionsRes>, 
     Error,
     AdminPostCollectionsReq
   >

packages/medusa-react/src/hooks/admin/custom/index.ts

@@ -0,0 +1,2 @@
+export { useAdminCustomDelete, useAdminCustomPost } from "./mutations"
+export { useAdminCustomQuery } from "./queries"

packages/medusa-react/src/hooks/admin/custom/mutations.ts

@@ -0,0 +1,128 @@
+import { Response } from "@medusajs/medusa-js"
+import {
+  QueryClient,
+  QueryKey,
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
+import { useMedusa } from "../../../contexts"
+import { adminCustomerGroupKeys } from "../customer-groups"
+import { adminCustomerKeys } from "../customers"
+import { adminDiscountKeys } from "../discounts"
+import { adminGiftCardKeys } from "../gift-cards"
+import { adminOrderKeys } from "../orders"
+import { adminPriceListKeys } from "../price-lists"
+import { adminProductKeys } from "../products"
+
+type RelatedDomain =
+  | "product"
+  | "customer"
+  | "customer_group"
+  | "order"
+  | "discount"
+  | "gift_card"
+  | "price_list"
+
+export type RelatedDomains = {
+  [key in RelatedDomain]?: boolean
+}
+
+const invalidateRelatedDomain = (
+  queryClient: QueryClient,
+  domain: RelatedDomain
+) => {
+  switch (domain) {
+    case "product":
+      queryClient.invalidateQueries(adminProductKeys.all)
+      break
+    case "customer":
+      queryClient.invalidateQueries(adminCustomerKeys.all)
+      break
+    case "customer_group":
+      queryClient.invalidateQueries(adminCustomerGroupKeys.all)
+      break
+    case "order":
+      queryClient.invalidateQueries(adminOrderKeys.all)
+      break
+    case "discount":
+      queryClient.invalidateQueries(adminDiscountKeys.all)
+      break
+    case "gift_card":
+      queryClient.invalidateQueries(adminGiftCardKeys.all)
+      break
+    case "price_list":
+      queryClient.invalidateQueries(adminPriceListKeys.all)
+      break
+  }
+}
+
+export const buildCustomOptions = <
+  TData,
+  TError,
+  TVariables,
+  TContext,
+  TKey extends QueryKey
+>(
+  queryClient: QueryClient,
+  queryKey?: TKey,
+  options?: UseMutationOptions<TData, TError, TVariables, TContext>,
+  relatedDomains?: RelatedDomains
+): UseMutationOptions<TData, TError, TVariables, TContext> => {
+  return {
+    ...options,
+    onSuccess: (...args) => {
+      if (queryKey !== undefined) {
+        queryKey.forEach((key) => {
+          queryClient.invalidateQueries({ queryKey: key as QueryKey })
+        })
+      }
+
+      if (relatedDomains) {
+        Object.keys(relatedDomains).forEach((key) => {
+          if (relatedDomains[key as RelatedDomain]) {
+            invalidateRelatedDomain(queryClient, key as RelatedDomain)
+          }
+        })
+      }
+
+      if (options?.onSuccess) {
+        return options.onSuccess(...args)
+      }
+    },
+  }
+}
+
+export const useAdminCustomPost = <
+  TPayload extends Record<string, any>,
+  TResponse
+>(
+  path: string,
+  queryKey: QueryKey,
+  relatedDomains?: RelatedDomains,
+  options?: UseMutationOptions<Response<TResponse>, Error, TPayload>
+) => {
+  const { client } = useMedusa()
+  const queryClient = useQueryClient()
+
+  return useMutation(
+    (payload: TPayload) =>
+      client.admin.custom.post<TPayload, TResponse>(path, payload),
+    buildCustomOptions(queryClient, queryKey, options, relatedDomains)
+  )
+}
+
+export const useAdminCustomDelete = <TResponse>(
+  path: string,
+  queryKey: QueryKey,
+  relatedDomains?: RelatedDomains,
+  options?: UseMutationOptions<Response<TResponse>, Error, void>
+) => {
+  const { client } = useMedusa()
+  const queryClient = useQueryClient()
+
+  return useMutation(
+    () => client.admin.custom.delete<TResponse>(path),
+    buildCustomOptions(queryClient, queryKey, options, relatedDomains)
+  )
+}

packages/medusa-react/src/hooks/admin/custom/queries.ts

@@ -0,0 +1,28 @@
+import { Response } from "@medusajs/medusa-js"
+import { QueryKey, useQuery } from "@tanstack/react-query"
+import { useMedusa } from "../../../contexts"
+import { UseQueryOptionsWrapper } from "../../../types"
+
+export const useAdminCustomQuery = <
+  TQuery extends Record<string, any>,
+  TResponse = any
+>(
+  path: string,
+  queryKey: QueryKey,
+  query?: TQuery,
+  options?: UseQueryOptionsWrapper<
+    Response<TResponse>,
+    Error,
+    (string | TQuery | QueryKey | undefined)[]
+  >
+) => {
+  const { client } = useMedusa()
+
+  const { data, ...rest } = useQuery(
+    [path, query, queryKey],
+    () => client.admin.custom.get<TQuery, TResponse>(path, query),
+    options
+  )
+
+  return { data, ...rest } as const
+}

packages/medusa-react/src/hooks/admin/index.ts

@@ -3,6 +3,7 @@ export * from "./batch-jobs"
 export * from "./claims"
 export * from "./collections"
 export * from "./currencies"
+export * from "./custom"
 export * from "./customer-groups"
 export * from "./customers"
 export * from "./discounts"
@@ -12,27 +13,27 @@ export * from "./inventory-item"
 export * from "./invites"
 export * from "./notes"
 export * from "./notifications"
-export * from "./orders"
 export * from "./order-edits"
+export * from "./orders"
+export * from "./payment-collections"
+export * from "./payments"
 export * from "./price-lists"
+export * from "./product-categories"
 export * from "./product-tags"
 export * from "./product-types"
 export * from "./products"
-export * from "./product-categories"
 export * from "./publishable-api-keys"
 export * from "./regions"
+export * from "./reservations"
 export * from "./return-reasons"
 export * from "./returns"
-export * from "./reservations"
 export * from "./sales-channels"
 export * from "./shipping-options"
 export * from "./shipping-profiles"
+export * from "./stock-locations"
 export * from "./store"
 export * from "./swaps"
 export * from "./tax-rates"
 export * from "./uploads"
 export * from "./users"
 export * from "./variants"
-export * from "./payment-collections"
-export * from "./payments"
-export * from "./stock-locations"