(refactor) O3-3839 Allowing of printing lab request

openmrs · Oct 16, 2024 · a1bf425 · a1bf425
1 parent c49d112
commit a1bf425
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 20 deletions.
diff --git a/packages/esm-patient-orders-app/src/components/order-details-table.scss b/packages/esm-patient-orders-app/src/components/order-details-table.scss
@@ -161,3 +161,7 @@
 .helperText {
   @include type.type-style('helper-text-02');
 }
+
+.printButton {
+  margin-left: 1.25rem;
+}
diff --git a/packages/esm-patient-orders-app/src/components/orders-details-table.component.tsx b/packages/esm-patient-orders-app/src/components/orders-details-table.component.tsx
@@ -255,15 +255,15 @@ const OrderDetailsTable: React.FC<OrderDetailsProps> = ({ patientUuid, showAddBu
     if (isPrinting && onBeforeGetContentResolve.current) {
       onBeforeGetContentResolve.current();
     }
-  }, [isPrinting, onBeforeGetContentResolve]);
+  }, [isPrinting]);
 
   const handlePrint = useReactToPrint({
     content: () => contentToPrintRef.current,
     documentTitle: `OpenMRS - ${patientDetails.name} - ${title}`,
-    onBeforeGetContent: () =>
+    onBeforeGetContent: (): Promise<void> =>
       new Promise((resolve) => {
-        if (patient && patient?.patient && title) {
-          onBeforeGetContentResolve.current = resolve;
+        if (patient && title) {
+          onBeforeGetContentResolve.current = resolve();
           setIsPrinting(true);
         }
       }),
@@ -347,8 +347,8 @@ const OrderDetailsTable: React.FC<OrderDetailsProps> = ({ patientUuid, showAddBu
                       {showPrintButton && (
                         <Button
                           kind="ghost"
-                          renderIcon={(props) => <PrinterIcon {...props} size={16} />}
-                          iconDescription={t('print', 'Print')}
+                          renderIcon={PrinterIcon}
+                          iconDescription="Add vitals"
                           className={styles.printButton}
                           onClick={handlePrint}
                         >
@@ -358,7 +358,7 @@ const OrderDetailsTable: React.FC<OrderDetailsProps> = ({ patientUuid, showAddBu
                       {showAddButton && (
                         <Button
                           kind="ghost"
-                          renderIcon={(props) => <AddIcon {...props} size={16} />}
+                          renderIcon={AddIcon}
                           iconDescription={t('launchOrderBasket', 'Launch order basket')}
                           onClick={launchOrderBasket}
                         >
@@ -392,18 +392,20 @@ const OrderDetailsTable: React.FC<OrderDetailsProps> = ({ patientUuid, showAddBu
                       }) => (
                         <>
                           <TableContainer {...getTableContainerProps}>
-                            <div className={styles.toolBarContent}>
-                              <TableToolbarContent>
-                                <Layer>
-                                  <Search
-                                    expanded
-                                    onChange={onInputChange}
-                                    placeholder={t('searchTable', 'Search table')}
-                                    size="lg"
-                                  />
-                                </Layer>
-                              </TableToolbarContent>
-                            </div>
+                            {!isPrinting && (
+                              <div className={styles.toolBarContent}>
+                                <TableToolbarContent>
+                                  <Layer>
+                                    <Search
+                                      expanded
+                                      onChange={onInputChange}
+                                      placeholder={t('searchTable', 'Search table')}
+                                      size="lg"
+                                    />
+                                  </Layer>
+                                </TableToolbarContent>
+                              </div>
+                            )}
                             <Table className={styles.table} {...getTableProps()}>
                               <TableHead>
                                 <TableRow>

diff --git a/packages/esm-patient-orders-app/src/config-schema.ts b/packages/esm-patient-orders-app/src/config-schema.ts
@@ -6,8 +6,15 @@ export const configSchema = {
     _description: 'The encounter type of the encounter encapsulating orders',
     _default: '39da3525-afe4-45ff-8977-c53b7b359158',
   },
+  showPrintButton: {
+    _type: Type.Boolean,
+    _default: false,
+    _description:
+      'Determines whether or not to display the Print button in the orders. If set to true, a Print button gets shown in both the orders table headers. When clicked, this button enables the user to print out the contents of the table',
+  },
 };
 
 export interface ConfigObject {
   orderEncounterType: string;
+  showPrintButton: boolean;
 }
diff --git a/packages/esm-patient-orders-app/src/orders-summary/orders-summary.component.tsx b/packages/esm-patient-orders-app/src/orders-summary/orders-summary.component.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 import OrderDetailsTable from '../components/orders-details-table.component';
+import { type ConfigObject, useConfig } from '@openmrs/esm-framework';
 
 export interface OrdersSummaryProps {
   patientUuid: string;
@@ -9,10 +10,16 @@ export interface OrdersSummaryProps {
 const OrdersSummary: React.FC<OrdersSummaryProps> = ({ patientUuid }) => {
   const { t } = useTranslation();
   const ordersDisplayText = t('orders', 'Orders');
+  const { showPrintButton } = useConfig<ConfigObject>();
 
   return (
     <div style={{ marginBottom: '1.5rem' }}>
-      <OrderDetailsTable patientUuid={patientUuid} showAddButton showPrintButton={false} title={ordersDisplayText} />
+      <OrderDetailsTable
+        patientUuid={patientUuid}
+        showAddButton
+        showPrintButton={showPrintButton}
+        title={ordersDisplayText}
+      />
     </div>
   );
 };