@ampath/esm-dha-workflow-app 4.0.0-next.43 → 4.0.0-next.445

package/src/billing/dashboard/v2/claim-visits/modal/claim-visit-details/claim-visit-details.modal.scss

@@ -0,0 +1,17 @@
+@use '@carbon/layout';
+
+/* Same rhythm as the claim's own page, so a claim read in the modal and a claim read on
+   its route are spaced alike. */
+.cvModalLayout {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    row-gap: layout.$spacing-05;
+}
+
+/* Shown when the claim itself never arrived. */
+.cvModalMessage {
+    margin: 0;
+    font-size: 0.875rem;
+    color: #8e6a00;
+}

package/src/billing/dashboard/v2/claim-visits/modal/claim-visit-details/claim-visit-details.modal.tsx

@@ -0,0 +1,56 @@
+import React from 'react';
+import styles from './claim-visit-details.modal.scss';
+import { Modal, ModalBody } from '@carbon/react';
+import ClaimVisitDetails from '../../claim-visit-details/claim-visit-details.component';
+import ClaimDetailsByToken from '../../claim-visit-details/claim-details-by-token.component';
+import { type ClaimsVisit } from '../../../types';
+interface claimVisitDetailsModalProps {
+  open: boolean;
+  locationUuid: string;
+  handleClose: () => void;
+  /** An already-loaded claim. Give this or `consentToken`. */
+  claimsVisit?: ClaimsVisit;
+  /** Load the claim live from its consent token — for callers holding a claim listing
+      rather than the claim itself. */
+  consentToken?: string;
+  /** Only meaningful alongside `claimsVisit`: whether that claim's state has been
+      confirmed live. A claim loaded from a token is live by definition. */
+  claimStateUnconfirmed?: boolean;
+}
+const ClaimVisitDetailsModal: React.FC<claimVisitDetailsModalProps> = ({
+  open,
+  claimsVisit,
+  consentToken,
+  handleClose,
+  locationUuid,
+  claimStateUnconfirmed,
+}) => {
+  return (
+    <>
+      <Modal
+        open={open}
+        size="lg"
+        onSecondarySubmit={() => {}}
+        onRequestClose={handleClose}
+        onRequestSubmit={() => {}}
+        primaryButtonText=""
+        secondaryButtonText="Close"
+      >
+        <ModalBody>
+          <div className={styles.cvModalLayout}>
+            {claimsVisit ? (
+              <ClaimVisitDetails
+                claimsVisit={claimsVisit}
+                locationUuid={locationUuid}
+                claimStateUnconfirmed={claimStateUnconfirmed}
+              />
+            ) : (
+              <ClaimDetailsByToken consentToken={consentToken ?? ''} locationUuid={locationUuid} />
+            )}
+          </div>
+        </ModalBody>
+      </Modal>
+    </>
+  );
+};
+export default ClaimVisitDetailsModal;

package/src/billing/dashboard/v2/claim-visits/modal/close-claim/close-claim.modal.tsx

