From baa4d7f4cdcdf8d9abc0dff8353f60a09e050c8d Mon Sep 17 00:00:00 2001
From: Donald Kibet <chelashawdonald@yahoo.com>
Date: Tue, 6 Aug 2024 14:56:47 +0300
Subject: [PATCH] Revert "Update billable services workspace (#267)" (#298)

This reverts commit 5b81cb1f1b18efb249fc59117cd7b3005181850f.
---
 kenyaemr-esm-3.x                              |   1 -
 .../billable-services.component.tsx           |  12 +-
 .../update-billable-service.component.tsx     | 368 ------------------
 .../create-edit/update-billable-services.scss |  38 --
 packages/esm-billing-app/src/index.ts         |  14 +-
 packages/esm-billing-app/src/routes.json      |   9 -
 6 files changed, 14 insertions(+), 428 deletions(-)
 delete mode 160000 kenyaemr-esm-3.x
 delete mode 100644 packages/esm-billing-app/src/billable-services/create-edit/update-billable-service.component.tsx
 delete mode 100644 packages/esm-billing-app/src/billable-services/create-edit/update-billable-services.scss

diff --git a/kenyaemr-esm-3.x b/kenyaemr-esm-3.x
deleted file mode 160000
index a0a11015b..000000000
--- a/kenyaemr-esm-3.x
+++ /dev/null
@@ -1 +0,0 @@
-Subproject commit a0a11015b4da58ebdb873afe6d61c8c2ff125688
diff --git a/packages/esm-billing-app/src/billable-services/billable-services.component.tsx b/packages/esm-billing-app/src/billable-services/billable-services.component.tsx
index 8c8b2d263..58053c2b0 100644
--- a/packages/esm-billing-app/src/billable-services/billable-services.component.tsx
+++ b/packages/esm-billing-app/src/billable-services/billable-services.component.tsx
@@ -24,13 +24,12 @@ import {
   ErrorState,
   navigate,
   WorkspaceContainer,
-  launchWorkspace,
 } from '@openmrs/esm-framework';
 import { EmptyState } from '@openmrs/esm-patient-common-lib';
 import styles from './billable-services.scss';
 import { useTranslation } from 'react-i18next';
 import { useBillableServices } from './billable-service.resource';
-import { ArrowRight, Edit } from '@carbon/react/icons';
+import { ArrowRight } from '@carbon/react/icons';
 
 const BillableServices = () => {
   const { t } = useTranslation();
@@ -46,12 +45,6 @@ const BillableServices = () => {
   const [showOverlay, setShowOverlay] = useState(false);
   const [overlayHeader, setOverlayTitle] = useState('');
 
-  const handleEditClick = (service) => {
-    launchWorkspace('update-billable-services-workspace', {
-      service,
-    });
-  };
-
   const headerData = [
     {
       header: t('serviceName', 'Service Name'),
@@ -110,7 +103,7 @@ const BillableServices = () => {
         serviceType: service?.serviceType?.display,
         status: service.serviceStatus,
         prices: '--',
-        actions: <Edit onClick={() => handleEditClick(service)} style={{ cursor: 'pointer' }} />,
+        actions: '--',
       };
       let cost = '';
       service.servicePrices.forEach((price) => {
@@ -145,7 +138,6 @@ const BillableServices = () => {
 
   return (
     <>
-      <WorkspaceContainer overlay contextKey="billable-services" />
       {billableServices?.length > 0 ? (
         <div className={styles.serviceContainer}>
           <FilterableTableHeader
diff --git a/packages/esm-billing-app/src/billable-services/create-edit/update-billable-service.component.tsx b/packages/esm-billing-app/src/billable-services/create-edit/update-billable-service.component.tsx
deleted file mode 100644
index c26b9cc8e..000000000
--- a/packages/esm-billing-app/src/billable-services/create-edit/update-billable-service.component.tsx
+++ /dev/null
@@ -1,368 +0,0 @@
-import React, { useCallback, useEffect, useRef, useState } from 'react';
-import styles from './update-billable-services.scss';
-import {
-  Form,
-  Button,
-  TextInput,
-  ComboBox,
-  Dropdown,
-  Layer,
-  InlineLoading,
-  Search,
-  Tile,
-  FormLabel,
-} from '@carbon/react';
-import { useTranslation } from 'react-i18next';
-import {
-  createBillableService,
-  useConceptsSearch,
-  usePaymentModes,
-  useServiceTypes,
-} from '../billable-service.resource';
-import { Controller, useFieldArray, useForm } from 'react-hook-form';
-import { Add, TrashCan, WarningFilled } from '@carbon/react/icons';
-import { z } from 'zod';
-import { zodResolver } from '@hookform/resolvers/zod';
-import { navigate, showSnackbar, useDebounce, useLayoutType } from '@openmrs/esm-framework';
-import { ServiceConcept } from '../../types';
-import { extractErrorMessagesFromResponse } from '../../utils';
-
-const servicePriceSchema = z.object({
-  paymentMode: z.string({ required_error: 'Payment method is required' }),
-  price: z
-    .string()
-    .refine((value) => !isNaN(Number(value)), 'Value must be a number')
-    .refine((value) => parseInt(value) > 0, 'Price should be a number more than zero')
-    .refine((value) => !!value, 'Price is required'),
-});
-
-const paymentFormSchema = z.object({
-  payment: z.array(servicePriceSchema).min(1, 'At least one payment method is required'),
-  serviceName: z.string({
-    required_error: 'Service name is required',
-  }),
-  shortName: z.string({ required_error: 'A valid short name is required.' }),
-  serviceTypeName: z.string({ required_error: 'A service type is required' }),
-  concept: z.string({ required_error: 'Concept search is required.' }),
-});
-
-type FormData = z.infer<typeof paymentFormSchema>;
-const DEFAULT_PAYMENT_OPTION = { paymentMode: '', price: '1' };
-
-const UpdateBillableServicesDialog: React.FC<{ closeWorkspace: () => void; service: any }> = ({
-  closeWorkspace,
-  service,
-}) => {
-  const { t } = useTranslation();
-
-  const { paymentModes, isLoading: isLoadingPaymentModes } = usePaymentModes();
-  const { serviceTypes, isLoading: isLoadingServicesTypes } = useServiceTypes();
-
-  const {
-    control,
-    handleSubmit,
-    formState: { errors, isValid },
-    setValue,
-  } = useForm<FormData>({
-    mode: 'all',
-    resolver: zodResolver(paymentFormSchema),
-  });
-
-  const { fields, remove, append } = useFieldArray({ name: 'payment', control: control });
-
-  const handleAppendPaymentMode = useCallback(() => append(DEFAULT_PAYMENT_OPTION), [append]);
-  const handleRemovePaymentMode = useCallback((index) => remove(index), [remove]);
-
-  const isTablet = useLayoutType() === 'tablet';
-  const searchInputRef = useRef(null);
-  const handleSearchTermChange = (event: React.ChangeEvent<HTMLInputElement>) => setSearchTerm(event.target.value);
-
-  const [selectedConcept, setSelectedConcept] = useState<ServiceConcept>(service?.concept);
-  const [searchTerm, setSearchTerm] = useState('');
-  const debouncedSearchTerm = useDebounce(searchTerm);
-  const { searchResults, isSearching } = useConceptsSearch(debouncedSearchTerm);
-
-  const handleConceptChange = useCallback((selectedConcept: ServiceConcept) => {
-    setSelectedConcept(selectedConcept);
-  }, []);
-
-  const handleNavigateToServiceDashboard = () =>
-    navigate({
-      to: window.getOpenmrsSpaBase() + 'billable-services',
-    });
-
-  const onSubmit = (data: FormData) => {
-    const payload: any = {};
-
-    let servicePrices = data.payment
-      ? data.payment.map((element) => {
-          return {
-            name: paymentModes.find((p) => p.uuid === element.paymentMode)?.name || '',
-            price: element.price.toString(),
-            paymentMode: element.paymentMode,
-          };
-        })
-      : [];
-
-    payload.name = data.serviceName;
-    payload.shortName = data.shortName;
-    payload.serviceType = data.serviceTypeName;
-    payload.servicePrices = servicePrices;
-    payload.serviceStatus = 'ENABLED';
-    payload.concept = selectedConcept?.concept?.uuid;
-    payload.uuid = service.uuid;
-
-    createBillableService(payload).then(
-      (resp) => {
-        showSnackbar({
-          title: t('billableService', 'Billable service'),
-          subtitle: 'Billable service updated successfully',
-          kind: 'success',
-          isLowContrast: true,
-          timeoutInMs: 3000,
-        });
-        closeWorkspace();
-      },
-      (error) => {
-        showSnackbar({
-          title: 'Error updating billable service',
-          kind: 'error',
-          subtitle: extractErrorMessagesFromResponse(error.responseBody),
-          isLowContrast: true,
-        });
-      },
-    );
-  };
-
-  useEffect(() => {
-    if (service) {
-      setValue('serviceName', service.name);
-      setValue('shortName', service.shortName);
-      setValue('serviceTypeName', service.serviceType.display);
-      setValue('concept', service.concept?.display || '');
-      setValue(
-        'payment',
-        service.servicePrices.map((price) => ({
-          paymentMode: paymentModes.find((mode) => mode.uuid === price.paymentMode),
-          price: price.price.toString(),
-        })),
-      );
-    }
-  }, [service, setValue, paymentModes]);
-
-  if (isLoadingServicesTypes || isLoadingPaymentModes) {
-    return (
-      <div className={styles.searchWrapper}>
-        <InlineLoading className={styles.loader} description={t('searching', 'Searching') + '...'} />
-      </div>
-    );
-  }
-
-  return (
-    <Form className={styles.form} onSubmit={handleSubmit(onSubmit)}>
-      <section className={`${styles.section}`}>
-        <section className={styles.section}>
-          <Layer>
-            <Controller
-              control={control}
-              name="serviceName"
-              render={({ field }) => (
-                <Layer>
-                  <TextInput
-                    {...field}
-                    id="serviceName"
-                    type="text"
-                    labelText={t('serviceName', 'Service Name')}
-                    size="md"
-                    placeholder="Enter service name"
-                    invalidText={errors.serviceName?.message || ''}
-                    invalid={!!errors.serviceName}
-                  />
-                </Layer>
-              )}
-            />
-          </Layer>
-          <Layer>
-            <Controller
-              control={control}
-              name="shortName"
-              render={({ field }) => (
-                <Layer>
-                  <TextInput
-                    id="serviceShortName"
-                    {...field}
-                    type="text"
-                    labelText={t('serviceShortName', 'Short Name')}
-                    size="md"
-                    placeholder="Enter service short name"
-                    invalidText={errors.shortName?.message}
-                    invalid={!!errors.shortName}
-                  />
-                </Layer>
-              )}
-            />
-          </Layer>
-          <Layer>
-            <Controller
-              control={control}
-              name="serviceTypeName"
-              render={({ field }) => (
-                <ComboBox
-                  id="serviceType"
-                  items={serviceTypes ?? []}
-                  titleText={t('serviceType', 'Service Type')}
-                  itemToString={(item: { display: string }) => (item ? item.display : '')}
-                  placeholder="Select service type"
-                  required
-                  {...field}
-                  onChange={({ selectedItem }) => field.onChange(selectedItem ? selectedItem.display : '')}
-                  invalidText={errors.serviceTypeName?.message || ''}
-                  invalid={!!errors.serviceTypeName}
-                />
-              )}
-            />
-          </Layer>
-          <FormLabel className={styles.conceptLabel}>Associated Concept</FormLabel>
-          <Controller
-            name="concept"
-            control={control}
-            render={({ field: { onChange, value, onBlur } }) => (
-              <ResponsiveWrapper isTablet={isTablet}>
-                <Search
-                  ref={searchInputRef}
-                  size="md"
-                  id="conceptsSearch"
-                  labelText={t('enterConcept', 'Associated concept')}
-                  placeholder={t('searchConcepts', 'Search associated concept')}
-                  className={errors?.concept && styles.serviceError}
-                  onChange={(e) => {
-                    onChange(e);
-                    handleSearchTermChange(e);
-                  }}
-                  renderIcon={errors?.concept && <WarningFilled />}
-                  onBlur={onBlur}
-                  onClear={() => {
-                    setSearchTerm('');
-                    setSelectedConcept(null);
-                  }}
-                  value={(() => {
-                    if (selectedConcept) {
-                      return selectedConcept.display;
-                    }
-                    if (debouncedSearchTerm) {
-                      return value;
-                    }
-                  })()}
-                />
-              </ResponsiveWrapper>
-            )}
-          />
-          {(() => {
-            if (!debouncedSearchTerm || selectedConcept) {
-              return null;
-            }
-            if (isSearching) {
-              return <InlineLoading className={styles.loader} description={t('searching', 'Searching') + '...'} />;
-            }
-            if (searchResults && searchResults.length) {
-              return (
-                <ul className={styles.conceptsList}>
-                  {searchResults?.map((searchResult, index) => (
-                    <li
-                      role="menuitem"
-                      className={styles.service}
-                      key={index}
-                      onClick={() => handleConceptChange(searchResult)}>
-                      {searchResult.display}
-                    </li>
-                  ))}
-                </ul>
-              );
-            }
-            return (
-              <Layer>
-                <Tile className={styles.emptyResults}>
-                  <span>
-                    {t('noResultsFor', 'No results for')} <strong>"{debouncedSearchTerm}"</strong>
-                  </span>
-                </Tile>
-              </Layer>
-            );
-          })()}
-          {fields.map((field, index) => (
-            <div key={field.id} className={styles.paymentMethodContainer}>
-              <Controller
-                control={control}
-                name={`payment.${index}.paymentMode`}
-                render={({ field }) => (
-                  <Layer>
-                    <Dropdown
-                      id={`paymentMode-${index}`}
-                      onChange={({ selectedItem }) => field.onChange(selectedItem?.uuid)}
-                      titleText={t('paymentMode', 'Payment Mode')}
-                      label={t('selectPaymentMethod', 'Select payment method')}
-                      items={paymentModes ?? []}
-                      itemToString={(item) => (item ? item.name : '')}
-                      invalid={!!errors?.payment?.[index]?.paymentMode}
-                      invalidText={errors?.payment?.[index]?.paymentMode?.message}
-                      initialSelectedItem={paymentModes.find((mode) => mode.uuid === field.value)}
-                    />
-                  </Layer>
-                )}
-              />
-              <Controller
-                control={control}
-                name={`payment.${index}.price`}
-                render={({ field }) => (
-                  <Layer>
-                    <TextInput
-                      id={`price-${index}`}
-                      {...field}
-                      invalid={!!errors?.payment?.[index]?.price}
-                      invalidText={errors?.payment?.[index]?.price?.message}
-                      labelText={t('sellingPrice', 'Selling Price')}
-                      placeholder={t('sellingAmount', 'Enter selling price')}
-                    />
-                  </Layer>
-                )}
-              />
-              <div>
-                <br />
-                <TrashCan
-                  aria-label={`delete_${index}`}
-                  id={`delete_${index}`}
-                  onClick={() => handleRemovePaymentMode(index)}
-                  className={styles.removeButton}
-                  size={20}
-                />
-              </div>
-            </div>
-          ))}
-          <br />
-          <Button
-            size="md"
-            onClick={handleAppendPaymentMode}
-            className={styles.paymentButtons}
-            renderIcon={(props) => <Add size={24} {...props} />}
-            iconDescription="Add">
-            {t('addPaymentOptions', 'Add payment option')}
-          </Button>
-          <br />
-          <br />
-          <Button kind="secondary" className={styles.buttonLayout} onClick={closeWorkspace}>
-            {t('cancel', 'Cancel')}
-          </Button>
-          <Button type="submit" className={styles.button}>
-            {t('update', 'Update')}
-          </Button>
-        </section>
-      </section>
-    </Form>
-  );
-};
-
-function ResponsiveWrapper({ children, isTablet }: { children: React.ReactNode; isTablet: boolean }) {
-  return isTablet ? <Layer>{children} </Layer> : <>{children}</>;
-}
-
-export default UpdateBillableServicesDialog;
diff --git a/packages/esm-billing-app/src/billable-services/create-edit/update-billable-services.scss b/packages/esm-billing-app/src/billable-services/create-edit/update-billable-services.scss
deleted file mode 100644
index 466c65b0c..000000000
--- a/packages/esm-billing-app/src/billable-services/create-edit/update-billable-services.scss
+++ /dev/null
@@ -1,38 +0,0 @@
-@use '@carbon/styles/scss/spacing';
-@use '@carbon/styles/scss/type';
-
-.radioButton {
-  padding: spacing.$spacing-02 spacing.$spacing-02;
-  margin: spacing.$spacing-03 0;
-}
-
-.section {
-  margin: spacing.$spacing-03;
-}
-
-.sectionTitle {
-  margin-bottom: spacing.$spacing-04;
-}
-
-.modalBody {
-  padding-bottom: spacing.$spacing-05;
-}
-
-.container {
-  display: 'flex';
-  align-items: 'center';
-  justify-content: 'space-between';
-  align-content: 'stretch';
-}
-
-.specimenContainer {
-  display: 'flex';
-  align-items: 'center';
-  justify-content: 'space-between';
-  column-gap: '10px';
-}
-
-.inputText {
-  display: 'flex';
-  align-items: 'center';
-}
diff --git a/packages/esm-billing-app/src/index.ts b/packages/esm-billing-app/src/index.ts
index 590f54d3f..f62057bea 100644
--- a/packages/esm-billing-app/src/index.ts
+++ b/packages/esm-billing-app/src/index.ts
@@ -22,7 +22,6 @@ import { DeleteBillModal } from './billable-services/bill-manager/modals/delete-
 import PriceInfoOrder from './billable-services/billiable-item/test-order/price-info-order.componet';
 import ProcedureOrder from './billable-services/billiable-item/test-order/procedure-order.component';
 import ImagingOrder from './billable-services/billiable-item/test-order/imaging-order.component';
-import UpdateBillableServicesDialog from './billable-services/create-edit/update-billable-service.component';
 
 const moduleName = '@kenyaemr/esm-billing-app';
 
@@ -63,4 +62,15 @@ export const procedureOrder = getSyncLifecycle(ProcedureOrder, options);
 export const imagingOrder = getSyncLifecycle(ImagingOrder, options);
 export const drugOrder = getSyncLifecycle(DrugOrder, options);
 export const testOrderAction = getSyncLifecycle(TestOrderAction, options);
-export const updateBillableServicesWorkspace = getSyncLifecycle(UpdateBillableServicesDialog, options);
+
+// bill manager modals
+export const cancelBillModal = getSyncLifecycle(CancelBillModal, options);
+export const deleteBillModal = getSyncLifecycle(DeleteBillModal, options);
+
+// bill manager extensions
+export const waiveBillForm = getSyncLifecycle(WaiveBillForm, options);
+export const editBillForm = getSyncLifecycle(EditBillForm, options);
+
+export function startupApp() {
+  defineConfigSchema(moduleName, configSchema);
+}
diff --git a/packages/esm-billing-app/src/routes.json b/packages/esm-billing-app/src/routes.json
index bce529736..168c9c269 100644
--- a/packages/esm-billing-app/src/routes.json
+++ b/packages/esm-billing-app/src/routes.json
@@ -118,15 +118,6 @@
       "slot": "tests-ordered-actions-slot",
       "order": 0
     }
-    
-  ],
-  "workspaces": [
-    {
-      "name": "update-billable-services-workspace",
-      "title": "Update Billable Services",
-      "component": "updateBillableServicesWorkspace",
-      "type": "workspace"
-    }
   ],
   "workspaces": [
     {