The patient calls screen is a new feature that allows users to view a list of patients and make calls to them.

The functionality is divided into two sections: the patient list and the call screen modal.

Patient Calls Page Documentation

This documentation provides an overview of the PatientCallsPage component, its sub-components, and the strategies used for fetching data and interfacing with the Claimpower API.

Components Overview

PatientCallsPage

The PatientCallsPage component is the main entry point for displaying patient calls. It uses several sub-components and utilities to fetch and display data.

The file is found at src/pages/ui/practice/patient_calls.tsx.

Using the container/component pattern, the PatientCallsPage component fetches data from the Claimpower API and passes it to the PatientCallsList components.

Patient Calls Components

We created 3 components for the patient calls page, that can be reused for other features as well:

• patient_calls/index.component: The main component that fetches and displays patient calls
• patient_calls/modal.component: The interactive modal that opens when clicking on a patient call
• patient_calls/table.component: The list of patient calls displayed on the page

Types

We use the following types to define the data structures used in the patient calls page:

/**
 * a PatientCall is a Resource from the CLAIMPOWER API
 */
export type PatientCall = {
  patientId: string;
  firstName: string;
  lastName: string;
  balance: string;
  lastCallDate: string;
  noOfCalls: number;
  balance: number;
  batchNo: string;
  cellPhone: string;
  phone1: string;
  phone2: string;
  transeqNo: string;
  billDate: string;
  providerId: string;
  provider: string;
  facilityId: string;
  facility: string;
};

/**
 * PatientNote is a Resource from the CLAIMPOWER API
 */
export type PatientNote = {
  notetext: string,
  notecode: string,
  notelabel: string,
};

/**
 * TYpe when making a POST request to:
 * https://dhan.claimpower.com/IntakeFHIRAPIServices/PatientCallScreen/AddPatientCallsDetails
 */
export type AddCallDetail = {
  PatientId?: string;
  TranseqNo?: string;
  BatchNo?: string;
  Notes?: string;
  NoteType?: string;
  Discount?: number;
  User?: string;
};

/**
 * The following format is expected from the CLAIMPOWER API when making a GET request to
 * https://www.claimpowerehr.com/IntakeFHIRAPIServices/PatientCallScreen/GetUserInfo?user=XXX
 */
export type UserInfo = {
  pracName: string,
  doctorName: string,
  lastName: string,
  firstName: string,
  homePhone: string,
  workPhone: string,
  cellPhone: string,
  userRole: string,
  welcomeName: string,
};

export type PatientCallsDoneCount = {
  noofcalls: number,
  noofvoiceemail: number,
  amountcollected: number,
};

/**
 * PatientCallsUIPage is a UI component available for Claimpower users to review patient calls.
 */
export type PatientCallsUIPage = {
  patientCalls: PatientCall[],
  patientCallsDoneCount: PatientCallsDoneCount,
  db_name: string,
  user: string,
  claimpower_token?: string,
  userInfo?: UserInfo,
  patientNotes?: PatientNote[],
  ui_state?: UIState,
};

export type headerData = {
  noofcalls: number,
  noofvoiceemail: number,
  amountcollected: number,
  patientCallsLength: number,
};

/** Props for the modal in the component */
export type PatientCallsModal = {
  uiState: UIState,
  setUi: (state: UIState) => void,
  patientNotes: PatientNote[],
  setSelectedOption: (option: string) => void,
  selectedOption: string,
  handleSaveButtonClick: () => void,
  db_name?: string,
  onClosing?: () => void,
  /**  A string that identifies the Claimpower employee, sent in API requests */
  user?: string,
};
/**
 * PatientCallUIPage is a UI component available for Claimpower users to review a patient call.
 */
export type UIState = {
  modal_opened?: boolean,
  loading_calls?: boolean,
  toast_message?: string,
  text_area_visible?: boolean,
  item?: PatientCall,
  form_data?: AddCallDetail,
  user?: string,
  userInfo?: UserInfo,
  sent_ebill?: boolean,
  no_data_found?: boolean,
  item_request?: {
    ok: boolean,
    status: number,
    data?: {
      message: string,
    }
  }
};