@@ -0,0 +1,129 @@
+import React, { useState } from 'react';
+import { Modal, ModalBody, Select, SelectItem, TextInput } from '@carbon/react';
+import styles from './close-claim.modal.scss';
+import { addClaimItem, closeClaim } from '../../../../../billing-claims.resource';
+import { showSnackbar } from '@openmrs/esm-framework';
+import { ClaimCloseReasonType, type CloseClaimDto } from '../../../types';
+
+interface closeClaimModalProps {
+  open: boolean;
+  onClose: () => void;
+  onSuccess: () => void;
+  consentToken: string;
+  locationUuid: string;
+}
+const CloseClaimModal: React.FC<closeClaimModalProps> = ({ open, onClose, onSuccess, locationUuid, consentToken }) => {
+  const [loading, setLoading] = useState<boolean>(false);
+  const [cancelReasonType, setCancelReasonType] = useState<string>('');
+  const [cancelReason, setCancelReason] = useState<string>('');
+  const closeClaimReasonTypes = Object.values(ClaimCloseReasonType);
+  async function handleCloseClaim() {
+    setLoading(true);
+    try {
+      const closeClaimPayload = getCloseClaimPayload();
+      if (!isValidClaimClosePayload(closeClaimPayload)) {
+        return false;
+      }
+
+      const resp = await closeClaim(closeClaimPayload);
+      if ('error' in resp) {
+        showSnackbar({
+          title: 'Error Closing claim',
+          kind: 'error',
+          subtitle: 'An error occurred while closing the claim. Kindy retry or contact support',
+        });
+        onSuccess();
+      } else {
+        showSnackbar({
+          title: 'Sucess Closing Claim',
+          kind: 'success',
+          subtitle: 'Claim closed successfully',
+        });
+        onSuccess();
+      }
+    } catch (error) {
+      showSnackbar({
+        kind: 'error',
+        title: 'Error Closing Claim',
+        subtitle: 'An error occurred while closing the claim. Kindy retry or contact support',
+      });
+    } finally {
+      setLoading(false);
+    }
+  }
+  function getCloseClaimPayload(): CloseClaimDto {
+    return {
+      consentToken: consentToken,
+      cancelReasonType: cancelReasonType ?? '',
+      cancelReasonText: cancelReason ?? '',
+      locationUuid: locationUuid,
+    };
+  }
+  function holderFunction() {
+    return;
+  }
+  function cancelClaimReasonTypeHandler(cancelReasonType: string) {
+    setCancelReasonType(cancelReasonType);
+  }
+  function cancelClaimReasonHandler(cancelReason: string) {
+    setCancelReason(cancelReason);
+  }
+  function isValidClaimClosePayload(closeClaimDto: CloseClaimDto): boolean {
+    if (!closeClaimDto.cancelReasonText) {
+      showSnackbar({
+        kind: 'error',
+        title: 'Missing Cancel Reason',
+        subtitle: 'Please add a cancel reason',
+      });
+      return false;
+    }
+    if (!closeClaimDto.cancelReasonType) {
+      showSnackbar({
+        kind: 'error',
+        title: 'Missing Cancel Reason Type',
+        subtitle: 'Please add a cancel reason type',
+      });
+      return false;
+    }
+    return true;
+  }
+  return (
+    <>
+      <Modal
+        modalHeading="Close Claim"
+        open={open}
+        size="md"
+        onSecondarySubmit={onClose}
+        onRequestClose={onClose}
+        onRequestSubmit={loading ? holderFunction : handleCloseClaim}
+        primaryButtonText={loading ? 'Closing Claim...' : 'Close Claim'}
+        secondaryButtonText="Close"
+      >
+        <ModalBody>
+          <div className={styles.closeClaimModalLayout}>
+            <div className={styles.closeClaimModalRow}>
+              <Select
+                id="cancel_reason_type"
+                labelText="Cancel Reason Type"
+                onChange={($event) => cancelClaimReasonTypeHandler($event.target.value)}
+              >
+                <SelectItem value="" text="Select" />;
+                {closeClaimReasonTypes.map((c) => {
+                  return <SelectItem value={c} text={c} />;
+                })}
+              </Select>
+            </div>
+            <div className={styles.closeClaimModalRow}>
+              <TextInput
+                id="cancel_reason_text"
+                labelText="Cancel Reason"
+                onChange={($event) => cancelClaimReasonHandler($event.target.value)}
+              />
+            </div>
+          </div>
+        </ModalBody>
+      </Modal>
+    </>
+  );
+};
+export default CloseClaimModal;

package/src/billing/dashboard/v2/claim-visits/modal/submit-claim/submit-claim.modal.tsx

