@openmrs/esm-stock-management-app 1.0.1-pre.777 → 1.0.1-pre.785

package/src/stock-operations/add-stock-operation/stock-items-addition.component.tsx

@@ -1,254 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { StockOperationDTO } from '../../core/api/types/stockOperation/StockOperationDTO';
-import { SaveStockOperation } from '../../stock-items/types';
-import { StockOperationType } from '../../core/api/types/stockOperation/StockOperationType';
-import { InitializeResult } from './types';
-import {
-  Button,
-  DataTable,
-  InlineLoading,
-  Table,
-  TableBody,
-  TableContainer,
-  TableHead,
-  TableHeader,
-  TableRow,
-} from '@carbon/react';
-import { isDesktop } from '@openmrs/esm-framework';
-import { StockOperationItemDTO } from '../../core/api/types/stockOperation/StockOperationItemDTO';
-import { getStockOperationUniqueId } from '../stock-operation.utils';
-import { useTranslation } from 'react-i18next';
-import { FieldArrayWithId, FormProvider, useFieldArray, useForm } from 'react-hook-form';
-import { zodResolver } from '@hookform/resolvers/zod';
-import { useValidationSchema } from './validationSchema';
-import StockItemsAdditionRow from './stock-items-addition-row.component';
-import { ArrowRight } from '@carbon/react/icons';
-import { errorAlert } from '../../core/utils/alert';
-
-import styles from './stock-items-addition.component.scss';
-import StockItemSearch from './stock-item-search/stock-item-search.component';
-
-interface StockItemsAdditionProps {
-  isEditing?: boolean;
-  canEdit?: boolean;
-  model?: StockOperationDTO;
-  onSave?: SaveStockOperation;
-  operation: StockOperationType;
-  setup: InitializeResult;
-}
-
-const StockItemsAddition: React.FC<StockItemsAdditionProps> = ({
-  setup: {
-    hasQtyRequested: showQuantityRequested,
-    requiresBatchUuid,
-    requiresActualBatchInfo: requiresActualBatchInformation,
-    canCaptureQuantityPrice,
-    batchBalance,
-    batchNos,
-    canUpdateItemsBatchInformation: canUpdateBatchInformation,
-    itemUoM,
-  },
-  canEdit = true,
-  model,
-  onSave,
-  operation,
-}) => {
-  const { t } = useTranslation();
-  const { operationType } = operation ?? {};
-  const validationSchema = useValidationSchema(operationType);
-  const handleSave = async (item: { stockItems: StockOperationItemDTO[] }) => {
-    if (item.stockItems.length == 0) {
-      errorAlert('No stock items', "You haven't added any stock items, tap the add button to add some.");
-      return;
-    }
-
-    model.stockOperationItems = item?.stockItems;
-    await onSave?.(model);
-  };
-
-  const formMethods = useForm({
-    resolver: zodResolver(validationSchema),
-    defaultValues: {
-      stockItems: model?.stockOperationItems ?? [{ uuid: `new-item-1`, id: `new-item-1` }],
-    },
-    mode: 'onSubmit',
-  });
-
-  const {
-    handleSubmit,
-    control,
-    setValue,
-    formState: { errors },
-  } = formMethods;
-
-  const [isSaving] = useState(false);
-
-  const formFieldMethods = useFieldArray({
-    name: 'stockItems',
-    control,
-  });
-  const { fields, append, remove } = formFieldMethods;
-  const [selectedItems, setSelectedItems] = useState<
-    | FieldArrayWithId<{ stockItems: StockOperationItemDTO[] }, 'stockItems', 'id'>
-    | (() => FieldArrayWithId<{ stockItems: StockOperationItemDTO[] }, 'stockItems', 'id'>)
-  >();
-
-  useEffect(() => {
-    if (fields.length > 0) {
-      const lastItemIndex = fields.length - 1;
-      const item = fields[lastItemIndex];
-      setSelectedItems(item);
-    }
-  }, [fields]);
-
-  const headers = [
-    {
-      key: 'item',
-      header: t('item', 'Item'),
-      styles: { width: '40% !important' },
-    },
-    {
-      key: 'itemDetails',
-      header: t('itemDetails', 'Item Details'),
-      styles: { width: '20% !important' },
-    },
-    ...(showQuantityRequested
-      ? [
-          {
-            key: 'quantityrequested',
-            header: t('quantityRequested', 'Quantity Requested'),
-          },
-        ]
-      : []),
-    ...(requiresBatchUuid || requiresActualBatchInformation
-      ? [
-          {
-            key: 'batch',
-            header: t('batchNo', 'Batch No'),
-            styles: { width: '15% !important' },
-          },
-        ]
-      : []),
-    ...(requiresActualBatchInformation
-      ? [
-          {
-            key: 'expiry',
-            header: t('expiry', 'Expiry'),
-          },
-        ]
-      : []),
-    ...(requiresBatchUuid
-      ? [
-          {
-            key: 'expiry',
-            header: t('expiry', 'Expiry'),
-          },
-        ]
-      : []),
-
-    {
-      key: 'quantity',
-      header: showQuantityRequested ? t('qtyIssued', 'Qty Issued') : t('qty', 'Qty'),
-    },
-    {
-      key: 'quantityuom',
-      header: t('quantityUom', 'Qty UoM'),
-    },
-    ...(canCaptureQuantityPrice
-      ? [
-          {
-            key: 'purchaseprice',
-            header: t('purchasePrice', 'Purchase Price'),
-          },
-        ]
-      : []),
-  ];
-
-  const addNewItem = () => {
-    const itemId = `new-item-${getStockOperationUniqueId()}`;
-    append({
-      uuid: itemId,
-      id: itemId,
-      stockItemUuid: null,
-      stockItemName: '',
-    });
-  };
-
-  return (
-    <FormProvider {...formMethods}>
-      <div style={{ margin: '10px' }}>
-        <div className={styles.tableContainer}>
-          <StockItemSearch {...formFieldMethods} />
-          <DataTable
-            rows={model?.stockOperationItems ?? [{ uuid: `new-item-1`, id: `new-item-1` }]}
-            headers={headers}
-            isSortable={false}
-            useZebraStyles={true}
-            className={styles.dataTable}
-            render={({ headers, getHeaderProps, getTableProps }) => (
-              <TableContainer>
-                <Table {...getTableProps()}>
-                  <TableHead>
-                    <TableRow>
-                      {headers.map((header: any) => (
-                        <TableHeader
-                          {...getHeaderProps({
-                            header,
-                            isSortable: false,
-                          })}
-                          className={isDesktop ? styles.desktopHeader : styles.tabletHeader}
-                          style={header?.styles}
-                          key={`${header.key}`}
-                        >
-                          {header.header?.content ?? header?.header}
-                        </TableHeader>
-                      ))}
-                      {canEdit && (
-                        <TableHeader className={styles.tableHeader}>
-                          <div className={styles.TableBody}>
-                            <Button
-                              name="save"
-                              type="button"
-                              className="submitButton"
-                              onClick={() => handleSubmit(handleSave)()}
-                              kind="primary"
-                              renderIcon={ArrowRight}
-                            >
-                              {isSaving ? <InlineLoading /> : t('next', 'Next')}
-                            </Button>
-                          </div>
-                        </TableHeader>
-                      )}
-                    </TableRow>
-                  </TableHead>
-                  <TableBody>
-                    <StockItemsAdditionRow
-                      rows={model?.stockOperationItems ?? [{ uuid: `new-item-1`, id: `new-item-1` }]}
-                      batchBalance={batchBalance}
-                      batchNos={batchNos}
-                      control={control}
-                      setValue={setValue}
-                      errors={errors}
-                      remove={remove}
-                      append={append}
-                      canEdit={canEdit}
-                      showQuantityRequested={showQuantityRequested}
-                      requiresActualBatchInformation={requiresActualBatchInformation}
-                      requiresBatchUuid={requiresBatchUuid}
-                      canUpdateBatchInformation={canUpdateBatchInformation}
-                      canCapturePurchasePrice={canCaptureQuantityPrice}
-                      itemUoM={itemUoM}
-                      fields={fields}
-                    />{' '}
-                  </TableBody>
-                </Table>
-              </TableContainer>
-            )}
-          ></DataTable>
-        </div>
-      </div>
-    </FormProvider>
-  );
-};
-
-export default StockItemsAddition;

