Merge pull request #5220 from msupply-foundation/5177-Allow-user-to-c…

…reate-PROGRAM-manual-requisitions 5177 allow user to create program manual requisitions
msupply-foundation · Oct 29, 2024 · 3a9be8c · 3a9be8c
2 parents 8e94318 + 05f793e
commit 3a9be8c
Show file tree

Hide file tree

Showing 23 changed files with 581 additions and 86 deletions.
diff --git a/client/packages/common/src/intl/locales/en/common.json b/client/packages/common/src/intl/locales/en/common.json
@@ -797,13 +797,14 @@
   "label.new-contact-trace": "Add Contact",
   "label.new-encounter": "New Encounter",
   "label.new-functional-status": "New functional status",
+  "label.new-internal-order": "New Order",
   "label.new-location": "New Location",
   "label.new-num-packs": "New number of packs",
   "label.new-pack-qty": "New Pack Qty",
   "label.new-pack-size": "New pack size",
   "label.new-pack-variant": "New Pack Variant",
   "label.new-patient": "New Patient",
-  "label.new-requisition": "New Order",
+  "label.new-requisition": "New Requisition",
   "label.new-rnr-form": "New R&R Form",
   "label.new-row": "New Row",
   "label.new-stocktake": "New Stocktake",

diff --git a/client/packages/common/src/types/schema.ts b/client/packages/common/src/types/schema.ts
@@ -1187,6 +1187,7 @@ export type CustomerReturnLineInput = {
   expiryDate?: InputMaybe<Scalars['NaiveDate']['input']>;
   id: Scalars['String']['input'];
   itemId: Scalars['String']['input'];
+  itemVariantId?: InputMaybe<Scalars['String']['input']>;
   note?: InputMaybe<Scalars['String']['input']>;
   numberOfPacksReturned: Scalars['Float']['input'];
   packSize: Scalars['Float']['input'];
@@ -2522,6 +2523,7 @@ export type InsertInboundShipmentLineInput = {
   id: Scalars['String']['input'];
   invoiceId: Scalars['String']['input'];
   itemId: Scalars['String']['input'];
+  itemVariantId?: InputMaybe<Scalars['String']['input']>;
   location?: InputMaybe<NullableStringUpdate>;
   numberOfPacks: Scalars['Float']['input'];
   packSize: Scalars['Float']['input'];
@@ -2970,6 +2972,7 @@ export type InsertStockLineInput = {
   id: Scalars['String']['input'];
   inventoryAdjustmentReasonId?: InputMaybe<Scalars['String']['input']>;
   itemId: Scalars['String']['input'];
+  itemVariantId?: InputMaybe<Scalars['String']['input']>;
   location?: InputMaybe<NullableStringUpdate>;
   numberOfPacks: Scalars['Float']['input'];
   onHold: Scalars['Boolean']['input'];
@@ -3580,11 +3583,10 @@ export type ItemVariantMutationsUpsertItemVariantArgs = {
 export type ItemVariantNode = {
   __typename: 'ItemVariantNode';
   coldStorageTypeId?: Maybe<Scalars['String']['output']>;
-  dosesPerUnit?: Maybe<Scalars['Float']['output']>;
+  dosesPerUnit?: Maybe<Scalars['Int']['output']>;
   id: Scalars['String']['output'];
   manufacturer?: Maybe<NameNode>;
   manufacturerId?: Maybe<Scalars['String']['output']>;
-  manufacturerName?: Maybe<Scalars['String']['output']>;
   name: Scalars['String']['output'];
   packagingVariants: Array<PackagingVariantNode>;
 };
@@ -7696,6 +7698,7 @@ export type UpdateInboundShipmentLineInput = {
   expiryDate?: InputMaybe<Scalars['NaiveDate']['input']>;
   id: Scalars['String']['input'];
   itemId?: InputMaybe<Scalars['String']['input']>;
+  itemVariantId?: InputMaybe<Scalars['String']['input']>;
   location?: InputMaybe<NullableStringUpdate>;
   numberOfPacks?: InputMaybe<Scalars['Float']['input']>;
   packSize?: InputMaybe<Scalars['Float']['input']>;

diff --git a/client/packages/requisitions/src/RequestRequisition/ListView/AppBarButtons.tsx b/client/packages/requisitions/src/RequestRequisition/ListView/AppBarButtons.tsx
@@ -19,8 +19,8 @@ import {
 import { useRequest } from '../api';
 import { requestsToCsv } from '../../utils';
 import { CreateRequisitionModal } from './CreateRequisitionModal';
-import { NewRequisitionType } from './types';
 import { AppRoute } from '@openmsupply-client/config';
+import { NewRequisitionType } from '../../types';
 
 export const AppBarButtons: FC<{
   modalController: ToggleState;

diff --git a/client/packages/requisitions/src/RequestRequisition/ListView/CreateRequisitionModal.tsx b/client/packages/requisitions/src/RequestRequisition/ListView/CreateRequisitionModal.tsx
@@ -4,7 +4,6 @@ import {
   ModalTabs,
   useDialog,
   useTranslation,
-  useWindowDimensions,
 } from '@openmsupply-client/common';
 
 import {
@@ -17,7 +16,7 @@ import {
   NewProgramRequisition,
   ProgramRequisitionOptions,
 } from './ProgramRequisitionOptions';
-import { NewRequisitionType } from './types';
+import { NewRequisitionType } from '../../types';
 
 interface NewGeneralRequisition {
   type: NewRequisitionType.General;
@@ -40,8 +39,6 @@ export const CreateRequisitionModal: FC<CreateRequisitionModalProps> = ({
   const { data: programSettings, isLoading } =
     useRequest.utils.programSettings();
   const { Modal } = useDialog({ isOpen, onClose, disableBackdrop: false });
-  const { height: windowHeight } = useWindowDimensions();
-  const height = windowHeight * 0.8;
 
   // const { data, isLoading } = useName.document.internalSuppliers();
   const t = useTranslation();
@@ -76,10 +73,10 @@ export const CreateRequisitionModal: FC<CreateRequisitionModalProps> = ({
 
   return (
     <Modal
-      height={height}
-      width={500}
+      height={700}
+      width={700}
       slideAnimation={false}
-      title={t('label.new-requisition')}
+      title={t('label.new-internal-order')}
     >
       <InnerComponent />
     </Modal>

diff --git a/client/packages/requisitions/src/RequestRequisition/ListView/ProgramRequisitionOptions.tsx b/client/packages/requisitions/src/RequestRequisition/ListView/ProgramRequisitionOptions.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
 import {
   Autocomplete,
   AutocompleteProps,
@@ -11,7 +11,7 @@ import {
 import { getNameOptionRenderer } from '@openmsupply-client/system';
 
 import { SupplierProgramSettingsFragment } from '../api';
-import { NewRequisitionType } from './types';
+import { NewRequisitionType } from '../../types';
 
 export interface NewProgramRequisition {
   type: NewRequisitionType.Program;
@@ -44,14 +44,16 @@ const useProgramRequisitionOptions = (
   const [period, setPeriod] = useState<Period | null>(null);
   const t = useTranslation();
 
-  useEffect(() => {
+  const handleSetProgram = (value: ProgramSetting | null) => {
+    setProgram(value);
     setOrderType(null);
     setSupplier(null);
-  }, [program]);
-
-  useEffect(() => {
     setPeriod(null);
-  }, [orderType]);
+  };
+  const handleSetOrderType = (value: OrderType | null) => {
+    setOrderType(value);
+    setPeriod(null);
+  };
 
   const allOptions: {
     programs: Common<ProgramSetting>;
@@ -62,14 +64,14 @@ const useProgramRequisitionOptions = (
     programs: {
       options: programSettings,
       value: program,
-      set: setProgram,
+      set: handleSetProgram,
       label: t('label.program'),
       disabled: false,
     },
     orderTypes: {
       options: program?.orderTypes || [],
       value: orderType,
-      set: setOrderType,
+      set: handleSetOrderType,
       disabled: program === null,
       labelNoOptions: t('messages.not-configured'),
       label: t('label.order-type'),

diff --git a/client/packages/requisitions/src/RequestRequisition/ListView/types.ts b/client/packages/requisitions/src/RequestRequisition/ListView/types.ts
diff --git a/client/packages/requisitions/src/ResponseRequisition/DetailView/ProgramInfoSection.tsx b/client/packages/requisitions/src/ResponseRequisition/DetailView/ProgramInfoSection.tsx
@@ -0,0 +1,40 @@
+import React from 'react';
+import { DetailPanelSection } from '@common/components';
+import { useTranslation } from '@common/intl';
+import { useResponse } from '../api';
+import {
+  Grid,
+  PanelField,
+  PanelLabel,
+  PanelRow,
+} from '@openmsupply-client/common';
+
+export const ProgramInfoSection = () => {
+  const t = useTranslation();
+  const { orderType, programName, period } = useResponse.document.fields([
+    'orderType',
+    'programName',
+    'period',
+  ]);
+
+  return programName ? (
+    <DetailPanelSection title={t('heading.program-info')}>
+      <Grid container gap={0.5} key="program-info">
+        <PanelRow>
+          <PanelLabel>{t('label.order-type')}</PanelLabel>
+          <PanelField>{orderType ?? ''}</PanelField>
+        </PanelRow>
+        <PanelRow>
+          <PanelLabel>{t('label.program')}</PanelLabel>
+          <PanelField>{programName ?? ''}</PanelField>
+        </PanelRow>
+        <PanelRow>
+          <PanelLabel>{t('label.period')}</PanelLabel>
+          <PanelField>{period?.name ?? ''}</PanelField>
+        </PanelRow>
+      </Grid>
+    </DetailPanelSection>
+  ) : (
+    <></>
+  );
+};
diff --git a/client/packages/requisitions/src/ResponseRequisition/DetailView/SidePanel.tsx b/client/packages/requisitions/src/ResponseRequisition/DetailView/SidePanel.tsx
@@ -9,6 +9,7 @@ import {
 import { useResponse } from '../api';
 import { AdditionalInfoSection } from './AdditionalInfoSection';
 import { RelatedDocumentsSection } from './RelatedDocumentsSection';
+import { ProgramInfoSection } from './ProgramInfoSection';
 
 export const SidePanel: FC = () => {
   const { success } = useNotification();
@@ -31,6 +32,7 @@ export const SidePanel: FC = () => {
         />
       }
     >
+      <ProgramInfoSection />
       <AdditionalInfoSection />
       <RelatedDocumentsSection />
     </DetailPanelPortal>

diff --git a/client/packages/requisitions/src/ResponseRequisition/DetailView/Toolbar/Toolbar.tsx b/client/packages/requisitions/src/ResponseRequisition/DetailView/Toolbar/Toolbar.tsx
@@ -28,18 +28,12 @@ export const Toolbar: FC = () => {
     theirReference,
     shipments,
     update,
-    programName,
-    period,
-    orderType,
     linkedRequisition,
   } = useResponse.document.fields([
     'approvalStatus',
     'otherParty',
     'theirReference',
     'shipments',
-    'programName',
-    'period',
-    'orderType',
     'linkedRequisition',
   ]);
   const noLinkedShipments = (shipments?.totalCount ?? 0) === 0;
@@ -97,24 +91,6 @@ export const Toolbar: FC = () => {
                   }
                 />
               )}
-              {orderType && (
-                <InputWithLabelRow
-                  label={t('label.order-type')}
-                  Input={<Typography>{orderType ?? ''}</Typography>}
-                />
-              )}
-              {programName && (
-                <InputWithLabelRow
-                  label={t('label.program')}
-                  Input={<Typography>{programName ?? ''}</Typography>}
-                />
-              )}
-              {period && (
-                <InputWithLabelRow
-                  label={t('label.period')}
-                  Input={<Typography>{period?.name ?? ''}</Typography>}
-                />
-              )}
             </Box>
           </Box>
           {showInfo && (

diff --git a/client/packages/requisitions/src/ResponseRequisition/ListView/AppBarButtons.tsx b/client/packages/requisitions/src/ResponseRequisition/ListView/AppBarButtons.tsx
@@ -19,7 +19,8 @@ import {
 import { useResponse } from '../api';
 import { responsesToCsv } from '../../utils';
 import { AppRoute } from '@openmsupply-client/config';
-import { CustomerSearchModal } from '@openmsupply-client/system';
+import { NewRequisitionType } from '../../types';
+import { CreateRequisitionModal } from './CreateRequisitionModal';
 
 export const AppBarButtons = ({
   modalController,
@@ -30,6 +31,8 @@ export const AppBarButtons = ({
   const navigate = useNavigate();
   const { success, error } = useNotification();
   const { mutateAsync: onCreate } = useResponse.document.insert();
+  const { mutateAsync: onProgramCreate } = useResponse.document.insertProgram();
+
   const { mutateAsync, isLoading } = useResponse.document.listAll({
     key: 'createdDatetime',
     direction: 'desc',
@@ -66,29 +69,40 @@ export const AppBarButtons = ({
           {t('button.export')}
         </LoadingButton>
       </Grid>
-      <CustomerSearchModal
-        open={modalController.isOn}
+      <CreateRequisitionModal
+        isOpen={modalController.isOn}
         onClose={modalController.toggleOff}
-        onChange={async name => {
+        onCreate={async newRequisition => {
           modalController.toggleOff();
-          try {
-            await onCreate({
-              id: FnUtils.generateUUID(),
-              otherPartyId: name.id,
-            }).then(({ requisitionNumber }) => {
-              navigate(
-                RouteBuilder.create(AppRoute.Distribution)
-                  .addPart(AppRoute.CustomerRequisition)
-                  .addPart(String(requisitionNumber))
-                  .build(),
-                { replace: true }
-              );
-            });
-          } catch (e) {
-            const errorSnack = error(
-              `${t('message.failed-to-create-requisition')}: ${(e as Error).message}`
-            );
-            errorSnack();
+          switch (newRequisition.type) {
+            case NewRequisitionType.General:
+              return onCreate({
+                id: FnUtils.generateUUID(),
+                otherPartyId: newRequisition.name.id,
+              }).then(({ requisitionNumber }) => {
+                navigate(
+                  RouteBuilder.create(AppRoute.Distribution)
+                    .addPart(AppRoute.CustomerRequisition)
+                    .addPart(String(requisitionNumber))
+                    .build(),
+                  { replace: true }
+                );
+              });
+            case NewRequisitionType.Program:
+              // eslint-disable-next-line @typescript-eslint/no-unused-vars
+              const { type: _, ...rest } = newRequisition;
+              return onProgramCreate({
+                id: FnUtils.generateUUID(),
+                ...rest,
+              }).then(({ requisitionNumber }) => {
+                navigate(
+                  RouteBuilder.create(AppRoute.Distribution)
+                    .addPart(AppRoute.CustomerRequisition)
+                    .addPart(String(requisitionNumber))
+                    .build(),
+                  { replace: true }
+                );
+              });
           }
         }}
       />