Merge pull request #445 from commercelayer/fix/line-items-external-price

Allow line_items update using external_price

Author: acasazza

packages/react-components/src/components/line_items/LineItemQuantity.tsx

@@ -16,11 +16,16 @@ type Props = {
   max?: number
   disabled?: boolean
   readonly?: boolean
+  /**
+   * force the update of the line item price using `_external_price: true` attribute
+   * @link https://docs.commercelayer.io/core/external-resources/external-prices
+   */
+  hasExternalPrice?: boolean
 } & (Omit<JSX.IntrinsicElements['select'], 'children'> &
   Omit<JSX.IntrinsicElements['span'], 'children'>)
 
 export function LineItemQuantity(props: Props): JSX.Element {
-  const { max = 50, readonly = false, ...p } = props
+  const { max = 50, readonly = false, hasExternalPrice, ...p } = props
   const { lineItem } = useContext(LineItemChildrenContext)
   const { updateLineItem } = useContext(LineItemContext)
   const options: ReactNode[] = []
@@ -33,7 +38,9 @@ export function LineItemQuantity(props: Props): JSX.Element {
   }
   const handleChange = (e: React.ChangeEvent<HTMLSelectElement>): void => {
     const quantity = Number(e.target.value)
-    if (updateLineItem && lineItem) void updateLineItem(lineItem.id, quantity)
+    if (updateLineItem && lineItem) {
+      void updateLineItem(lineItem.id, quantity, hasExternalPrice)
+    }
   }
   const quantity = lineItem?.quantity
   const parentProps = {

packages/react-components/src/components/line_items/LineItemsContainer.tsx

@@ -65,10 +65,11 @@ export function LineItemsContainer(props: Props): JSX.Element {
   const lineItemValue: LineItemContextValue = {
     ...state,
     loader,
-    updateLineItem: async (lineItemId, quantity = 1) => {
+    updateLineItem: async (lineItemId, quantity = 1, hasExternalPrice) => {
       await updateLineItem({
         lineItemId,
         quantity,
+        hasExternalPrice,
         dispatch,
         config,
         getOrder,

packages/react-components/src/reducers/LineItemReducer.ts

@@ -11,6 +11,7 @@ import getErrors from '#utils/getErrors'
 export interface UpdateLineItemParams {
   lineItemId: string
   quantity?: number
+  hasExternalPrice?: boolean
   dispatch: Dispatch<LineItemAction>
   config: CommerceLayerConfig
   getOrder: getOrderContext | undefined
@@ -41,7 +42,11 @@ export interface LineItemPayload {
 }
 
 export interface LineItemState extends LineItemPayload {
-  updateLineItem?: (lineItemId: string, quantity?: number) => Promise<void>
+  updateLineItem?: (
+    lineItemId: string,
+    quantity?: number,
+    hasExternalPrice?: boolean
+  ) => Promise<void>
   deleteLineItem?: (lineItemId: string) => Promise<void>
 }
 
@@ -95,10 +100,22 @@ export const getLineItems: GetLineItems = (params) => {
 export async function updateLineItem(
   params: UpdateLineItemParams
 ): Promise<void> {
-  const { config, lineItemId, quantity, getOrder, orderId, dispatch } = params
+  const {
+    config,
+    lineItemId,
+    quantity,
+    hasExternalPrice,
+    getOrder,
+    orderId,
+    dispatch
+  } = params
   const sdk = getSdk(config)
   try {
-    await sdk.line_items.update({ id: lineItemId, quantity })
+    await sdk.line_items.update({
+      id: lineItemId,
+      quantity,
+      _external_price: hasExternalPrice
+    })
     getOrder && (await getOrder(orderId))
     dispatch({
       type: 'setErrors',