package/src/stock-operations/add-stock-operation/stock-operation-context/useStockOperationContext.tsx

@@ -1,16 +0,0 @@
-import React, { createContext, useContext, useState } from 'react';
-
-type StockOperationShape = {
-  formContext: Record<string, unknown>;
-  setFormContext: (formValue) => void;
-};
-
-const StockOperationContext = createContext<StockOperationShape>(null);
-
-export const useStockOperationContext = () => useContext(StockOperationContext);
-
-export const StockOperation: React.FC<{ children: React.ReactNode }> = ({ children }) => {
-  const [formContext, setFormContext] = useState<StockOperationShape>(null);
-  const value = { formContext, setFormContext };
-  return <StockOperationContext.Provider value={value}>{children}</StockOperationContext.Provider>;
-};

package/src/stock-operations/add-stock-operation/stock-operation-reference.component.tsx

@@ -1,39 +0,0 @@
-import React from 'react';
-import { StockOperationDTO } from '../../core/api/types/stockOperation/StockOperationDTO';
-import { launchAddOrEditDialog } from '../stock-operation.utils';
-import { useTranslation } from 'react-i18next';
-import { getStockOperation } from '../stock-operations.resource';
-import { useStockOperationTypes } from '../../stock-lookups/stock-lookups.resource';
-
-interface StockOperationReferenceProps {
-  operationUuid: string;
-  operationNumber: string;
-}
-
-const StockOperationReference = (props: StockOperationReferenceProps) => {
-  const { t } = useTranslation();
-  const { types } = useStockOperationTypes();
-
-  let model: StockOperationDTO;
-  if (props?.operationUuid) {
-    getStockOperation(props?.operationUuid).then((resp) => {
-      model = resp?.data;
-    });
-  }
-
-  const handleEdit = () => {
-    const operation = types.results?.find((op) => op?.uuid === model?.operationTypeUuid);
-
-    if (!operation) {
-      return;
-    }
-    launchAddOrEditDialog(t, model, true, operation, types?.results, false);
-  };
-  return (
-    <a onClick={handleEdit} style={{ cursor: 'pointer' }}>
-      {props?.operationNumber}
-    </a>
-  );
-};
-
-export default StockOperationReference;

