chore: price list prices of a product can be deleted (#7700)

packages/admin-next/dashboard/src/hooks/api/price-lists.tsx

@@ -1,3 +1,5 @@
+import { FetchError } from "@medusajs/js-sdk"
+import { HttpTypes } from "@medusajs/types"
 import {
   QueryKey,
   UseMutationOptions,
@@ -5,7 +7,7 @@ import {
   useMutation,
   useQuery,
 } from "@tanstack/react-query"
-import { client } from "../../lib/client"
+import { client, sdk } from "../../lib/client"
 import { queryClient } from "../../lib/query-client"
 import { queryKeysFactory } from "../../lib/query-key-factory"
 import {
@@ -19,6 +21,7 @@ import {
   PriceListListRes,
   PriceListRes,
 } from "../../types/api-responses"
+import { productsQueryKeys } from "./products"
 
 const PRICE_LISTS_QUERY_KEY = "price-lists" as const
 export const priceListsQueryKeys = queryKeysFactory(PRICE_LISTS_QUERY_KEY)
@@ -114,6 +117,7 @@ export const usePriceListAddPrices = (
         queryKey: priceListsQueryKeys.detail(id),
       })
       queryClient.invalidateQueries({ queryKey: priceListsQueryKeys.lists() })
+      queryClient.invalidateQueries({ queryKey: productsQueryKeys.lists() })
 
       options?.onSuccess?.(data, variables, context)
     },
@@ -138,3 +142,26 @@ export const usePriceListRemovePrices = (
     ...options,
   })
 }
+
+export const usePriceListLinkProducts = (
+  id: string,
+  options?: UseMutationOptions<
+    HttpTypes.AdminPriceListResponse,
+    FetchError,
+    HttpTypes.AdminLinkPriceListProducts
+  >
+) => {
+  return useMutation({
+    mutationFn: (payload) => sdk.admin.priceList.linkProducts(id, payload),
+    onSuccess: (data, variables, context) => {
+      queryClient.invalidateQueries({
+        queryKey: priceListsQueryKeys.detail(id),
+      })
+      queryClient.invalidateQueries({ queryKey: priceListsQueryKeys.lists() })
+      queryClient.invalidateQueries({ queryKey: productsQueryKeys.lists() })
+
+      options?.onSuccess?.(data, variables, context)
+    },
+    ...options,
+  })
+}

packages/admin-next/dashboard/src/i18n/translations/en.json

@@ -1247,8 +1247,7 @@
       "override": "Override"
     },
     "products": {
-      "deleteProductsPricesWarning_one": "You are about to delete {{count}} product price. This action cannot be undone.",
-      "deleteProductsPricesWarning_other": "You are about to delete {{count}} product prices. This action cannot be undone."
+      "deleteProductsPricesWarning": "You are about to delete all prices of {{count}} product(s). This action cannot be undone."
     },
     "prices": {
       "addPrices": "Add prices",

packages/admin-next/dashboard/src/routes/pricing/pricing-detail/components/pricing-product-section/pricing-product-section.tsx

@@ -1,5 +1,5 @@
 import { PencilSquare, Plus, Trash } from "@medusajs/icons"
-import { PriceListDTO, HttpTypes } from "@medusajs/types"
+import { HttpTypes, PriceListDTO } from "@medusajs/types"
 import { Checkbox, Container, Heading, usePrompt } from "@medusajs/ui"
 import { keepPreviousData } from "@tanstack/react-query"
 import { RowSelectionState, createColumnHelper } from "@tanstack/react-table"
@@ -8,6 +8,7 @@ import { useTranslation } from "react-i18next"
 import { useNavigate } from "react-router-dom"
 import { ActionMenu } from "../../../../../components/common/action-menu"
 import { DataTable } from "../../../../../components/table/data-table"
+import { usePriceListLinkProducts } from "../../../../../hooks/api/price-lists"
 import { useProducts } from "../../../../../hooks/api/products"
 import { useProductTableColumns } from "../../../../../hooks/table/columns/use-product-table-columns"
 import { useProductTableFilters } from "../../../../../hooks/table/filters/use-product-table-filters"
@@ -45,7 +46,8 @@ export const PricingProductSection = ({
   )
 
   const filters = useProductTableFilters()
-  const columns = useColumns()
+  const columns = useColumns(priceList)
+  const { mutateAsync } = usePriceListLinkProducts(priceList.id)
 
   const { table } = useDataTable({
     data: products || [],
@@ -76,9 +78,9 @@ export const PricingProductSection = ({
       return
     }
 
-    // The endpoint to batch remove prices by product ids is not implemented in
-    // v2. We either need to implement it or remove the feature.
-    console.log("Not implemented yet.")
+    mutateAsync({
+      remove: Object.keys(rowSelection),
+    })
   }
 
   const handleEdit = async () => {
@@ -144,10 +146,36 @@ export const PricingProductSection = ({
   )
 }
 
-const ProductRowAction = ({ product }: { product: HttpTypes.AdminProduct }) => {
+const ProductRowAction = ({
+  product,
+  priceList,
+}: {
+  product: HttpTypes.AdminProduct
+  priceList: HttpTypes.AdminPriceList
+}) => {
   const { t } = useTranslation()
+  const { mutateAsync } = usePriceListLinkProducts(priceList.id)
 
-  // TODO: The endpoint to remove prices by product id is not implemented in v2.
+  const handleDelete = async () => {
+    const prompt = usePrompt()
+
+    const res = await prompt({
+      title: t("general.areYouSure"),
+      description: t("pricing.products.deleteProductsPricesWarning", {
+        count: 1,
+      }),
+      confirmText: t("actions.delete"),
+      cancelText: t("actions.cancel"),
+    })
+
+    if (!res) {
+      return
+    }
+
+    mutateAsync({
+      remove: [product.id],
+    })
+  }
 
   return (
     <ActionMenu
@@ -157,11 +185,7 @@ const ProductRowAction = ({ product }: { product: HttpTypes.AdminProduct }) => {
             {
               icon: <Trash />,
               label: t("actions.remove"),
-              onClick: () => {
-                console.log(
-                  `Removing prices for ${product.id}. Not implemented yet.`
-                )
-              },
+              onClick: handleDelete,
             },
           ],
         },
@@ -172,7 +196,7 @@ const ProductRowAction = ({ product }: { product: HttpTypes.AdminProduct }) => {
 
 const columnHelper = createColumnHelper<HttpTypes.AdminProduct>()
 
-const useColumns = () => {
+const useColumns = (priceList: HttpTypes.AdminPriceList) => {
   const base = useProductTableColumns()
 
   return useMemo(
@@ -208,7 +232,9 @@ const useColumns = () => {
       ...base,
       columnHelper.display({
         id: "actions",
-        cell: ({ row }) => <ProductRowAction product={row.original} />,
+        cell: ({ row }) => (
+          <ProductRowAction product={row.original} priceList={priceList} />
+        ),
       }),
     ],
     [base]