5137.3 Requisition line edit + UI updates to line columns

client/packages/coldchain/src/Equipment/DetailView/UpdateStatusButton.tsx

@@ -145,7 +145,7 @@ export const UpdateStatusButtonComponent = ({
         nextButton={
           currentTab === Tabs.Status ? (
             <DialogButton
-              variant="next"
+              variant="next-and-ok"
               onClick={onNext}
               disabled={isInvalid()}
             />

client/packages/coldchain/src/Equipment/ImportAsset/EquipmentImportModal.tsx

@@ -255,7 +255,7 @@ export const EquipmentImportModal: FC<EquipmentImportModalProps> = ({
     <Modal
       okButton={
         <DialogButton
-          variant="next"
+          variant="next-and-ok"
           disabled={importNotReady}
           onClick={importAction}
         />

client/packages/common/src/hooks/useDialog/useDialog.stories.tsx

@@ -29,7 +29,7 @@ const Template: StoryFn = () => {
       <Modal
         title="Add Item"
         cancelButton={<DialogButton variant="cancel" onClick={onCancel} />}
-        nextButton={<DialogButton variant="next" onClick={onOkNext} />}
+        nextButton={<DialogButton variant="next-and-ok" onClick={onOkNext} />}
         okButton={<DialogButton variant="ok" onClick={onOk} />}
       >
         <div>This is an example dialog. There&apos;s nothing much to see</div>

client/packages/common/src/intl/locales/en/common.json

@@ -67,11 +67,13 @@
   "button.new-return": "New Return",
   "button.new-shipment": "New Shipment",
   "button.new-stock": "New Stock",
+  "button.next": "Next",
   "button.next-step": "Next step",
   "button.ok": "OK",
   "button.ok-and-next": "OK & Next",
   "button.open-the-menu": "Open the menu",
   "button.order-more": "Order more",
+  "button.previous": "Previous",
   "button.print": "Print",
   "button.print-qr": "Print QR code",
   "button.reduce-lines-to-zero": "Reduce lines to 0",
@@ -142,6 +144,7 @@
   "customers": "Customers",
   "dashboard": "Dashboard",
   "description.already-issued": "Quantity already issued in shipments.",
+  "description.available-stock": "The customer's initial stock on hand + incoming stock +/- inventory adjustments - outgoing stock",
   "description.average-monthly-consumption": "Average Monthly Consumption",
   "description.breach-type": "Ongoing breach type",
   "description.bundle-ratio": "The number of units of the bundled item for every unit of the base item",
@@ -157,7 +160,6 @@
   "description.fc-sell-price": "Foreign currency sell price per pack",
   "description.forecast-quantity": "Forecast Quantity to Reach Target",
   "description.initial-stock-on-hand": "Stock on hand on the first day of the program period",
-  "description.available-stock": "The customer's initial stock on hand + incoming stock +/- inventory adjustments - outgoing stock",
   "description.invoice-number": "Shipment number",
   "description.last-reading-datetime": "Date and time of the last reading",
   "description.max-min-temperature": "Maximum or minimum temperature reading",
@@ -225,6 +227,7 @@
   "error.date_minDate": "Date value is too low",
   "error.dose-ages-out-of-order": "Each dose needs a higher minimum age than the previous dose",
   "error.duplicate-asset-number": "duplicate asset number in csv",
+  "error.duplicate-item-variant-name": "Item variant with the same name already exists for this item",
   "error.duplicated-field": "{{field}} already exists in the import file",
   "error.encounter-not-created": "Unable to create encounter",
   "error.encounter-not-found": "Encounter not found.",
@@ -241,7 +244,6 @@
   "error.failed-to-save-item-variant": "Failed to save item variant",
   "error.failed-to-save-service-charges": "Failed to save service charges",
   "error.failed-to-save-vaccination": "Failed to save vaccination!",
-  "error.duplicate-item-variant-name": "Item variant with the same name already exists for this item",
   "error.failed-to-save-vaccine-course": "Failed to save vaccine course",
   "error.fetch-notifications": "Unable to display cold chain notifications",
   "error.field-must-be-specified": "{{field}} must be specified",
@@ -738,11 +740,11 @@
   "label.invoice-number": "Number",
   "label.is-vaccine": "Vaccine",
   "label.issue": "Issue",
+  "label.item-variant": "Item Variant",
   "label.item_few": "Items",
   "label.item_many": "Items",
   "label.item_one": "Item",
   "label.item_other": "Items",
-  "label.item-variant": "Item Variant",
   "label.items-expiring-before": "Items expiring before",
   "label.items-no-stock_few": "Items with no stock",
   "label.items-no-stock_many": "Items with no stock",
@@ -1366,8 +1368,8 @@
   "messages.new-sensor": "A new sensor has been added as a result of importing these logs. Would you like to assign a location to the new sensor now?",
   "messages.no": "No",
   "messages.no-available-periods": "No available periods found for schedule",
-  "messages.no-bundled-items": "No bundled items configured",
   "messages.no-batch-selected": "You have not selected a batch for this vaccination. No stock transaction will be created. Are you sure you want to continue?",
+  "messages.no-bundled-items": "No bundled items configured",
   "messages.no-contact-traces": "This patient has no contact traces",
   "messages.no-data-available": "No data available",
   "messages.no-data-found": "No data found",
@@ -1634,8 +1636,8 @@
   "text.months": "Months",
   "title.adjustment-details": "Adjustment Details",
   "title.amc": "AMC",
-  "title.bundled-on": "Bundled on",
   "title.bundle-with": "Bundle with",
+  "title.bundled-on": "Bundled on",
   "title.categories": "Categories",
   "title.confirm-delete-encounter": "Delete encounter",
   "title.details": "Details",

client/packages/common/src/types/schema.ts

@@ -94,6 +94,10 @@ export enum ActivityLogNodeType {
   AssetLogReasonDeleted = 'ASSET_LOG_REASON_DELETED',
   AssetPropertyCreated = 'ASSET_PROPERTY_CREATED',
   AssetUpdated = 'ASSET_UPDATED',
+  DemographicIndicatorCreated = 'DEMOGRAPHIC_INDICATOR_CREATED',
+  DemographicIndicatorUpdated = 'DEMOGRAPHIC_INDICATOR_UPDATED',
+  DemographicProjectionCreated = 'DEMOGRAPHIC_PROJECTION_CREATED',
+  DemographicProjectionUpdated = 'DEMOGRAPHIC_PROJECTION_UPDATED',
   InventoryAdjustment = 'INVENTORY_ADJUSTMENT',
   InvoiceCreated = 'INVOICE_CREATED',
   InvoiceDeleted = 'INVOICE_DELETED',
@@ -2969,21 +2973,9 @@ export type InsertResponseRequisitionLineErrorInterface = {
 };
 
 export type InsertResponseRequisitionLineInput = {
-  additionInUnits?: InputMaybe<Scalars['Float']['input']>;
-  averageMonthlyConsumption?: InputMaybe<Scalars['Float']['input']>;
-  comment?: InputMaybe<Scalars['String']['input']>;
-  daysOutOfStock?: InputMaybe<Scalars['Float']['input']>;
-  expiringUnits?: InputMaybe<Scalars['Float']['input']>;
   id: Scalars['String']['input'];
-  incomingUnits?: InputMaybe<Scalars['Float']['input']>;
   itemId: Scalars['String']['input'];
-  lossInUnits?: InputMaybe<Scalars['Float']['input']>;
-  optionId?: InputMaybe<Scalars['String']['input']>;
-  outgoingUnits?: InputMaybe<Scalars['Float']['input']>;
-  requestedQuantity?: InputMaybe<Scalars['Float']['input']>;
   requisitionId: Scalars['String']['input'];
-  stockOnHand?: InputMaybe<Scalars['Float']['input']>;
-  supplyQuantity?: InputMaybe<Scalars['Float']['input']>;
 };
 
 export type InsertResponseRequisitionLineResponse = InsertResponseRequisitionLineError | RequisitionLineNode;
@@ -6510,6 +6502,7 @@ export type RequisitionLineNode = {
   remainingQuantityToSupply: Scalars['Float']['output'];
   /** Quantity requested */
   requestedQuantity: Scalars['Float']['output'];
+  requisitionNumber: Scalars['Int']['output'];
   /**
    * Calculated quantity
    * When months_of_stock < requisition.min_months_of_stock, calculated = average_monthly_consumption * requisition.max_months_of_stock - months_of_stock

client/packages/common/src/ui/components/buttons/ButtonShowcase.stories.tsx

@@ -115,7 +115,10 @@ const Template: StoryFn<{ color: 'primary' | 'secondary' }> = ({ color }) => {
         </Wrapper>
 
         <Wrapper text="Dialog OK & Next button">
-          <DialogButton variant="next" onClick={getOnClick('OK & Next!')} />
+          <DialogButton
+            variant="next-and-ok"
+            onClick={getOnClick('OK & Next!')}
+          />
         </Wrapper>
 
         <Wrapper text="Dialog cancel button">

client/packages/common/src/ui/components/buttons/standard/DialogButton.tsx

@@ -15,6 +15,8 @@ import { ButtonWithIcon } from './ButtonWithIcon';
 type DialogButtonVariant =
   | 'cancel'
   | 'back'
+  | 'previous'
+  | 'next-and-ok'
   | 'next'
   | 'ok'
   | 'save'
@@ -63,12 +65,18 @@ const getButtonProps = (
         labelKey: 'button.ok',
         variant: 'contained',
       };
-    case 'next':
+    case 'next-and-ok':
       return {
         icon: <ArrowRightIcon />,
         labelKey: 'button.ok-and-next',
         variant: 'contained',
       };
+    case 'next':
+      return {
+        icon: <ArrowRightIcon />,
+        labelKey: 'button.next',
+        variant: 'contained',
+      };
     case 'save':
       return {
         icon: <SaveIcon />,
@@ -99,6 +107,12 @@ const getButtonProps = (
         labelKey: 'button.close',
         variant: 'outlined',
       };
+    case 'previous':
+      return {
+        icon: <ArrowLeftIcon />,
+        labelKey: 'button.previous',
+        variant: 'outlined',
+      };
   }
 };
 

client/packages/common/src/ui/components/navigation/ListOptions/ListOptions.tsx

@@ -0,0 +1,87 @@
+import { CheckIcon, ChevronDownIcon } from '@common/icons';
+import {
+  List,
+  ListItemIcon,
+  ListItem,
+  ListItemText,
+  Divider,
+  Box,
+} from '@mui/material';
+import React from 'react';
+
+export type ListOptionValues = {
+  id: string;
+  value: string;
+};
+
+interface ListProps {
+  onClick: (id: string) => void;
+  options: ListOptionValues[];
+  currentId?: string;
+  enteredLineIds?: string[];
+}
+
+export const ListOptions = ({
+  onClick,
+  options,
+  currentId,
+  enteredLineIds,
+}: ListProps) => {
+  const startIcon = (
+    <CheckIcon
+      style={{
+        backgroundColor: '#33A901',
+        borderRadius: '50%',
+        padding: '2px',
+        color: 'white',
+        height: 18,
+        width: 18,
+      }}
+    />
+  );
+
+  const endIcon = (
+    <ChevronDownIcon
+      style={{ width: 17, height: 17, transform: 'rotate(-90deg)' }}
+    />
+  );
+
+  return (
+    <List sx={{ padding: 0 }}>
+      {options?.map((option, _) => (
+        <React.Fragment key={option.id}>
+          <ListItem
+            sx={{ padding: '5px 0px' }}
+            onClick={() => onClick(option.id)}
+          >
+            <ListItemIcon sx={{ padding: 0, minWidth: 25 }}>
+              <Box
+                style={{
+                  visibility: enteredLineIds?.includes(option.id)
+                    ? 'visible'
+                    : 'hidden',
+                }}
+              >
+                {startIcon}
+              </Box>
+            </ListItemIcon>
+            <ListItemText
+              primary={option.value}
+              sx={{ margin: 0, padding: 0 }}
+            />
+            <ListItemIcon sx={{ padding: 0, minWidth: 15 }}>
+              <Box
+                style={{
+                  visibility: option.id === currentId ? 'visible' : 'hidden',
+                }}
+              >
+                {endIcon}
+              </Box>
+            </ListItemIcon>
+          </ListItem>
+          <Divider component="li" />
+        </React.Fragment>
+      ))}
+    </List>
+  );
+};

client/packages/common/src/ui/components/navigation/ListOptions/index.ts

@@ -0,0 +1 @@
+export * from './ListOptions';

client/packages/common/src/ui/components/navigation/index.ts

@@ -3,3 +3,4 @@ export * from './AppNavSection';
 export * from './Breadcrumbs';
 export * from './ExternalNavLink';
 export * from './Tabs';
+export * from './ListOptions';

client/packages/inventory/src/Stocktake/DetailView/modal/StocktakeLineEdit/StocktakeLineEditModal.tsx

@@ -38,7 +38,7 @@ export const StocktakeLineEditModal: FC<
       cancelButton={<DialogButton variant="cancel" onClick={onCancel} />}
       nextButton={
         <DialogButton
-          variant="next"
+          variant="next-and-ok"
           onClick={onNext}
           disabled={(!hasNext && mode === ModalMode.Update) || !isValid}
         />

client/packages/invoices/src/InboundShipment/DetailView/modals/InboundLineEdit/InboundLineEdit.tsx

@@ -155,7 +155,7 @@ export const InboundLineEdit: FC<InboundLineEditProps> = ({
         cancelButton={<DialogButton variant="cancel" onClick={onClose} />}
         nextButton={
           <DialogButton
-            variant="next"
+            variant="next-and-ok"
             disabled={okNextDisabled || zeroNumberOfPacks}
             onClick={async () => {
               await saveLines();

client/packages/invoices/src/OutboundShipment/DetailView/OutboundLineEdit/OutboundLineEdit.tsx

@@ -222,7 +222,7 @@ export const OutboundLineEdit: React.FC<ItemDetailsModalProps> = ({
       nextButton={
         <DialogButton
           disabled={okNextDisabled}
-          variant="next"
+          variant="next-and-ok"
           onClick={onNext}
         />
       }

client/packages/invoices/src/Prescriptions/DetailView/PrescriptionLineEdit/PrescriptionLineEdit.tsx

@@ -196,7 +196,7 @@ export const PrescriptionLineEdit: React.FC<PrescriptionLineEditModalProps> = ({
       nextButton={
         <DialogButton
           disabled={okNextDisabled}
-          variant="next"
+          variant="next-and-ok"
           onClick={onNext}
         />
       }

client/packages/invoices/src/Returns/modals/CustomerReturn/CustomerReturn.tsx

@@ -120,7 +120,7 @@ export const CustomerReturnEditModal = ({
   const NextStepButton = (
     <DialogButton
       onClick={handleNextStep}
-      variant="next"
+      variant="next-and-ok"
       disabled={!lines.length}
       customLabel={t('button.next-step')}
     />
@@ -129,7 +129,7 @@ export const CustomerReturnEditModal = ({
   const OkAndNextButton = (
     <DialogButton
       onClick={handleNextItem}
-      variant="next"
+      variant="next-and-ok"
       disabled={
         currentTab !== Tabs.Reason ||
         (isDisabled && !hasNextItem) ||

client/packages/invoices/src/Returns/modals/SupplierReturn/SupplierReturn.tsx

@@ -118,7 +118,7 @@ export const SupplierReturnEditModal = ({
   const NextStepButton = (
     <DialogButton
       onClick={handleNextStep}
-      variant="next"
+      variant="next-and-ok"
       disabled={!lines.length}
       customLabel={t('button.next-step')}
     />
@@ -127,7 +127,7 @@ export const SupplierReturnEditModal = ({
   const OkAndNextButton = (
     <DialogButton
       onClick={handleNextItem}
-      variant="next"
+      variant="next-and-ok"
       disabled={
         currentTab !== Tabs.Reason ||
         (isDisabled && !hasNextItem) ||

client/packages/requisitions/src/RequestRequisition/DetailView/RequestLineEdit/RequestLineEdit.tsx

@@ -76,7 +76,7 @@ export const RequestLineEdit = ({
       nextButton={
         <DialogButton
           disabled={nextDisabled}
-          variant="next"
+          variant="next-and-ok"
           onClick={async () => {
             await save();
             setPreviousItemLineId(null);