package/src/stock-operations/add-stock-operation/stock-operation-related-link.component.tsx

@@ -1,38 +0,0 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { StockOperationDTO } from '../../core/api/types/stockOperation/StockOperationDTO';
-import { StockOperationType } from '../../core/api/types/stockOperation/StockOperationType';
-import { launchAddOrEditDialog } from '../stock-operation.utils';
-import { getStockOperation } from '../stock-operations.resource';
-
-interface StockOperationRelatedLinkProps {
-  operationTypes: StockOperationType[];
-  operationUuid: string;
-  operationNumber: string;
-}
-
-const StockOperationRelatedLink = (props: StockOperationRelatedLinkProps) => {
-  const { t } = useTranslation();
-  const operationTypes = props?.operationTypes;
-  let model: StockOperationDTO;
-
-  getStockOperation(props?.operationUuid).then((resp) => {
-    model = resp.data;
-  });
-
-  const handleEdit = () => {
-    const operation = operationTypes?.find((op) => op?.uuid === model?.operationTypeUuid);
-
-    if (!operation) {
-      return;
-    }
-    launchAddOrEditDialog(t, model, true, operation, operationTypes, false);
-  };
-  return (
-    <span onClick={handleEdit} style={{ cursor: 'pointer', textDecoration: 'underline' }}>
-      {props?.operationNumber}
-    </span>
-  );
-};
-
-export default StockOperationRelatedLink;

package/src/stock-operations/add-stock-operation/stock-operation-status.component.tsx

