From 596faf2ad3532b7393b87e53820f5ba5216489fb Mon Sep 17 00:00:00 2001 From: Kasper Fabricius Kristensen <45367945+kasperkristensen@users.noreply.github.com> Date: Tue, 9 Apr 2024 16:53:09 +0200 Subject: [PATCH] chore(dashboard): Cleanup Pricing domain (#7035) **What** - Adds missing translations - Minor cleanup **Note** - The domain is still missing features that are supported in V1, but are currently not available in V2. The types are also all wrong, so will need to revisit after the pricing domain is revisited, types have been added, and missing features implemented. CLOSES CORE-1901 --- .../public/locales/en-US/translation.json | 43 +++++++++---- .../use-customer-group-table-columns.tsx | 5 +- .../src/providers/router-provider/v2.tsx | 2 +- .../price-list-configuration-form.tsx | 8 +-- .../pricing-configuration.tsx | 2 +- .../pricing-create-form.tsx | 2 +- .../pricing-details-form.tsx | 60 ++++++++++++------- .../pricing-products-form.tsx | 3 +- .../pricing-configuration-section.tsx | 2 +- .../pricing-general-section.tsx | 5 +- .../pricing-product-section.tsx | 4 +- .../edit-price-list-form.tsx | 6 +- .../pricing/pricing-edit/pricing-edit.tsx | 2 +- .../pricing-list-table/pricing-list-table.tsx | 6 +- .../use-pricing-table-columns.tsx | 10 +++- .../use-pricing-table-filters.tsx | 18 ++++++ .../pricing/pricing-products-add/index.ts | 1 - .../pricing-products-add.tsx | 5 -- .../pricing/pricing-products/index.ts | 1 + .../pricing-products/pricing-products.tsx | 5 ++ .../types/src/http/customer/admin/customer.ts | 3 + 21 files changed, 134 insertions(+), 59 deletions(-) create mode 100644 packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/use-pricing-table-filters.tsx delete mode 100644 packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products-add/index.ts delete mode 100644 packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products-add/pricing-products-add.tsx create mode 100644 packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products/index.ts create mode 100644 packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products/pricing-products.tsx diff --git a/packages/admin-next/dashboard/public/locales/en-US/translation.json b/packages/admin-next/dashboard/public/locales/en-US/translation.json index 7328ee3288..ba02683ec3 100644 --- a/packages/admin-next/dashboard/public/locales/en-US/translation.json +++ b/packages/admin-next/dashboard/public/locales/en-US/translation.json @@ -741,7 +741,20 @@ }, "pricing": { "domain": "Pricing", - "deletePriceListWarning": "You are about to delete the price list {{name}}. This action cannot be undone.", + "create": { + "header": "Create Price List", + "hint": "Create a new price list to manage the prices of your products." + }, + "edit": { + "header": "Edit Price List" + }, + "configuration": { + "header": "Configuration", + "editHeader": "Edit Price List Configuration" + }, + "warnings": { + "delete": "You are about to delete the price list {{name}}. This action cannot be undone." + }, "status": { "draft": "Draft", "expired": "Expired", @@ -752,15 +765,6 @@ "sale": "Sale", "override": "Override" }, - "settings": { - "typeHint": "Choose the type of price list you want to create.", - "saleTypeHint": "Sale prices are temporary price changes for products.", - "overrideTypeHint": "Overrides are usually used to create customer-specific prices.", - "editPriceListTitle": "Edit Price List", - "customerGroupsLabel": "Customer groups", - "priceOverridesLabel": "Price overrides", - "taxInclusivePricingHint": "When enabled all prices in the price list will be tax inclusive." - }, "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." @@ -768,6 +772,25 @@ "prices": { "addPrices": "Add prices", "editPrices": "Edit prices" + }, + "table": { + "pricesHeader": "Prices" + }, + "fields": { + "typeHint": "Choose the type of price you want to create.", + "saleTypeHint": "Sale prices are temporary price changes for products.", + "overrideTypeHint": "Overrides are usually used to create customer-specific prices.", + "startDateLabel": "Price list has a start date?", + "startDateHint": "Schedule the price list to activate in the future.", + "endDateLabel": "Price list has an expiry date?", + "endDateHint": "Schedule the price list to deactivate in the future.", + "customerAvailabilityLabel": "Customer availability", + "customerAvailabilityHint": "Choose which customer groups the price list should be applied to.", + "customerAvailabilityNoSelectionLabel": "No customer groups selected", + "priceOverridesLabel": "Price overrides" + }, + "actions": { + "addCustomerGroups": "Add customer groups" } }, "profile": { diff --git a/packages/admin-next/dashboard/src/hooks/table/columns/use-customer-group-table-columns.tsx b/packages/admin-next/dashboard/src/hooks/table/columns/use-customer-group-table-columns.tsx index e0e6743dfd..b7f0f1cc07 100644 --- a/packages/admin-next/dashboard/src/hooks/table/columns/use-customer-group-table-columns.tsx +++ b/packages/admin-next/dashboard/src/hooks/table/columns/use-customer-group-table-columns.tsx @@ -2,14 +2,15 @@ import { Text } from "@medusajs/ui" import { createColumnHelper } from "@tanstack/react-table" import { useMemo } from "react" -import { CustomerGroupDTO } from "@medusajs/types" +import { AdminCustomerGroupResponse } from "@medusajs/types" import { CreatedAtCell, CreatedAtHeader, } from "../../../components/table/table-cells/common/created-at-cell" import { NameHeader } from "../../../components/table/table-cells/common/name-cell" -const columnHelper = createColumnHelper() +const columnHelper = + createColumnHelper() export const useCustomerGroupTableColumns = () => { return useMemo( diff --git a/packages/admin-next/dashboard/src/providers/router-provider/v2.tsx b/packages/admin-next/dashboard/src/providers/router-provider/v2.tsx index fa51791561..023b76149b 100644 --- a/packages/admin-next/dashboard/src/providers/router-provider/v2.tsx +++ b/packages/admin-next/dashboard/src/providers/router-provider/v2.tsx @@ -300,7 +300,7 @@ export const v2Routes: RouteObject[] = [ { path: "products/add", lazy: () => - import("../../v2-routes/pricing/pricing-products-add"), + import("../../v2-routes/pricing/pricing-products"), }, { path: "products/edit", diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-configuration/components/price-list-configuration-form/price-list-configuration-form.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-configuration/components/price-list-configuration-form/price-list-configuration-form.tsx index bbb9003849..deb29ca557 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-configuration/components/price-list-configuration-form/price-list-configuration-form.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-configuration/components/price-list-configuration-form/price-list-configuration-form.tsx @@ -91,10 +91,10 @@ export const PriceListConfigurationForm = ({
- Price list has a start date? + {t("pricing.fields.startDateLabel")} - Schedule the price list to activate in the future. + {t("pricing.fields.startDateHint")}
@@ -148,10 +148,10 @@ export const PriceListConfigurationForm = ({
- Price list has an end date? + {t("pricing.fields.endDateLabel")} - Schedule the price list to deactivate in the future. + {t("pricing.fields.endDateHint")}
diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-configuration/pricing-configuration.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-configuration/pricing-configuration.tsx index 5b8eb53e27..9eb1c06761 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-configuration/pricing-configuration.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-configuration/pricing-configuration.tsx @@ -20,7 +20,7 @@ export const PricingConfiguration = () => { return ( - {t("pricing.settings.editPriceListTitle")} + {t("pricing.configuration.editHeader")} {ready && } diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-create-form.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-create-form.tsx index 45806a2737..36048278f1 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-create-form.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-create-form.tsx @@ -84,7 +84,7 @@ export const PricingCreateForm = () => { for (const [currencyCode, currencyPrice] of Object.entries( currency_prices )) { - if (!currencyPrice) { + if (!currencyPrice?.amount) { continue } diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-details-form.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-details-form.tsx index 1667ba4e06..f02bcc5b02 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-details-form.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-details-form.tsx @@ -14,7 +14,7 @@ import { useFieldArray, type UseFormReturn } from "react-hook-form" import { useTranslation } from "react-i18next" import { XMarkMini } from "@medusajs/icons" -import { CustomerGroupDTO } from "@medusajs/types" +import { AdminCustomerGroupResponse } from "@medusajs/types" import { keepPreviousData } from "@tanstack/react-query" import { OnChangeFn, @@ -89,9 +89,9 @@ export const PricingDetailsForm = ({ form }: PricingDetailsFormProps) => {
- Create Price List + {t("pricing.create.header")} - Create a new price list to manage the prices of your products. + {t("pricing.create.hint")}
{
{t("fields.type")} - - Choose the type of price list you want to create. - + {t("pricing.fields.typeHint")}
{ >
- - Price list has a start date? - +
+ + {t("pricing.fields.startDateLabel")} + + + ({t("fields.optional")}) + +
- Schedule the price list to activate in the future. + {t("pricing.fields.startDateHint")}
@@ -246,11 +253,20 @@ export const PricingDetailsForm = ({ form }: PricingDetailsFormProps) => { >
- - Price list has an end date? - +
+ + {t("pricing.fields.endDateLabel")} + + + ({t("fields.optional")}) + +
- Schedule the price list to deactivate in the future. + {t("pricing.fields.endDateHint")}
@@ -292,11 +308,10 @@ export const PricingDetailsForm = ({ form }: PricingDetailsFormProps) => {
- Customer availability + {t("pricing.fields.customerAvailabilityLabel")} - Specify which customer groups the price overrides - should apply for. + {t("pricing.fields.customerAvailabilityHint")}
@@ -342,7 +357,9 @@ export const PricingDetailsForm = ({ form }: PricingDetailsFormProps) => { leading="compact" className="text-ui-fg-muted" > - No customer groups selected. + {t( + "pricing.fields.customerAvailabilityNoSelectionLabel" + )}
)} @@ -353,7 +370,7 @@ export const PricingDetailsForm = ({ form }: PricingDetailsFormProps) => { type="button" onClick={handleOpenDrawer} > - Add customer groups + {t("pricing.actions.addCustomerGroups")}
@@ -424,7 +441,7 @@ const CustomerGroupDrawer = ({ const newCustomerGroups = customer_groups ?.filter((cg) => newIds.includes(cg.id)) - .map((cg) => ({ id: cg.id, name: cg.name })) || [] + .map((cg) => ({ id: cg.id, name: cg.name! })) || [] const filteredIntermediate = intermediate.filter( (cg) => !removedIds.includes(cg.id) @@ -494,7 +511,8 @@ const CustomerGroupDrawer = ({ ) } -const columnHelper = createColumnHelper() +const columnHelper = + createColumnHelper() const useColumns = () => { const base = useCustomerGroupTableColumns() diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-products-form.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-products-form.tsx index 35f8a0e6e3..908a4fa344 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-products-form.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-create/components/pricing-create-form/pricing-products-form.tsx @@ -14,7 +14,8 @@ import { useProductTableFilters } from "../../../../../hooks/table/filters/use-p import { useProductTableQuery } from "../../../../../hooks/table/query/use-product-table-query" import { useDataTable } from "../../../../../hooks/use-data-table" import { ExtendedProductDTO } from "../../../../../types/api-responses" -import { PricingCreateSchemaType, PricingProductsRecordType } from "./schema" +import { PricingProductsRecordType } from "../../../common/schemas" +import { PricingCreateSchemaType } from "./schema" type PricingProductsFormProps = { form: UseFormReturn diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-detail/components/pricing-configuration-section/pricing-configuration-section.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-detail/components/pricing-configuration-section/pricing-configuration-section.tsx index a27aa38b55..1b4c8d6b75 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-detail/components/pricing-configuration-section/pricing-configuration-section.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-detail/components/pricing-configuration-section/pricing-configuration-section.tsx @@ -22,7 +22,7 @@ export const PricingConfigurationSection = ({ return (
- {t("fields.configurations")} + {t("pricing.configuration.header")} { const res = await prompt({ title: t("general.areYouSure"), - description: t("pricing.deletePriceListWarning", { + description: t("pricing.warnings.delete", { name: priceList.title, }), confirmText: t("actions.delete"), @@ -98,7 +99,7 @@ export const PricingGeneralSection = ({
- {t("pricing.settings.priceOverridesLabel")} + {t("pricing.fields.priceOverridesLabel")} {overrideCount || "-"} diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-detail/components/pricing-product-section/pricing-product-section.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-detail/components/pricing-product-section/pricing-product-section.tsx index 4bbebde4a6..e390be1521 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-detail/components/pricing-product-section/pricing-product-section.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-detail/components/pricing-product-section/pricing-product-section.tsx @@ -159,7 +159,9 @@ const ProductRowAction = ({ product }: { product: ExtendedProductDTO }) => { icon: , label: t("actions.remove"), onClick: () => { - console.log("Not implemented yet.") + console.log( + `Removing prices for ${product.id}. Not implemented yet.` + ) }, }, ], diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-edit/components/edit-price-list-form/edit-price-list-form.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-edit/components/edit-price-list-form/edit-price-list-form.tsx index 33ceda0306..e38d71e50c 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-edit/components/edit-price-list-form/edit-price-list-form.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-edit/components/edit-price-list-form/edit-price-list-form.tsx @@ -60,19 +60,19 @@ export const EditPriceListForm = ({ priceList }: EditPriceListFormProps) => {
{t("fields.type")} - {t("pricing.settings.typeHint")} + {t("pricing.fields.typeHint")}
diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-edit/pricing-edit.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-edit/pricing-edit.tsx index 4588960015..2860801063 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-edit/pricing-edit.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-edit/pricing-edit.tsx @@ -20,7 +20,7 @@ export const PricingEdit = () => { return ( - {t("pricing.settings.editPriceListTitle")} + {t("pricing.edit.header")} {ready && } diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/pricing-list-table.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/pricing-list-table.tsx index cf69bcbe08..b7484c4c4a 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/pricing-list-table.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/pricing-list-table.tsx @@ -6,6 +6,7 @@ import { DataTable } from "../../../../../components/table/data-table" import { usePriceLists } from "../../../../../hooks/api/price-lists" import { useDataTable } from "../../../../../hooks/use-data-table" import { usePricingTableColumns } from "./use-pricing-table-columns" +import { usePricingTableFilters } from "./use-pricing-table-filters" import { usePricingTableQuery } from "./use-pricing-table-query" const PAGE_SIZE = 20 @@ -18,7 +19,7 @@ export const PricingListTable = () => { }) const { price_lists, count, isLoading, isError, error } = usePriceLists( // { - // ...searchParams, // The query params are not implemented, and any search params other than expand and fields will throw an error + // ...searchParams, // TODO: Query params are not currently supported by the API. // }, undefined, { @@ -26,6 +27,7 @@ export const PricingListTable = () => { } ) + const filters = usePricingTableFilters() const columns = usePricingTableColumns() const { table } = useDataTable({ @@ -53,6 +55,8 @@ export const PricingListTable = () => { table={table} columns={columns} count={count} + filters={filters} + orderBy={["name", "status", "created_at", "updated_at"]} queryObject={raw} pageSize={PAGE_SIZE} navigateTo={(row) => row.original.id} diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/use-pricing-table-columns.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/use-pricing-table-columns.tsx index 5f5b64693f..62aeeda2a0 100644 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/use-pricing-table-columns.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/use-pricing-table-columns.tsx @@ -3,6 +3,10 @@ import { createColumnHelper } from "@tanstack/react-table" import { useMemo } from "react" import { useTranslation } from "react-i18next" import { StatusCell } from "../../../../../components/table/table-cells/common/status-cell" +import { + TextCell, + TextHeader, +} from "../../../../../components/table/table-cells/common/text-cell" import { getPriceListStatus } from "../../../common/utils" import { PricingTableActions } from "./pricing-table-actions" @@ -14,7 +18,7 @@ export const usePricingTableColumns = () => { return useMemo( () => [ columnHelper.accessor("title", { - header: t("fields.name"), + header: () => , cell: (info) => info.getValue(), }), columnHelper.accessor("status", { @@ -26,8 +30,8 @@ export const usePricingTableColumns = () => { }, }), columnHelper.accessor("prices", { - header: t("fields.prices"), - cell: (info) => info.getValue()?.length || "-", + header: t("pricing.table.pricesHeader"), + cell: (info) => , }), columnHelper.display({ id: "actions", diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/use-pricing-table-filters.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/use-pricing-table-filters.tsx new file mode 100644 index 0000000000..23777f91c3 --- /dev/null +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-list/components/pricing-list-table/use-pricing-table-filters.tsx @@ -0,0 +1,18 @@ +import { useTranslation } from "react-i18next" + +import { Filter } from "../../../../../components/table/data-table" + +export const usePricingTableFilters = () => { + const { t } = useTranslation() + + const dateFilters: Filter[] = [ + { label: t("fields.createdAt"), key: "created_at" }, + { label: t("fields.updatedAt"), key: "updated_at" }, + ].map((f) => ({ + key: f.key, + label: f.label, + type: "date", + })) + + return dateFilters +} diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products-add/index.ts b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products-add/index.ts deleted file mode 100644 index a9b776ba7a..0000000000 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products-add/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { PricingProductsAdd as Component } from "./pricing-products-add" diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products-add/pricing-products-add.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products-add/pricing-products-add.tsx deleted file mode 100644 index 8c620e18fa..0000000000 --- a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products-add/pricing-products-add.tsx +++ /dev/null @@ -1,5 +0,0 @@ -import { RouteFocusModal } from "../../../components/route-modal" - -export const PricingProductsAdd = () => { - return -} diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products/index.ts b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products/index.ts new file mode 100644 index 0000000000..7a5bb785ef --- /dev/null +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products/index.ts @@ -0,0 +1 @@ +export { PricingProducts as Component } from "./pricing-products" diff --git a/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products/pricing-products.tsx b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products/pricing-products.tsx new file mode 100644 index 0000000000..6e77dd4289 --- /dev/null +++ b/packages/admin-next/dashboard/src/v2-routes/pricing/pricing-products/pricing-products.tsx @@ -0,0 +1,5 @@ +import { RouteFocusModal } from "../../../components/route-modal" + +export const PricingProducts = () => { + return Not Implemented Yet +} diff --git a/packages/types/src/http/customer/admin/customer.ts b/packages/types/src/http/customer/admin/customer.ts index 085abffe80..aef4f5d0d0 100644 --- a/packages/types/src/http/customer/admin/customer.ts +++ b/packages/types/src/http/customer/admin/customer.ts @@ -7,6 +7,9 @@ export interface CustomerGroupResponse { id: string name: string | null customers: CustomerResponse[] + metadata: Record | null + created_at: string + updated_at: string } /**