diff --git a/.changeset/cool-boats-taste.md b/.changeset/cool-boats-taste.md new file mode 100644 index 00000000000..1feacf772ae --- /dev/null +++ b/.changeset/cool-boats-taste.md @@ -0,0 +1,5 @@ +--- +"saleor-dashboard": patch +--- + +You can now see Add discount align with rest of content diff --git a/src/components/ButtonLink/ButtonLink.tsx b/src/components/ButtonLink/ButtonLink.tsx new file mode 100644 index 00000000000..6b89dc18af9 --- /dev/null +++ b/src/components/ButtonLink/ButtonLink.tsx @@ -0,0 +1,50 @@ +import { Button, ButtonProps, vars } from "@saleor/macaw-ui-next"; +import React from "react"; + +interface ButtonLinkProps extends ButtonProps { + children: React.ReactNode; + onClick?: React.MouseEventHandler; + underline?: boolean; +} + +export const ButtonLink = ({ + children, + disabled, + onClick, + underline, + ...props +}: ButtonLinkProps) => { + const color = disabled ? vars.colors.text.defaultDisabled : vars.colors.text.accent1; + + const handleClick = (event: React.MouseEvent) => { + if (disabled || !onClick) { + return; + } + + onClick(event); + }; + + return ( + + ); +}; diff --git a/src/components/ButtonLink/index.ts b/src/components/ButtonLink/index.ts new file mode 100644 index 00000000000..bfbbd40bc9d --- /dev/null +++ b/src/components/ButtonLink/index.ts @@ -0,0 +1 @@ +export * from "./ButtonLink"; diff --git a/src/orders/components/OrderDraftDetailsSummary/OrderDraftDetailsSummary.tsx b/src/orders/components/OrderDraftDetailsSummary/OrderDraftDetailsSummary.tsx index 5e881f4c3da..b630a93b186 100644 --- a/src/orders/components/OrderDraftDetailsSummary/OrderDraftDetailsSummary.tsx +++ b/src/orders/components/OrderDraftDetailsSummary/OrderDraftDetailsSummary.tsx @@ -1,6 +1,6 @@ // @ts-strict-ignore +import { ButtonLink } from "@dashboard/components/ButtonLink"; import HorizontalSpacer from "@dashboard/components/HorizontalSpacer"; -import Link from "@dashboard/components/Link"; import Money from "@dashboard/components/Money"; import { DiscountValueTypeEnum, @@ -13,7 +13,7 @@ import { getFormErrors } from "@dashboard/utils/errors"; import getOrderErrorMessage from "@dashboard/utils/errors/order"; import { Typography } from "@material-ui/core"; import { makeStyles } from "@saleor/macaw-ui"; -import { Box, Button, Popover, sprinkles } from "@saleor/macaw-ui-next"; +import { Box, Popover, sprinkles } from "@saleor/macaw-ui-next"; import React from "react"; import { useIntl } from "react-intl"; @@ -123,16 +123,16 @@ const OrderDraftDetailsSummary: React.FC = props }; const getShippingMethodComponent = () => { if (hasChosenShippingMethod) { - return {`${shippingMethodName}`}; + return {`${shippingMethodName}`}; } const shippingCarrierBase = intl.formatMessage(messages.addShippingCarrier); if (shippingAddress) { return ( - + {shippingCarrierBase} - + ); } @@ -140,9 +140,9 @@ const OrderDraftDetailsSummary: React.FC = props return (
- + {shippingCarrierBase} - + {`(${addShippingAddressInfo})`}
@@ -156,9 +156,11 @@ const OrderDraftDetailsSummary: React.FC = props - + + + {intl.formatMessage(discountTitle)} + +