diff --git a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/components/customer-group-customer-section/customer-group-customer-section.tsx b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/components/customer-group-customer-section/customer-group-customer-section.tsx
index 4ebf1aa742..0ecb8420d6 100644
--- a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/components/customer-group-customer-section/customer-group-customer-section.tsx
+++ b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/components/customer-group-customer-section/customer-group-customer-section.tsx
@@ -1,27 +1,22 @@
-import { Button, Checkbox, Container, Heading, usePrompt } from "@medusajs/ui"
-import { Customer } from "@medusajs/medusa"
import { PencilSquare, Trash } from "@medusajs/icons"
import {
- adminCustomerGroupKeys,
- useAdminCustomPost,
- useAdminCustomerGroupCustomers,
-} from "medusa-react"
+ AdminCustomerGroupResponse,
+ AdminCustomerResponse,
+} from "@medusajs/types"
+import { Button, Checkbox, Container, Heading, usePrompt } from "@medusajs/ui"
+import { RowSelectionState, createColumnHelper } from "@tanstack/react-table"
+import { useMemo, useState } from "react"
+import { useTranslation } from "react-i18next"
+import { Link } from "react-router-dom"
+
import { ActionMenu } from "../../../../../components/common/action-menu"
import { DataTable } from "../../../../../components/table/data-table"
-import { Link } from "react-router-dom"
-import { RowSelectionState, createColumnHelper } from "@tanstack/react-table"
+import { useRemoveCustomersFromGroup } from "../../../../../hooks/api/customer-groups"
+import { useCustomers } from "../../../../../hooks/api/customers"
import { useCustomerTableColumns } from "../../../../../hooks/table/columns/use-customer-table-columns"
import { useCustomerTableFilters } from "../../../../../hooks/table/filters/use-customer-table-filters"
import { useCustomerTableQuery } from "../../../../../hooks/table/query/use-customer-table-query"
import { useDataTable } from "../../../../../hooks/use-data-table"
-import { useMemo, useState } from "react"
-import { useTranslation } from "react-i18next"
-import { AdminCustomerGroupResponse, AdminCustomerResponse } from "@medusajs/types"
-import { useCustomers } from "../../../../../hooks/api/customers"
-import {
- useRemoveCustomersFromGroup,
- useUpdateCustomerGroup,
-} from "../../../../../hooks/api/customer-groups"
type CustomerGroupCustomerSectionProps = {
group: AdminCustomerGroupResponse["customer_group"]
@@ -72,8 +67,10 @@ export const CustomerGroupCustomerSection = ({
const keys = Object.keys(rowSelection)
const res = await prompt({
- title: t("general.areYouSure"),
- description: t("customerGroups.removeCustomersWarning", {
+ title: t("customerGroups.customers.remove.title", {
+ count: keys.length,
+ }),
+ description: t("customerGroups.customers.remove.description", {
count: keys.length,
}),
confirmText: t("actions.continue"),
@@ -151,8 +148,10 @@ const CustomerActions = ({
const handleRemove = async () => {
const res = await prompt({
- title: t("general.areYouSure"),
- description: t("customerGroups.removeCustomersWarning", {
+ title: t("customerGroups.customers.remove.title", {
+ count: 1,
+ }),
+ description: t("customerGroups.customers.remove.description", {
count: 1,
}),
confirmText: t("actions.continue"),
diff --git a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/components/customer-group-general-section/customer-group-general-section.tsx b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/components/customer-group-general-section/customer-group-general-section.tsx
index 7b1cbd8fe4..b0294acb6f 100644
--- a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/components/customer-group-general-section/customer-group-general-section.tsx
+++ b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/components/customer-group-general-section/customer-group-general-section.tsx
@@ -1,9 +1,9 @@
import { PencilSquare, Trash } from "@medusajs/icons"
-import { Container, Heading } from "@medusajs/ui"
+import { AdminCustomerGroupResponse } from "@medusajs/types"
+import { Container, Heading, Text, toast, usePrompt } from "@medusajs/ui"
import { useTranslation } from "react-i18next"
import { useNavigate } from "react-router-dom"
import { ActionMenu } from "../../../../../components/common/action-menu"
-import { AdminCustomerGroupResponse } from "@medusajs/types"
import { useDeleteCustomerGroup } from "../../../../../hooks/api/customer-groups"
type CustomerGroupGeneralSectionProps = {
@@ -14,43 +14,80 @@ export const CustomerGroupGeneralSection = ({
group,
}: CustomerGroupGeneralSectionProps) => {
const { t } = useTranslation()
+ const prompt = usePrompt()
const navigate = useNavigate()
const { mutateAsync } = useDeleteCustomerGroup(group.id)
const handleDelete = async () => {
+ const res = await prompt({
+ title: t("customerGroups.delete.title"),
+ description: t("customerGroups.delete.description", {
+ name: group.name,
+ }),
+ confirmText: t("actions.delete"),
+ cancelText: t("actions.cancel"),
+ })
+
+ if (!res) {
+ return
+ }
+
await mutateAsync(undefined, {
onSuccess: () => {
+ toast.success(t("general.success"), {
+ description: t("customerGroups.delete.successToast", {
+ name: group.name,
+ }),
+ dismissLabel: t("actions.close"),
+ })
+
navigate("/customer-groups", { replace: true })
},
+ onError: (error) => {
+ toast.error(t("general.error"), {
+ description: error.message,
+ dismissLabel: t("actions.close"),
+ })
+ },
})
}
return (
-
- {group.name}
- ,
- label: t("actions.edit"),
- to: `/customer-groups/${group.id}/edit`,
- },
- ],
- },
- {
- actions: [
- {
- icon: ,
- label: t("actions.delete"),
- onClick: handleDelete,
- },
- ],
- },
- ]}
- />
+
+
+
{group.name}
+
,
+ label: t("actions.edit"),
+ to: `/customer-groups/${group.id}/edit`,
+ },
+ ],
+ },
+ {
+ actions: [
+ {
+ icon:
,
+ label: t("actions.delete"),
+ onClick: handleDelete,
+ },
+ ],
+ },
+ ]}
+ />
+
+
+ {t("customers.domain")}
+
+
+ {group.customers?.length || "-"}
+
+
)
}
diff --git a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/customer-group-detail.tsx b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/customer-group-detail.tsx
index eebcbe7c54..1dc9437984 100644
--- a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/customer-group-detail.tsx
+++ b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/customer-group-detail.tsx
@@ -1,9 +1,9 @@
-import { Outlet, json, useLoaderData, useParams } from "react-router-dom"
+import { Outlet, useLoaderData, useParams } from "react-router-dom"
import { JsonViewSection } from "../../../components/common/json-view-section"
+import { useCustomerGroup } from "../../../hooks/api/customer-groups"
import { CustomerGroupCustomerSection } from "./components/customer-group-customer-section"
import { CustomerGroupGeneralSection } from "./components/customer-group-general-section"
import { customerGroupLoader } from "./loader"
-import { useCustomerGroup } from "../../../hooks/api/customer-groups"
export const CustomerGroupDetail = () => {
const initialData = useLoaderData() as Awaited<
@@ -13,20 +13,18 @@ export const CustomerGroupDetail = () => {
const { id } = useParams()
const { customer_group, isLoading, isError, error } = useCustomerGroup(
id!,
- undefined,
+ {
+ fields: "+customers.id",
+ },
{ initialData }
)
- if (isLoading) {
+ if (isLoading || !customer_group) {
return Loading...
}
- if (isError || !customer_group) {
- if (error) {
- throw error
- }
-
- throw json("An unknown error occurred", 500)
+ if (isError) {
+ throw error
}
return (
diff --git a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/loader.ts b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/loader.ts
index a2beb15d28..cbe15af277 100644
--- a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/loader.ts
+++ b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-detail/loader.ts
@@ -7,7 +7,10 @@ import { medusa, queryClient } from "../../../lib/medusa"
const customerGroupDetailQuery = (id: string) => ({
queryKey: adminProductKeys.detail(id),
- queryFn: async () => medusa.admin.customerGroups.retrieve(id),
+ queryFn: async () =>
+ medusa.admin.customerGroups.retrieve(id, {
+ fields: "+customers.id",
+ }),
})
export const customerGroupLoader = async ({ params }: LoaderFunctionArgs) => {
diff --git a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-edit/components/edit-customer-group-form/edit-customer-group-form.tsx b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-edit/components/edit-customer-group-form/edit-customer-group-form.tsx
index 4e75daccbe..cdaa4e17f4 100644
--- a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-edit/components/edit-customer-group-form/edit-customer-group-form.tsx
+++ b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-edit/components/edit-customer-group-form/edit-customer-group-form.tsx
@@ -1,6 +1,6 @@
import { zodResolver } from "@hookform/resolvers/zod"
-import { Button, Input } from "@medusajs/ui"
-import { useAdminUpdateCustomerGroup } from "medusa-react"
+import { AdminCustomerGroupResponse } from "@medusajs/types"
+import { Button, Input, toast } from "@medusajs/ui"
import { useForm } from "react-hook-form"
import { useTranslation } from "react-i18next"
import * as z from "zod"
@@ -9,7 +9,6 @@ import {
RouteDrawer,
useRouteModal,
} from "../../../../../components/route-modal"
-import { AdminCustomerGroupResponse } from "@medusajs/types"
import { useUpdateCustomerGroup } from "../../../../../hooks/api/customer-groups"
type EditCustomerGroupFormProps = {
@@ -33,11 +32,18 @@ export const EditCustomerGroupForm = ({
resolver: zodResolver(EditCustomerGroupSchema),
})
- const { mutateAsync, isLoading } = useUpdateCustomerGroup(group.id)
+ const { mutateAsync, isPending } = useUpdateCustomerGroup(group.id)
const handleSubmit = form.handleSubmit(async (data) => {
await mutateAsync(data, {
- onSuccess: () => {
+ onSuccess: ({ customer_group }) => {
+ toast.success(t("general.success"), {
+ description: t("customerGroups.edit.successToast", {
+ name: customer_group.name,
+ }),
+ dismissLabel: t("actions.close"),
+ })
+
handleSuccess()
},
})
@@ -73,7 +79,7 @@ export const EditCustomerGroupForm = ({
{t("actions.cancel")}
-
diff --git a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-edit/customer-group-edit.tsx b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-edit/customer-group-edit.tsx
index 33d2114e26..72c90d3943 100644
--- a/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-edit/customer-group-edit.tsx
+++ b/packages/admin-next/dashboard/src/v2-routes/customer-groups/customer-group-edit/customer-group-edit.tsx
@@ -2,8 +2,8 @@ import { Heading } from "@medusajs/ui"
import { useTranslation } from "react-i18next"
import { useParams } from "react-router-dom"
import { RouteDrawer } from "../../../components/route-modal"
-import { EditCustomerGroupForm } from "./components/edit-customer-group-form"
import { useCustomerGroup } from "../../../hooks/api/customer-groups"
+import { EditCustomerGroupForm } from "./components/edit-customer-group-form"
export const CustomerGroupEdit = () => {
const { id } = useParams()
@@ -18,7 +18,7 @@ export const CustomerGroupEdit = () => {
return (