fix(dashboard): open edit variant modal in current context (#9203)

medusajs · Sep 19, 2024 · 07f25de · 07f25de
1 parent 4923a6e
commit 07f25de
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 9 deletions.
diff --git a/packages/admin/dashboard/src/providers/router-provider/route-map.tsx b/packages/admin/dashboard/src/providers/router-provider/route-map.tsx
@@ -91,6 +91,13 @@ export const RouteMap: RouteObject[] = [
                         lazy: () =>
                           import("../../routes/products/product-edit"),
                       },
+                      {
+                        path: "edit-variant",
+                        lazy: () =>
+                          import(
+                            "../../routes/product-variants/product-variant-edit"
+                          ),
+                      },
                       {
                         path: "sales-channels",
                         lazy: () =>

diff --git a/...s/product-variant-edit/components/product-edit-variant-form/product-edit-variant-form.tsx b/...s/product-variant-edit/components/product-edit-variant-form/product-edit-variant-form.tsx
@@ -9,10 +9,7 @@ import { Divider } from "../../../../../components/common/divider"
 import { Form } from "../../../../../components/common/form"
 import { Combobox } from "../../../../../components/inputs/combobox"
 import { CountrySelect } from "../../../../../components/inputs/country-select"
-import {
-  RouteDrawer,
-  useRouteModal,
-} from "../../../../../components/modals"
+import { RouteDrawer, useRouteModal } from "../../../../../components/modals"
 import { useUpdateProductVariant } from "../../../../../hooks/api/products"
 import {
   transformNullableFormData,
@@ -115,7 +112,7 @@ export const ProductEditVariantForm = ({
       },
       {
         onSuccess: () => {
-          handleSuccess()
+          handleSuccess("../")
         },
       }
     )

diff --git a/...admin/dashboard/src/routes/product-variants/product-variant-edit/product-variant-edit.tsx b/...admin/dashboard/src/routes/product-variants/product-variant-edit/product-variant-edit.tsx
@@ -1,7 +1,12 @@
 import { HttpTypes } from "@medusajs/types"
 import { Heading } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
-import { json, useLoaderData, useParams } from "react-router-dom"
+import {
+  json,
+  useLoaderData,
+  useParams,
+  useSearchParams,
+} from "react-router-dom"
 import { RouteDrawer } from "../../../components/modals"
 import { useProduct } from "../../../hooks/api/products"
 import { ProductEditVariantForm } from "./components/product-edit-variant-form"
@@ -14,6 +19,8 @@ export const ProductVariantEdit = () => {
 
   const { t } = useTranslation()
   const { id, variant_id } = useParams()
+  const [URLSearchParms] = useSearchParams()
+  const searchVariantId = URLSearchParms.get("variant_id")
 
   const { product, isPending, isFetching, isError, error } = useProduct(
     id!,
@@ -24,13 +31,14 @@ export const ProductVariantEdit = () => {
   )
 
   const variant = product?.variants.find(
-    (v: HttpTypes.AdminProductVariant) => v.id === variant_id
+    (v: HttpTypes.AdminProductVariant) =>
+      v.id === (variant_id || searchVariantId)
   )
 
   if (!isPending && !isFetching && !variant) {
     throw json({
       status: 404,
-      message: `Variant with ID ${variant_id} was not found.`,
+      message: `Variant with ID ${variant_id || searchVariantId} was not found.`,
     })
   }
 

diff --git a/.../products/product-detail/components/product-variant-section/use-variant-table-columns.tsx b/.../products/product-detail/components/product-variant-section/use-variant-table-columns.tsx
@@ -67,7 +67,7 @@ const VariantActions = ({
           actions: [
             {
               label: t("actions.edit"),
-              to: `variants/${variant.id}/edit`,
+              to: `edit-variant?variant_id=${variant.id}`,
               icon: <PencilSquare />,
             },
             {