Allow to copy and go to product details on order details datagrid (#3744)
This commit is contained in:
Paweł Chyła
GitHub
parent
3508852b4d
commit
2db64cd135
27 changed files with 230 additions and 71 deletions
|
|
@ -287,7 +287,7 @@ describe("Orders", () => {
|
|||
address,
|
||||
}).then(unconfirmedOrderResponse => {
|
||||
cy.visit(urlList.orders + `${unconfirmedOrderResponse.order.id}`);
|
||||
deleteProductFromGridTableOnIndex(0);
|
||||
deleteProductFromGridTableOnIndex(1);
|
||||
cy.contains(MESSAGES.noProductFound).should("be.visible");
|
||||
cy.get(ORDERS_SELECTORS.productDeleteFromRowButton).should("not.exist");
|
||||
});
|
||||
|
|
|
|||
|
|
@ -91,7 +91,7 @@ describe("Tests for pages", () => {
|
|||
`should create page with ${attributeType} attribute`,
|
||||
{ tags: ["@pages", "@allEnv", "@stable"] },
|
||||
() => {
|
||||
const randomName = `${startsWith}${faker.datatype.number()}`;
|
||||
const randomName = `AAA-${startsWith}${faker.datatype.number()}`;
|
||||
const attributeValues = [attributeValuesOnPage[attributeType]];
|
||||
createAttribute({
|
||||
name: randomName,
|
||||
|
|
|
|||
|
|
@ -121,7 +121,7 @@ describe("As an admin I should be able to create product", () => {
|
|||
fillUpPriceList(prices.sellingPrice);
|
||||
fillUpPriceList(prices.costPrice, priceInputLists.costPrice);
|
||||
cy.get(PRODUCT_DETAILS.skuInput)
|
||||
.type(randomName)
|
||||
.type(randomName, { force: true })
|
||||
.addAliasToGraphRequest("ProductDetails")
|
||||
.get(BUTTON_SELECTORS.confirm)
|
||||
.click()
|
||||
|
|
|
|||
|
|
@ -121,7 +121,8 @@ describe("Updating products without sku", () => {
|
|||
.get(SHARED_ELEMENTS.skeleton)
|
||||
.should("not.exist")
|
||||
.get(VARIANTS_SELECTORS.skuTextField)
|
||||
.type(sku)
|
||||
.scrollIntoView()
|
||||
.type(sku, { force: true })
|
||||
.addAliasToGraphRequest("VariantUpdate")
|
||||
.get(BUTTON_SELECTORS.confirm)
|
||||
.click()
|
||||
|
|
@ -157,7 +158,7 @@ describe("Updating products without sku", () => {
|
|||
.get(SHARED_ELEMENTS.skeleton)
|
||||
.should("not.exist")
|
||||
.get(VARIANTS_SELECTORS.skuTextField)
|
||||
.type(sku)
|
||||
.type(sku, { force: true })
|
||||
.addAliasToGraphRequest("VariantUpdate")
|
||||
.get(BUTTON_SELECTORS.confirm)
|
||||
.click()
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
export const AVAILABLE_CHANNELS_FORM = {
|
||||
manageChannelsButton: "[data-test-id='channels-availability-manage-button']",
|
||||
assignedChannels: "[data-test-id='expand-icon']",
|
||||
assignedChannels: "[data-test-id='channel-availability-item']",
|
||||
publishedRadioButtons: "[name*='isPublished'] > ",
|
||||
availableForPurchaseRadioButtons: "[id*='isAvailableForPurchase']",
|
||||
radioButtonsValueTrue: "[value='true']",
|
||||
|
|
|
|||
|
|
@ -9,16 +9,17 @@ export const ORDERS_SELECTORS = {
|
|||
orderFulfillmentFrame: "[data-test-id='order-fulfillment']",
|
||||
refundButton: '[data-test-id="refund-button"]',
|
||||
fulfillMenuButton: '[data-test-id="fulfill-menu"]',
|
||||
priceCellFirstRowOrderDetails: "[id='glide-cell-4-0']",
|
||||
priceCellFirstRowOrderDetails: "[id='glide-cell-5-0']",
|
||||
productNameSecondRowOrderDetails: "[id='glide-cell-1-1']",
|
||||
quantityCellFirstRowOrderDetails: "[id='glide-cell-3-0']",
|
||||
quantityCellFirstRowOrderDetails: "[id='glide-cell-4-0']",
|
||||
gridClip: "[class='clip-region']",
|
||||
discountFixedPriceButton: '[data-test-id="FIXED"]',
|
||||
discountAmountField: '[data-test-id="price-field"]',
|
||||
discountReasonField: '[data-test-id="discount-reason"]',
|
||||
orderSummarySubtotalPriceRow: '[data-test-id="order-subtotal-price"]',
|
||||
orderSummaryTotalPriceRow: '[data-test-id="order-total-price"]',
|
||||
dataGridTable: "[data-testid='data-grid-canvas']",
|
||||
productDeleteFromRowButton: "[data-test-id='row-action-button']",
|
||||
productDeleteFromRowButton: "[data-test-id='delete-order-line']",
|
||||
markAsPaidButton: '[data-test-id="markAsPaidButton"]',
|
||||
grantRefundButton: '[data-test-id="grantRefundButton"]',
|
||||
transactionReferenceInput: '[data-test-id="transaction-reference-input"]',
|
||||
|
|
|
|||
|
|
@ -84,7 +84,7 @@ export function fillUpAllCommonFieldsInCreateAndUpdate({
|
|||
export function fillUpProductGeneralInfo({ name, description, rating }) {
|
||||
return cy
|
||||
.get(PRODUCT_DETAILS.productNameInput)
|
||||
.click()
|
||||
.click({ force: true })
|
||||
.clearAndType(name)
|
||||
.get(PRODUCT_DETAILS.descriptionInput)
|
||||
.clearAndType(description)
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import {
|
||||
ADD_PRODUCT_TO_ORDER_DIALOG,
|
||||
BUTTON_SELECTORS,
|
||||
CHANNEL_FORM_SELECTORS,
|
||||
DRAFT_ORDER_SELECTORS,
|
||||
ORDERS_SELECTORS,
|
||||
|
|
@ -32,22 +33,31 @@ export function applyFixedLineDiscountForProduct(
|
|||
.waitForRequestAndCheckIfNoErrors("@OrderLineDiscountUpdate");
|
||||
}
|
||||
export function changeQuantityOfProducts() {
|
||||
cy.addAliasToGraphRequest("OrderLineUpdate");
|
||||
cy.get(ORDERS_SELECTORS.dataGridTable).should("be.visible");
|
||||
cy.get(ORDERS_SELECTORS.quantityCellFirstRowOrderDetails)
|
||||
.dblclick({ force: true })
|
||||
.type("2", { force: true });
|
||||
cy.addAliasToGraphRequest("OrderLineUpdate")
|
||||
// grid expects focus to be dismissed from cell - because of that extra action needed which blur focus from cell (other more elegant build in actions was not working)
|
||||
.get(SHARED_ELEMENTS.pageHeader)
|
||||
.click({ force: true })
|
||||
.wait(200)
|
||||
.click({ force: true })
|
||||
.wait(1000);
|
||||
cy.get(ORDERS_SELECTORS.gridClip)
|
||||
.find("input")
|
||||
.clear({ force: true })
|
||||
.type("2");
|
||||
|
||||
// grid expects focus to be dismissed from cell - because of that extra action needed which blur focus from cell (other more elegant build in actions was not working)
|
||||
cy.get(SHARED_ELEMENTS.pageHeader)
|
||||
.click()
|
||||
.waitForRequestAndCheckIfNoErrors("@OrderLineUpdate");
|
||||
}
|
||||
export function deleteProductFromGridTableOnIndex(trIndex = 0) {
|
||||
cy.get(ORDERS_SELECTORS.dataGridTable).should("be.visible");
|
||||
cy.addAliasToGraphRequest("OrderLineDelete")
|
||||
.get(ORDERS_SELECTORS.productDeleteFromRowButton)
|
||||
.get(BUTTON_SELECTORS.showMoreButton)
|
||||
.eq(trIndex)
|
||||
.click()
|
||||
.get(ORDERS_SELECTORS.productDeleteFromRowButton)
|
||||
.click()
|
||||
.wait("@OrderLineDelete");
|
||||
}
|
||||
export function addNewProductToOrder(productIndex = 0, variantIndex = 0) {
|
||||
|
|
|
|||
|
|
@ -61,6 +61,7 @@ export function addBooleanAttributeValue() {
|
|||
export function addNumericAttributeValue(attributeValue) {
|
||||
cy.get(PAGE_DETAILS_SELECTORS.numericAttributeValueInput).type(
|
||||
attributeValue,
|
||||
{ force: true },
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3632,6 +3632,9 @@
|
|||
"context": "button",
|
||||
"string": "Create Channel"
|
||||
},
|
||||
"OK5+Fh": {
|
||||
"string": "Variant"
|
||||
},
|
||||
"OKGd/k": {
|
||||
"context": "order history message",
|
||||
"string": "Order was created from draft"
|
||||
|
|
@ -4652,6 +4655,9 @@
|
|||
"context": "section header",
|
||||
"string": "Coming Soon"
|
||||
},
|
||||
"VYK2nN": {
|
||||
"string": "Product details"
|
||||
},
|
||||
"VZsE96": {
|
||||
"string": "Collection Name"
|
||||
},
|
||||
|
|
|
|||
14
package-lock.json
generated
14
package-lock.json
generated
|
|
@ -27,7 +27,7 @@
|
|||
"@material-ui/lab": "^4.0.0-alpha.61",
|
||||
"@material-ui/styles": "^4.11.4",
|
||||
"@reach/auto-id": "^0.16.0",
|
||||
"@saleor/macaw-ui": "0.8.0-pre.90",
|
||||
"@saleor/macaw-ui": "0.8.0-pre.96",
|
||||
"@saleor/sdk": "0.6.0",
|
||||
"@sentry/react": "^6.0.0",
|
||||
"@types/faker": "^5.1.6",
|
||||
|
|
@ -7950,9 +7950,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@saleor/macaw-ui": {
|
||||
"version": "0.8.0-pre.90",
|
||||
"resolved": "https://registry.npmjs.org/@saleor/macaw-ui/-/macaw-ui-0.8.0-pre.90.tgz",
|
||||
"integrity": "sha512-V3x2HR/piQOaH+X/5OTFZPNJmW0HONUspXSAKfwckMPBiZ4upOg+zbqCaUvkq8Bb+qGD0J4FTwptQuW89LvrCw==",
|
||||
"version": "0.8.0-pre.96",
|
||||
"resolved": "https://registry.npmjs.org/@saleor/macaw-ui/-/macaw-ui-0.8.0-pre.96.tgz",
|
||||
"integrity": "sha512-uPVodJvUcmtz+pXAGZUZ87TZl77bx2Qt1y2jKLqZTzQGeKmqDwRDPCb0Qcb4TI7fDN93W0hFqpGIpoZm5DcbVQ==",
|
||||
"dependencies": {
|
||||
"@dessert-box/react": "^0.4.0",
|
||||
"@floating-ui/react-dom-interactions": "^0.5.0",
|
||||
|
|
@ -41317,9 +41317,9 @@
|
|||
}
|
||||
},
|
||||
"@saleor/macaw-ui": {
|
||||
"version": "0.8.0-pre.90",
|
||||
"resolved": "https://registry.npmjs.org/@saleor/macaw-ui/-/macaw-ui-0.8.0-pre.90.tgz",
|
||||
"integrity": "sha512-V3x2HR/piQOaH+X/5OTFZPNJmW0HONUspXSAKfwckMPBiZ4upOg+zbqCaUvkq8Bb+qGD0J4FTwptQuW89LvrCw==",
|
||||
"version": "0.8.0-pre.96",
|
||||
"resolved": "https://registry.npmjs.org/@saleor/macaw-ui/-/macaw-ui-0.8.0-pre.96.tgz",
|
||||
"integrity": "sha512-uPVodJvUcmtz+pXAGZUZ87TZl77bx2Qt1y2jKLqZTzQGeKmqDwRDPCb0Qcb4TI7fDN93W0hFqpGIpoZm5DcbVQ==",
|
||||
"requires": {
|
||||
"@dessert-box/react": "^0.4.0",
|
||||
"@floating-ui/react-dom-interactions": "^0.5.0",
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@
|
|||
"@material-ui/lab": "^4.0.0-alpha.61",
|
||||
"@material-ui/styles": "^4.11.4",
|
||||
"@reach/auto-id": "^0.16.0",
|
||||
"@saleor/macaw-ui": "0.8.0-pre.90",
|
||||
"@saleor/macaw-ui": "0.8.0-pre.96",
|
||||
"@saleor/sdk": "0.6.0",
|
||||
"@sentry/react": "^6.0.0",
|
||||
"@types/faker": "^5.1.6",
|
||||
|
|
|
|||
|
|
@ -35,6 +35,8 @@ export interface CardMenuProps {
|
|||
outlined?: boolean;
|
||||
Icon?: React.ElementType<{}>;
|
||||
IconButtonProps?: IconButtonProps;
|
||||
autoFocusItem?: boolean;
|
||||
showMenuIcon?: boolean;
|
||||
}
|
||||
|
||||
const useStyles = makeStyles(
|
||||
|
|
@ -77,6 +79,8 @@ const CardMenu: React.FC<CardMenuProps> = props => {
|
|||
outlined,
|
||||
Icon: icon,
|
||||
IconButtonProps = {},
|
||||
autoFocusItem = true,
|
||||
showMenuIcon = false,
|
||||
...rest
|
||||
} = props;
|
||||
const classes = useStyles(props);
|
||||
|
|
@ -171,7 +175,7 @@ const CardMenu: React.FC<CardMenuProps> = props => {
|
|||
<Paper className={classes.paper} elevation={8}>
|
||||
<ClickAwayListener onClickAway={handleClose}>
|
||||
<MenuList
|
||||
autoFocusItem={open}
|
||||
autoFocusItem={autoFocusItem && open}
|
||||
id="menu-list-grow"
|
||||
onKeyDown={handleListKeyDown}
|
||||
>
|
||||
|
|
@ -198,7 +202,9 @@ const CardMenu: React.FC<CardMenuProps> = props => {
|
|||
<CircularProgress size={24} />
|
||||
</>
|
||||
) : (
|
||||
<Typography>{menuItem.label}</Typography>
|
||||
<Typography>
|
||||
{showMenuIcon && menuItem.Icon} {menuItem.label}
|
||||
</Typography>
|
||||
)}
|
||||
</div>
|
||||
</MenuItem>
|
||||
|
|
|
|||
|
|
@ -37,6 +37,8 @@ export const RowActions = ({ menuItems, disabled }: RowActionsProps) => {
|
|||
) : (
|
||||
<CardMenu
|
||||
disabled={disabled}
|
||||
autoFocusItem={false}
|
||||
showMenuIcon={true}
|
||||
Icon={MoreHorizontalIcon}
|
||||
IconButtonProps={{
|
||||
className: classes.ghostIcon,
|
||||
|
|
|
|||
|
|
@ -17,6 +17,8 @@ interface NumberCellProps {
|
|||
|
||||
export type NumberCell = CustomCell<NumberCellProps>;
|
||||
|
||||
const onlyDigitsRegExp = /^\d+$/;
|
||||
|
||||
const NumberCellEdit: ReturnType<ProvideEditorCallback<NumberCell>> = ({
|
||||
value: cell,
|
||||
onChange,
|
||||
|
|
@ -69,8 +71,14 @@ export const numberCellRenderer = (
|
|||
},
|
||||
}),
|
||||
}),
|
||||
onPaste: (value, data) => ({
|
||||
...data,
|
||||
value: value ? parseFloat(value) : numberCellEmptyValue,
|
||||
}),
|
||||
onPaste: (value, data) => {
|
||||
if (!onlyDigitsRegExp.test(value)) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return {
|
||||
...data,
|
||||
value: value ? parseFloat(value) : numberCellEmptyValue,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
|||
|
|
@ -123,7 +123,6 @@ const useStyles = makeStyles(
|
|||
border: `1px solid ${vars.colors.border.neutralHighlight}`,
|
||||
borderLeft: "none",
|
||||
borderRight: "none",
|
||||
cursor: "pointer",
|
||||
color: vars.colors.foreground.iconNeutralPlain,
|
||||
marginLeft: -1,
|
||||
display: "flex",
|
||||
|
|
|
|||
|
|
@ -84,6 +84,7 @@ export const fragmentOrderLine = gql`
|
|||
}
|
||||
variant {
|
||||
id
|
||||
name
|
||||
quantityAvailable
|
||||
preorder {
|
||||
endDate
|
||||
|
|
|
|||
|
|
@ -1567,6 +1567,7 @@ export const OrderLineFragmentDoc = gql`
|
|||
}
|
||||
variant {
|
||||
id
|
||||
name
|
||||
quantityAvailable
|
||||
preorder {
|
||||
endDate
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -6,11 +6,15 @@ import {
|
|||
useDatagridChangeState,
|
||||
} from "@dashboard/components/Datagrid/hooks/useDatagridChange";
|
||||
import { OrderLineFragment } from "@dashboard/graphql";
|
||||
import React from "react";
|
||||
import { productPath } from "@dashboard/products/urls";
|
||||
import { ExternalLinkIcon } from "@saleor/macaw-ui/next";
|
||||
import React, { useCallback } from "react";
|
||||
import { useIntl } from "react-intl";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
import { messages } from "../OrderListDatagrid/messages";
|
||||
import { messages as orderMessages } from "../OrderListDatagrid/messages";
|
||||
import { useColumns, useGetCellContent } from "./datagrid";
|
||||
import { messages } from "./messages";
|
||||
|
||||
interface OrderDetailsDatagridProps {
|
||||
lines: OrderLineFragment[];
|
||||
|
|
@ -43,19 +47,36 @@ export const OrderDetailsDatagrid = ({
|
|||
loading,
|
||||
});
|
||||
|
||||
const getMenuItems = useCallback(
|
||||
index => [
|
||||
{
|
||||
label: intl.formatMessage(messages.productDetails),
|
||||
Icon: (
|
||||
<Link
|
||||
to={productPath(lines[index].variant.product.id)}
|
||||
target="_blank"
|
||||
>
|
||||
<ExternalLinkIcon />
|
||||
</Link>
|
||||
),
|
||||
onSelect: () => false,
|
||||
},
|
||||
],
|
||||
[intl, lines],
|
||||
);
|
||||
|
||||
return (
|
||||
<DatagridChangeStateContext.Provider value={datagrid}>
|
||||
<Datagrid
|
||||
readonly
|
||||
showEmptyDatagrid
|
||||
rowMarkers="none"
|
||||
columnSelect="single"
|
||||
freezeColumns={1}
|
||||
availableColumns={columns}
|
||||
emptyText={intl.formatMessage(messages.emptyText)}
|
||||
emptyText={intl.formatMessage(orderMessages.emptyText)}
|
||||
getCellContent={getCellContent}
|
||||
getCellError={() => false}
|
||||
menuItems={() => []}
|
||||
menuItems={getMenuItems}
|
||||
rows={loading ? 1 : lines.length}
|
||||
selectionActions={() => null}
|
||||
onColumnResize={onColumnResize}
|
||||
|
|
|
|||
|
|
@ -29,6 +29,11 @@ export const useColumns = (): AvailableColumn[] => {
|
|||
title: intl.formatMessage(columnsMessages.sku),
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
id: "variantName",
|
||||
title: intl.formatMessage(columnsMessages.variantName),
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
id: "quantity",
|
||||
title: intl.formatMessage(columnsMessages.quantity),
|
||||
|
|
@ -82,21 +87,26 @@ export const useGetCellContent = ({
|
|||
return thumbnailCell(
|
||||
rowData?.productName ?? "",
|
||||
rowData.thumbnail?.url ?? "",
|
||||
readonyOptions,
|
||||
);
|
||||
case "sku":
|
||||
return readonlyTextCell(rowData.productSku ?? "", false);
|
||||
case "variantName":
|
||||
return readonlyTextCell(rowData.variant.name ?? "", false);
|
||||
case "quantity":
|
||||
return readonlyTextCell(rowData.quantity.toString(), false);
|
||||
case "price":
|
||||
return moneyCell(
|
||||
rowData.unitPrice.gross.amount,
|
||||
rowData.unitPrice.gross.currency,
|
||||
readonyOptions,
|
||||
);
|
||||
|
||||
case "total":
|
||||
return moneyCell(
|
||||
rowData.totalPrice.gross.amount,
|
||||
rowData.totalPrice.gross.currency,
|
||||
readonyOptions,
|
||||
);
|
||||
|
||||
default:
|
||||
|
|
@ -108,3 +118,8 @@ export const useGetCellContent = ({
|
|||
|
||||
return getCellContent;
|
||||
};
|
||||
|
||||
const readonyOptions: Partial<GridCell> = {
|
||||
allowOverlay: false,
|
||||
readonly: true,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -6,6 +6,10 @@ export const columnsMessages = defineMessages({
|
|||
defaultMessage: "Product",
|
||||
description: "product name",
|
||||
},
|
||||
variantName: {
|
||||
id: "OK5+Fh",
|
||||
defaultMessage: "Variant",
|
||||
},
|
||||
sku: {
|
||||
id: "8J81ri",
|
||||
defaultMessage: "SKU",
|
||||
|
|
@ -27,3 +31,10 @@ export const columnsMessages = defineMessages({
|
|||
description: "order line total price",
|
||||
},
|
||||
});
|
||||
|
||||
export const messages = defineMessages({
|
||||
productDetails: {
|
||||
id: "VYK2nN",
|
||||
defaultMessage: "Product details",
|
||||
},
|
||||
});
|
||||
|
|
|
|||
|
|
@ -7,9 +7,16 @@ import {
|
|||
useDatagridChangeState,
|
||||
} from "@dashboard/components/Datagrid/hooks/useDatagridChange";
|
||||
import { OrderDetailsFragment, OrderErrorFragment } from "@dashboard/graphql";
|
||||
import { TrashBinIcon } from "@saleor/macaw-ui/next";
|
||||
import { productUrl } from "@dashboard/products/urls";
|
||||
import {
|
||||
Box,
|
||||
ExternalLinkIcon,
|
||||
sprinkles,
|
||||
TrashBinIcon,
|
||||
} from "@saleor/macaw-ui/next";
|
||||
import React, { useCallback } from "react";
|
||||
import { useIntl } from "react-intl";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
import { FormData } from "../OrderDraftDetailsProducts/OrderDraftDetailsProducts";
|
||||
import { useColumns, useGetCellContent } from "./datagrid";
|
||||
|
|
@ -54,8 +61,39 @@ export const OrderDraftDetailsDatagrid = ({
|
|||
const getMenuItems = useCallback(
|
||||
index => [
|
||||
{
|
||||
label: intl.formatMessage(messages.deleteOrder),
|
||||
Icon: <TrashBinIcon />,
|
||||
label: "",
|
||||
Icon: (
|
||||
<Link
|
||||
to={productUrl(lines[index]?.variant.product.id)}
|
||||
target="_blank"
|
||||
className={sprinkles({
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
gap: 2,
|
||||
})}
|
||||
>
|
||||
<ExternalLinkIcon />
|
||||
{intl.formatMessage(messages.productDetails)}
|
||||
</Link>
|
||||
),
|
||||
onSelect: () => false,
|
||||
},
|
||||
{
|
||||
label: "",
|
||||
Icon: (
|
||||
<Box
|
||||
data-test-id="delete-order-line"
|
||||
as="span"
|
||||
color="iconCriticalDefault"
|
||||
display="flex"
|
||||
alignItems="center"
|
||||
__marginLeft="-2px"
|
||||
gap={2}
|
||||
>
|
||||
<TrashBinIcon />
|
||||
{intl.formatMessage(messages.deleteOrder)}
|
||||
</Box>
|
||||
),
|
||||
onSelect: () => {
|
||||
onOrderLineRemove(lines[index].id);
|
||||
},
|
||||
|
|
@ -73,8 +111,8 @@ export const OrderDraftDetailsDatagrid = ({
|
|||
updates.map(({ data, column, row }) => {
|
||||
const orderId = lines[row].id;
|
||||
|
||||
if (column === "quantity" && data !== "") {
|
||||
return onOrderLineChange(orderId, { quantity: data });
|
||||
if (column === "quantity" && data.value !== "") {
|
||||
return onOrderLineChange(orderId, { quantity: data.value });
|
||||
}
|
||||
}),
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
import {
|
||||
moneyCell,
|
||||
moneyDiscountedCell,
|
||||
numberCell,
|
||||
readonlyTextCell,
|
||||
tagsCell,
|
||||
textCell,
|
||||
thumbnailCell,
|
||||
} from "@dashboard/components/Datagrid/customCells/cells";
|
||||
import { GetCellContentOpts } from "@dashboard/components/Datagrid/Datagrid";
|
||||
|
|
@ -43,6 +43,11 @@ export const useColumns = () => {
|
|||
title: "SKU",
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
id: "variantName",
|
||||
title: intl.formatMessage(columnsMessages.variantName),
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
id: "quantity",
|
||||
title: intl.formatMessage(columnsMessages.quantity),
|
||||
|
|
@ -121,7 +126,7 @@ export const useGetCellContent = ({
|
|||
},
|
||||
);
|
||||
case "quantity":
|
||||
return textCell(change || rowData.quantity.toString());
|
||||
return numberCell(change?.value || rowData.quantity);
|
||||
case "price":
|
||||
return moneyDiscountedCell(
|
||||
{
|
||||
|
|
@ -149,6 +154,8 @@ export const useGetCellContent = ({
|
|||
);
|
||||
case "sku":
|
||||
return readonlyTextCell(rowData?.productSku ?? "", false);
|
||||
case "variantName":
|
||||
return readonlyTextCell(rowData.variant.name ?? "", false);
|
||||
case "total":
|
||||
return moneyCell(
|
||||
rowData.totalPrice.gross.amount,
|
||||
|
|
|
|||
|
|
@ -10,6 +10,10 @@ export const columnsMessages = defineMessages({
|
|||
defaultMessage: "Quantity",
|
||||
description: "quantity of ordered products",
|
||||
},
|
||||
variantName: {
|
||||
id: "OK5+Fh",
|
||||
defaultMessage: "Variant",
|
||||
},
|
||||
price: {
|
||||
id: "32dfzI",
|
||||
defaultMessage: "Price",
|
||||
|
|
@ -27,6 +31,10 @@ export const messages = defineMessages({
|
|||
id: "Q1Uzbb",
|
||||
defaultMessage: "No products found",
|
||||
},
|
||||
productDetails: {
|
||||
id: "VYK2nN",
|
||||
defaultMessage: "Product details",
|
||||
},
|
||||
deleteOrder: {
|
||||
id: "LKD6fB",
|
||||
defaultMessage: "Remove product",
|
||||
|
|
|
|||
|
|
@ -1289,6 +1289,7 @@ export const order = (placeholder: string): OrderDetailsFragment => ({
|
|||
variant: {
|
||||
__typename: "ProductVariant",
|
||||
id: "dsfsfuhb",
|
||||
name: "XS",
|
||||
quantityAvailable: 10,
|
||||
preorder: null,
|
||||
product: {
|
||||
|
|
@ -1415,6 +1416,7 @@ export const order = (placeholder: string): OrderDetailsFragment => ({
|
|||
variant: {
|
||||
__typename: "ProductVariant",
|
||||
id: "dsfsfuhb",
|
||||
name: "XS",
|
||||
quantityAvailable: 10,
|
||||
preorder: null,
|
||||
product: {
|
||||
|
|
@ -1547,6 +1549,7 @@ export const order = (placeholder: string): OrderDetailsFragment => ({
|
|||
variant: {
|
||||
__typename: "ProductVariant",
|
||||
id: "dsfsfuhb",
|
||||
name: "Soft",
|
||||
quantityAvailable: 10,
|
||||
preorder: null,
|
||||
product: {
|
||||
|
|
@ -1656,6 +1659,7 @@ export const order = (placeholder: string): OrderDetailsFragment => ({
|
|||
variant: {
|
||||
__typename: "ProductVariant",
|
||||
id: "dsfsfuhb",
|
||||
name: "XXL",
|
||||
quantityAvailable: 10,
|
||||
preorder: null,
|
||||
product: {
|
||||
|
|
@ -1930,6 +1934,7 @@ export const draftOrder = (placeholder: string): OrderDetailsFragment => ({
|
|||
variant: {
|
||||
__typename: "ProductVariant",
|
||||
id: "dsfsfuhb",
|
||||
name: "Hard",
|
||||
quantityAvailable: 10,
|
||||
preorder: null,
|
||||
product: {
|
||||
|
|
@ -2039,6 +2044,7 @@ export const draftOrder = (placeholder: string): OrderDetailsFragment => ({
|
|||
variant: {
|
||||
__typename: "ProductVariant",
|
||||
id: "dsfsfuhb",
|
||||
name: "15-1337",
|
||||
quantityAvailable: 10,
|
||||
preorder: null,
|
||||
product: {
|
||||
|
|
|
|||
|
|
@ -538,6 +538,7 @@ describe("Get the total value of all replaced products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Milk 1",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
__typename: "ProductVariant",
|
||||
|
|
@ -647,6 +648,7 @@ describe("Get the total value of all replaced products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Milk 1",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -756,6 +758,7 @@ describe("Get the total value of all replaced products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6Mjg2",
|
||||
name: "Milk 2",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -871,6 +874,7 @@ describe("Get the total value of all replaced products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Milk 1",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -985,6 +989,7 @@ describe("Get the total value of all replaced products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Milk 1",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -1099,6 +1104,7 @@ describe("Get the total value of all replaced products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6Mjg2",
|
||||
name: "Milk 2",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -1213,6 +1219,7 @@ describe("Get the total value of all replaced products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Milk 3",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -1327,6 +1334,7 @@ describe("Get the total value of all replaced products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Milk 3",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -1575,6 +1583,7 @@ describe("Get the total value of all selected products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Digital Book",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -1684,6 +1693,7 @@ describe("Get the total value of all selected products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Digital Book",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -1793,6 +1803,7 @@ describe("Get the total value of all selected products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6Mjg2",
|
||||
name: "Digital Book",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -1908,6 +1919,7 @@ describe("Get the total value of all selected products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Digital Book",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -2022,6 +2034,7 @@ describe("Get the total value of all selected products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Digital Book",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -2136,6 +2149,7 @@ describe("Get the total value of all selected products", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6Mjg2",
|
||||
name: "Digital Book",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -2378,6 +2392,7 @@ describe("Merge repeated order lines of fulfillment lines", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Saleor Demo Product",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -2492,6 +2507,7 @@ describe("Merge repeated order lines of fulfillment lines", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6MzE3",
|
||||
name: "Saleor Demo Product",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
@ -2606,6 +2622,7 @@ describe("Merge repeated order lines of fulfillment lines", () => {
|
|||
],
|
||||
variant: {
|
||||
id: "UHJvZHVjdFZhcmlhbnQ6Mjg2",
|
||||
name: "Saleor Demo Product",
|
||||
quantityAvailable: 50,
|
||||
preorder: null,
|
||||
stocks: [
|
||||
|
|
|
|||
Loading…
Reference in a new issue