UI: overridden: Acquisition: Override OrderLineMiddleColumn in OrderLine

ui/src/overridableMapping.js

@@ -25,6 +25,7 @@ import { Identifiers } from "./overridden/frontsite/Document/DocumentDetails/Doc
 import { DocumentConference } from "./overridden/frontsite/Document/DocumentDetails/DocumentMetadataTabs/DocumentConference";
 import { DocumentItemsHeader } from "./overridden/frontsite/Document/DocumentDetails/DocumentItemsHeader";
 import { PaymentInformationGrid } from "./overridden/backoffice/PaymentInformation/PaymentInformation";
+import { OrderDetailsLine } from "./overridden/backoffice/Acquisition/OrderDetails";
 
 export const overriddenCmps = {
   "Backoffice.PatronDetails.Metadata": PatronMetadata,
@@ -52,4 +53,5 @@ export const overriddenCmps = {
   "DocumentConference.layout": DocumentConference,
   "DocumentDetails.DocumentItems.header": DocumentItemsHeader,
   "Backoffice.PaymentInformation": PaymentInformationGrid,
+  "Acquisition.OrderLine": OrderDetailsLine,
 };

ui/src/overridden/backoffice/Acquisition/OrderDetails.js

@@ -0,0 +1,40 @@
+import { OrderLine } from "@inveniosoftware/react-invenio-app-ils";
+import PropTypes from "prop-types";
+import React from "react";
+import { Icon, Item, Popup } from "semantic-ui-react";
+import { parametrize } from "react-overridable";
+
+export const OrderDetailsMiddleColumn = ({ line }) => {
+  return (
+    <>
+      <Item.Description>
+        <label>Copies ordered: </label>
+        {line.copies_ordered}
+      </Item.Description>
+      <Item.Description>
+        <label>Copies received: </label>
+        {line.copies_received || "-"}
+      </Item.Description>
+      <Item.Description>
+        <label>Payment mode: </label>
+        {line.payment_mode || "-"}
+      </Item.Description>
+      <Item.Description>
+        <label>TID ID: </label>
+        {line.inter_departmental_transaction_id || "-"}{" "}
+        <Popup
+          content="Inter departmental transaction ID"
+          trigger={<Icon name="info circle" />}
+        />
+      </Item.Description>
+    </>
+  );
+};
+
+OrderDetailsMiddleColumn.propTypes = {
+  line: PropTypes.object.isRequired,
+};
+
+export const OrderDetailsLine = parametrize(OrderLine, {
+  MiddleColumn: OrderDetailsMiddleColumn,
+});