@@ -1,170 +0,0 @@
-import { useTranslation } from 'react-i18next';
-import { StockOperationDTO } from '../../core/api/types/stockOperation/StockOperationDTO';
-import React from 'react';
-import { formatDate, parseDate } from '@openmrs/esm-framework';
-import styles from '../stock-operations-table.scss';
-
-interface StockOperationStatusProps {
-  model: StockOperationDTO;
-}
-
-const StockOperationStatus: React.FC<StockOperationStatusProps> = (props) => {
-  const { t } = useTranslation();
-  return (
-    <>
-      <div className={styles.statusContainer}>
-        {props.model?.dateCreated && (
-          <div>
-            <span className={styles.textHeading}>{t('started', 'Started')}:</span>
-            <div className={styles.statusDescriptions}>
-              <span className={styles.text}>
-                {formatDate(parseDate(props.model?.dateCreated.toString()), {
-                  time: true,
-                  mode: 'standard',
-                })}
-              </span>
-
-              <span className={styles.text}>{t('by', 'By')}</span>
-
-              <span className={styles.text}>
-                {props.model?.creatorFamilyName} &nbsp;
-                {props.model?.creatorGivenName}
-              </span>
-            </div>
-          </div>
-        )}
-
-        {props.model.submittedDate && (
-          <div>
-            <span className={styles.textHeading}>{t('submitted', 'Submitted')}:</span>
-            <div className={styles.statusDescriptions}>
-              <span className={styles.text}>
-                {formatDate(parseDate(props.model?.submittedDate.toString()), {
-                  time: true,
-                  mode: 'standard',
-                })}
-              </span>
-
-              <span className={styles.text}>{t('by', 'By')}</span>
-
-              <span className={styles.text}>
-                {props.model?.submittedByFamilyName} &nbsp;
-                {props.model?.submittedByGivenName}
-              </span>
-            </div>
-          </div>
-        )}
-
-        {props.model?.dispatchedDate && (
-          <div>
-            <span className={styles.textHeading}>{t('dispatched', 'Dispatched')}:</span>
-            <div className={styles.statusDescriptions}>
-              <span className={styles.text}>
-                {formatDate(parseDate(props.model?.dispatchedDate.toString()), {
-                  time: true,
-                  mode: 'standard',
-                })}
-              </span>
-
-              <span className={styles.text}>{t('by', 'By')}</span>
-
-              <span className={styles.text}>
-                {props.model?.dispatchedByFamilyName} &nbsp;
-                {props.model?.dispatchedByGivenName}
-              </span>
-            </div>
-          </div>
-        )}
-
-        {props.model?.returnedDate && (
-          <div>
-            <span className={styles.textHeading}>{t('returned', 'Returned')}:</span>
-            <div className={styles.statusDescriptions}>
-              <span className={styles.text}>
-                {formatDate(parseDate(props.model?.returnedDate.toString()), {
-                  time: true,
-                  mode: 'standard',
-                })}
-              </span>
-
-              <span className={styles.text}>{t('by', 'By')}</span>
-
-              <span className={styles.text}>
-                {props.model?.returnedByFamilyName} &nbsp;
-                {props.model?.returnedByGivenName}
-              </span>
-              <span className={styles.text}>{props.model?.returnReason}</span>
-            </div>
-          </div>
-        )}
-
-        {props.model?.completedDate && (
-          <div>
-            <span className={styles.textHeading}>{t('completed', 'Completed')}:</span>
-            <div className={styles.statusDescriptions}>
-              <span className={styles.text}>
-                {formatDate(parseDate(props.model?.completedDate.toString()), {
-                  time: true,
-                  mode: 'standard',
-                })}
-              </span>
-
-              <span className={styles.text}>{t('by', 'By')}</span>
-
-              <span className={styles.text}>
-                {props.model?.completedByFamilyName} &nbsp;
-                {props.model?.completedByGivenName}
-              </span>
-            </div>
-          </div>
-        )}
-
-        {props.model?.status === 'CANCELLED' && (
-          <div>
-            <span className={styles.textHeading}>{t('cancelled', 'Cancelled')}:</span>
-            <div className={styles.statusDescriptions}>
-              <span className={styles.text}>
-                {formatDate(parseDate(props.model?.cancelledDate.toString()), {
-                  time: true,
-                  mode: 'standard',
-                })}
-              </span>
-
-              <span className={styles.text}>{t('by', 'By')}</span>
-
-              <span className={styles.text}>
-                {props.model?.cancelledByFamilyName} &nbsp;
-                {props.model?.cancelledByGivenName}
-                <span className={styles.text}>{props.model?.cancelReason}</span>
-              </span>
-            </div>
-          </div>
-        )}
-
-        {props.model?.status === 'REJECTED' && (
-          <div>
-            <span className={styles.textHeading}>{t('rejected', 'Rejected')}:</span>
-            <div className={styles.statusDescriptions}>
-              <span className={styles.text}>
-                {formatDate(parseDate(props.model?.rejectedDate.toString()), {
-                  time: true,
-                  mode: 'standard',
-                })}
-              </span>
-
-              <span className={styles.text}>{t('by', 'By')}</span>
-
-              <span className={styles.text}>
-                {props.model?.rejectedByFamilyName} &nbsp;
-                {props.model?.rejectedByGivenName}
-                <span>{props.model?.rejectionReason}</span>
-              </span>
-            </div>
-          </div>
-        )}
-      </div>
-    </>
-  );
-};
-
-export default StockOperationStatus;