diff --git a/.changeset/fair-hats-hammer.md b/.changeset/fair-hats-hammer.md new file mode 100644 index 0000000000..ed94239583 --- /dev/null +++ b/.changeset/fair-hats-hammer.md @@ -0,0 +1,5 @@ +--- +"@medusajs/admin-ui": patch +--- + +fix(medusa, admin-ui): Fix edit order variant stock diff --git a/packages/admin-ui/package.json b/packages/admin-ui/package.json index a4e1b4a3e5..d972fd0c60 100644 --- a/packages/admin-ui/package.json +++ b/packages/admin-ui/package.json @@ -50,6 +50,7 @@ "emoji-picker-react": "^4.4.3", "framer-motion": "^9.1.6", "medusa-react": "*", + "pluralize": "^8.0.0", "postcss": "^8.4.21", "query-string": "^8.1.0", "react": "^18.2.0", @@ -81,6 +82,7 @@ "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.4.3", + "@types/pluralize": "^0.0.29", "@types/react": "^18.0.27", "@types/react-dom": "^18.0.10", "@types/react-table": "^7.7.9", diff --git a/packages/admin-ui/ui/src/domain/orders/edit/variants-table.tsx b/packages/admin-ui/ui/src/domain/orders/edit/variants-table.tsx index e82e8b21df..1ae45b475a 100644 --- a/packages/admin-ui/ui/src/domain/orders/edit/variants-table.tsx +++ b/packages/admin-ui/ui/src/domain/orders/edit/variants-table.tsx @@ -1,15 +1,18 @@ -import { useAdminVariants } from "medusa-react" +import { useAdminVariants, useAdminVariantsInventory } from "medusa-react" import React, { useEffect, useMemo, useState } from "react" import { usePagination, useRowSelect, useTable } from "react-table" -import { ProductVariant } from "@medusajs/medusa" +import { InventoryLevelDTO, ProductVariant } from "@medusajs/medusa" import clsx from "clsx" - +import pluralize from "pluralize" import { useDebounce } from "../../../hooks/use-debounce" import ImagePlaceholder from "../../../components/fundamentals/image-placeholder" import Table from "../../../components/molecules/table" import IndeterminateCheckbox from "../../../components/molecules/indeterminate-checkbox" import { formatAmountWithSymbol } from "../../../utils/prices" import TableContainer from "../../../components/organisms/table-container" +import Tooltip from "../../../components/atoms/tooltip" +import useStockLocations from "../../../hooks/use-stock-locations" +import Skeleton from "../../../components/atoms/skeleton" const PAGE_SIZE = 12 @@ -46,6 +49,59 @@ const VariantsTable: React.FC = (props) => { } }, [count]) + const VariantInventoryCell = ({ row: { original } }) => { + const { getLocationNameById } = useStockLocations() + + const { variant, isLoading } = useAdminVariantsInventory(original.id) + + if (isLoading) { + return ( +
+ +
+ +
+ ) + } + + if (!isLoading && (!variant || !variant.inventory)) { + return
{original.inventory_quantity}
+ } + + const { inventory } = variant + + const total = inventory[0].location_levels.reduce( + (sum: number, location_level: InventoryLevelDTO) => + (sum += location_level.stocked_quantity), + 0 + ) + + const LocationTooltip = ( + <> + {inventory[0].location_levels.map( + (location_level: InventoryLevelDTO) => ( +
+ + {location_level.stocked_quantity} + + {" in "} + {getLocationNameById(location_level.location_id)} +
+ ) + )} + + ) + + return ( + +
+ {total} in {inventory[0].location_levels.length}{" "} + {pluralize("location", inventory[0].location_levels.length)} +
+
+ ) + } + const columns = useMemo(() => { return [ { @@ -103,9 +159,7 @@ const VariantsTable: React.FC = (props) => {
), accessor: "inventory_quantity", - Cell: ({ row: { original } }) => ( -
{original.inventory_quantity}
- ), + Cell: VariantInventoryCell, }, { Header: ( diff --git a/yarn.lock b/yarn.lock index b796d313be..c103530e70 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5633,6 +5633,7 @@ __metadata: "@testing-library/jest-dom": ^5.16.5 "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.4.3 + "@types/pluralize": ^0.0.29 "@types/react": ^18.0.27 "@types/react-dom": ^18.0.10 "@types/react-table": ^7.7.9 @@ -5643,6 +5644,7 @@ __metadata: emoji-picker-react: ^4.4.3 framer-motion: ^9.1.6 medusa-react: "*" + pluralize: ^8.0.0 postcss: ^8.4.21 query-string: ^8.1.0 react: ^18.2.0 @@ -11372,6 +11374,13 @@ __metadata: languageName: node linkType: hard +"@types/pluralize@npm:^0.0.29": + version: 0.0.29 + resolution: "@types/pluralize@npm:0.0.29" + checksum: 840796fa1db158eb4d9787758d134736e29d9a8035f5b0cbad06e3801fc64b79112ba944c83f9a1a5b94da08703f505b8315b7e0f28bfc0f8e9e1ccfead7b083 + languageName: node + linkType: hard + "@types/prettier@npm:^1.19.0": version: 1.19.1 resolution: "@types/prettier@npm:1.19.1"