@@ -0,0 +1,280 @@
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { Button, Modal, ModalBody, Row, Select, SelectItem, TextInput } from '@carbon/react';
+import { submitClaim } from '../../../../../billing-claims.resource';
+import { showSnackbar, type Patient } from '@openmrs/esm-framework';
+import { DischargeReasonType, type ClaimsVisit, type SubmitClaimDto } from '../../../types';
+import { type HieClient, HieIdentificationType } from '../../../../../../registry/types';
+import type { Intervention, VisitType } from '../../../../../../claims';
+import { searchPatientByCrNumber } from '../../../../../../resources/patient-search.resource';
+import { IdentifierTypesUuids } from '../../../../../../resources/identifier-types';
+import ClaimsConsentExtension from '../../../../../../registry/modal/otp-verification-modal/extension/claims-consent.extension';
+import { useFormEncounters } from '../../../../../../death-reporting/death-reporting-form-button.resource';
+
+interface submitClaimModalProps {
+    open: boolean;
+    onClose: () => void;
+    onSuccess: () => void;
+    claimsVisit: ClaimsVisit;
+    invoiceNumber: string;
+    locationUuid: string;
+    visitType: VisitType;
+}
+const SubmitClaimModal: React.FC<submitClaimModalProps> = ({ open, onClose, onSuccess, locationUuid, claimsVisit, invoiceNumber, visitType }) => {
+    const [loading, setLoading] = useState<boolean>(false);
+    const [confirmOpen, setConfirmOpen] = useState<boolean>(false);
+    const [otp, setOtp] = useState("");
+    const [authGuid, setAuthGuid] = useState("");
+    const [dischargeReason, setDischargeReason] = useState<DischargeReasonType>();
+    const [notes, setNotes] = useState("");
+    const [deathNotificationSerialNumber, setDeathNotificationSerialNumber] = useState('');
+    const DischargeReasonTypes = Object.values(DischargeReasonType);
+    const [patient, setPatient] = useState<Patient>();
+    const [isLoadingPatient, setIsLoadingPatient] = useState(false);
+    const { hasDeathReportingFormEncounter, isLoading: isLoadingDeathReportingStatus } = useFormEncounters(
+        patient?.uuid ?? '',
+    );
+    const isDeathReportingEncounter = Boolean(patient && hasDeathReportingFormEncounter);
+    const isDeathStatusReady = Boolean(patient) && !isLoadingPatient && !isLoadingDeathReportingStatus;
+    const dateOfDeath = patient?.person?.deathDate?.match(/^\d{4}-\d{2}-\d{2}/)?.[0] ?? '';
+
+    useEffect(() => {
+        if (!isDeathStatusReady) {
+            return;
+        }
+
+        if (isDeathReportingEncounter) {
+            setDischargeReason(DischargeReasonType.DECEASED);
+            setOtp('');
+            setAuthGuid('');
+        } else {
+            setDeathNotificationSerialNumber('');
+        }
+    }, [isDeathReportingEncounter, isDeathStatusReady]);
+
+    useEffect(() => {
+        const fn = async () => {
+            setIsLoadingPatient(true);
+            try {
+                const response = await searchPatientByCrNumber(claimsVisit.member_number);
+                setPatient(response.results[0]);
+            } finally {
+                setIsLoadingPatient(false);
+            }
+        }
+
+        if (claimsVisit) {
+            setPatient(undefined);
+            fn();
+        }
+    }, [claimsVisit]);
+
+    const consentComplete = useMemo(() => {
+        if (!isDeathStatusReady) {
+            return false;
+        }
+        if (isDeathReportingEncounter) {
+            return Boolean(
+                dischargeReason === DischargeReasonType.DECEASED && deathNotificationSerialNumber.trim() && dateOfDeath,
+            );
+        }
+        if (otp || authGuid) {
+            return true;
+        }
+        return false;
+    }, [
+        isDeathReportingEncounter,
+        isDeathStatusReady,
+        dischargeReason,
+        deathNotificationSerialNumber,
+        dateOfDeath,
+        otp,
+        authGuid,
+    ]);
+
+    const invalidValues = useMemo(() => {
+        if (invoiceNumber && claimsVisit) {
+            return false;
+        }
+        return true;
+    }, [invoiceNumber, claimsVisit]);
+
+    function onClientConsent({ otp, authGuid }: { otp?: string, authGuid?: string }) {
+        if (otp) {
+            setOtp(otp);
+        }
+        if (authGuid) {
+            setAuthGuid(authGuid);
+        }
+    }
+
+    const nationalId = useMemo(() => {
+        if (patient) {
+            const identifiers = patient.identifiers;
+            return identifiers
+                ?.find((i) => i.identifierType?.uuid === IdentifierTypesUuids.NATIONAL_ID_UUID)
+                ?.identifier ?? "";
+        }
+    }, [patient]);
+
+    const consentPatient = useMemo<HieClient>(() => {
+        return {
+            id: String(claimsVisit.member_number),
+            first_name: claimsVisit.patient_name ?? '',
+            identification_type: HieIdentificationType.NationalID,
+            identification_number: nationalId ? String(nationalId) : ""
+        } as unknown as HieClient;
+    }, [claimsVisit, nationalId]);
+
+    const getIntervention = () => {
+        const interventions = claimsVisit.interventions;
+        if (interventions && interventions.length) {
+            const intervention = interventions[interventions.length - 1];
+            return {
+                code: intervention.intervention_code,
+                paymentMechanism: intervention.intervention_payment_mechanism
+            } as Intervention;
+        }
+    }
+
+    async function handleSubmitClaim() {
+        setConfirmOpen(false);
+        setLoading(true);
+        try {
+            const submitClaimPayload = getSubmitClaimPayload();
+            const resp = await submitClaim(submitClaimPayload, claimsVisit.service_type);
+            if ('error' in resp) {
+                let message = 'message' in resp ? String(resp?.message) : "An error occurred while submitting the claim. Kindy retry or contact support"
+                showSnackbar({
+                    title: 'Error submitting claim',
+                    kind: 'error',
+                    subtitle: message,
+                });
+                onSuccess();
+            } else {
+                showSnackbar({
+                    title: 'Success submitting claim',
+                    kind: 'success',
+                    subtitle: 'Claim submitted successfully',
+                });
+                onSuccess();
+            }
+        } catch (error) {
+            showSnackbar({
+                kind: 'error',
+                title: 'Error submitting claim',
+                subtitle: 'An error occurred while submitting the claim. Kindy retry or contact support',
+            });
+        } finally {
+            setLoading(false);
+        }
+    }
+    function getSubmitClaimPayload(): SubmitClaimDto {
+        const payload = {
+            consentToken: claimsVisit.authorization_code,
+            invoiceNumber,
+            locationUuid,
+            dischargeReason,
+        } as SubmitClaimDto & Record<string, unknown>;
+        if (isDeathReportingEncounter) {
+            payload['deathNotificationSerialNumber'] = deathNotificationSerialNumber.trim();
+            payload['dateOfDeath'] = dateOfDeath;
+        }
+        if (otp) {
+            payload["otp"] = otp;
+        }
+        if (authGuid) {
+            payload["dischargeAuthGuid"] = authGuid;
+        }
+        if (notes) {
+            payload["notes"] = notes;
+        }
+        return payload;
+    }
+    function holderFunction() {
+        return;
+    }
+    return (
+        <>
+            <Modal
+                modalHeading="Submit Claim"
+                open={open}
+                size="md"
+                onSecondarySubmit={onClose}
+                onRequestClose={onClose}
+                onRequestSubmit={!invalidValues ? (loading ? holderFunction : (consentComplete ? () => setConfirmOpen(true) : undefined)) : undefined}
+                primaryButtonText={!invalidValues ? (loading ? 'Submitting claim...' : (consentComplete ? 'Submit claim' : null)) : null}
+                secondaryButtonText="Close"
+            >
+                <ModalBody>
+                    <Row>
+                        <Select
+                            id="discharge-reason"
+                            labelText="Discharge reason"
+                            value={dischargeReason ?? ''}
+                            disabled={isDeathReportingEncounter}
+                            onChange={($event) => setDischargeReason($event.target.value as DischargeReasonType)}
+                        >
+                            <SelectItem value="" text="Select" />;
+                            {DischargeReasonTypes.map((c) => {
+                                return <SelectItem value={c} text={c} />;
+                            })}
+                        </Select>
+                    </Row>
+                    {isDeathReportingEncounter && (
+                        <>
+                            <Row>
+                                <TextInput
+                                    id="death-notification-serial-number"
+                                    labelText="Death notification serial number"
+                                    value={deathNotificationSerialNumber}
+                                    required
+                                    onChange={($event) => setDeathNotificationSerialNumber($event.target.value)}
+                                />
+                            </Row>
+                            <Row>
+                                <TextInput
+                                    id="date-of-death"
+                                    type="date"
+                                    labelText="Date of death"
+                                    value={dateOfDeath}
+                                    required
+                                    readOnly
+                                    invalid={!dateOfDeath}
+                                    invalidText="No date of death is recorded for this patient. Update the patient record before submitting."
+                                />
+                            </Row>
+                        </>
+                    )}
+                    <Row>
+                        <TextInput
+                            id="notes"
+                            labelText="Notes"
+                            onChange={($event) => setNotes($event.target.value)}
+                        />
+                    </Row>
+                    {
+                        (isDeathStatusReady && !isDeathReportingEncounter && dischargeReason && notes && getIntervention()) &&
+                        <ClaimsConsentExtension patient={consentPatient} intervention={getIntervention()!} crIdentifierId={claimsVisit.member_number} visitType={visitType} onClientConsent={onClientConsent} consentToken={claimsVisit.authorization_code} isDischarge={true}/>
+                    }
+                </ModalBody>
+            </Modal>
+            <Modal
+                modalHeading="Confirm claim submission"
+                open={confirmOpen}
+                size="sm"
+                onRequestClose={() => setConfirmOpen(false)}
+                onRequestSubmit={handleSubmitClaim}
+                primaryButtonText="Yes, submit claim"
+                secondaryButtonText="Cancel"
+            >
+                <ModalBody>
+                    <p>
+                        Are you sure you want to submit this claim to SHA? Please confirm the details are correct — this
+                        can’t be undone.
+                    </p>
+                </ModalBody>
+            </Modal>
+        </>
+    );
+};
+export default SubmitClaimModal;

package/src/billing/dashboard/v2/claim-visits/shared/_empty-state.scss

@@ -0,0 +1,28 @@
+/* The look a section wears when what is missing from it is holding the claim up, as
+   against a section that simply happens to be unused.
+
+   Shared rather than written twice: the diagnoses table and the doctors line render their
+   empty states from different components, and if the two drifted apart the colour would
+   stop meaning one thing. */
+
+@mixin blocking-callout {
+  display: flex;
+  align-items: flex-start;
+  gap: 0.5rem;
+  margin: 0;
+  padding: 0.75rem;
+  border-left: 3px solid #da1e28;
+  background: #fff1f1;
+  font-size: 0.8125rem;
+  font-weight: 500;
+  line-height: 1.4;
+  color: #a2191f;
+  overflow-wrap: anywhere;
+}
+
+@mixin blocking-callout-icon {
+  flex-shrink: 0;
+  /* Lines the glyph up with the first line of text beside it. */
+  margin-top: 0.0625rem;
+  color: #da1e28;
+}