[KHP3-6546 ] Implement ability to move patient from procedure to new queue

src/common/groupedOrdersTable.component.tsx

@@ -27,13 +27,14 @@
 import ListOrderDetails from "./listOrderDetails.component";
 import Overlay from "../components/overlay/overlay.component";
 import { GroupedOrdersTableProps, OrderStatusFilterType } from "../types";
+import TransitionLatestQueueEntryButton from "../procedures-ordered/transition-patient-new-queue/transition-latest-queue-entry-button.component";
 
 //  render Grouped by patient Orders in procedures app
 const GroupedOrdersTable: React.FC<GroupedOrdersTableProps> = (props) => {
   const workListEntries = props.orders;
   const { t } = useTranslation();
   const [currentPageSize, setCurrentPageSize] = useState<number>(10);
   const [searchString, setSearchString] = useState<string>("");
   const [activatedOnOrAfterDate, setActivatedOnOrAfterDate] = useState("");
 
   const OrderStatuses = [
@@ -102,13 +103,26 @@
       patientName: patient.orders[0].patient?.display?.split("-")[1],
       orders: patient.orders,
       totalOrders: patient.orders?.length,
+      fulfillerStatus: patient.orders[0].fulfillerStatus,
+      action:
+        patient.orders[0].fulfillerStatus === "COMPLETED" ? (
+          <TransitionLatestQueueEntryButton patientUuid={patient.patientId} />
+        ) : null,
     }));
   }, [paginatedResults]);
 
+  const showActionColumn = filteredEntries.some(
+    (order) => order.fulfillerStatus === "COMPLETED"
+  );
+
   const tableColumns = [
-    { id: 0, header: t("patient", "Patient"), key: "patientName" },
+    { id: 0, header: t("patientName", "Patient Name"), key: "patientName" },
     { id: 1, header: t("totalorders", "Total Orders"), key: "totalOrders" },
+    ...(showActionColumn
+      ? [{ id: 2, header: t("action", "Action"), key: "action" }]
+      : []),
   ];
+
   return (
     <div>
       <DataTable

src/config-schema.ts

@@ -4,7 +4,7 @@ export const configSchema = {
   procedureOrderTypeUuid: {
     _type: Type.String,
     _description: "Procedure Order type UUID",
-    _default: "4237a01f-29c5-4167-9d8e-96d6e590aa33",
+    _default: "b4a7c280-369e-4d12-9ce8-18e36783fed6",
   },
   procedureConceptSetUuid: {
     _type: Type.String,

src/procedures-ordered/transition-patient-new-queue/transition-latest-queue-entry-button.component.tsx

@@ -0,0 +1,37 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+import styles from "./transition-latest-queue-entry-button.scss";
+import { showModal } from "@openmrs/esm-framework";
+import { Button } from "@carbon/react";
+import { AirlineManageGates } from "@carbon/react/icons";
+
+interface TransitionLatestQueueEntryButtonProps {
+  patientUuid: string;
+}
+
+const TransitionLatestQueueEntryButton: React.FC<
+  TransitionLatestQueueEntryButtonProps
+> = ({ patientUuid }) => {
+  const { t } = useTranslation();
+
+  const launchModal = () => {
+    const dispose = showModal("transition-patient-to-latest-queue-modal", {
+      closeModal: () => dispose(),
+      patientUuid,
+    });
+  };
+
+  return (
+    <Button
+      kind="tertiary"
+      className={styles.addPatientToQueue}
+      onClick={launchModal}
+      size="sm"
+      renderIcon={() => <AirlineManageGates size={18} />}
+    >
+      {t("transition", "Transition")}
+    </Button>
+  );
+};
+
+export default TransitionLatestQueueEntryButton;

src/procedures-ordered/transition-patient-new-queue/transition-latest-queue-entry-button.scss

@@ -0,0 +1,13 @@
+@use '@carbon/layout';
+@use '@carbon/styles/scss/type';
+
+.addPatientToQueue {
+  --cds-layout-size-height-context: var(--cds-layout-size-height-sm, 2rem);
+  --cds-layout-size-height: var(--cds-layout-size-height-context);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  padding: 0 layout.$spacing-04;
+  gap: layout.$spacing-05;
+}