TypeScript Extensions Not Functioning as Expected in Angular Project

Question

I'm encountering an issue with TypeScript in my Angular project. I've extended a class with additional methods using TypeScript declaration files, but I'm getting the error: "Property 'toUpdatePatientRequest' does not exist on type 'Patient'." I've gone through the TypeScript extension process step by step and can't seem to find what's causing the error.

patient.model.ts

export class Patient {
    id?: string;
    patientID: string | undefined;
    rfid?: string;
    nic?: string;
    title?: string;
    name?: string;
    gender?: string;
    dob: Date | undefined;
    address?: string;
    tp?: string;
    mobile1?: string;
    mobile2?: string;
    email?: string;
    emergencyContactNumber?: string;
    bloodGroup?: string;
    isInpatient: boolean | undefined;
    vitalStatus?: 'Alive' | 'Deceased' | 'Critical' | 'Serious' | 'Stable' | 'Improving' | 'Worsening' | 'Discharged';
    registeredBy?: string;
  }
  

add-patient-request.model.ts

export class AddPatientRequest {
  rfid?: string;
  nic?: string;
  title?: string;
  name?: string;
  gender?: string;
  dob?: Date;
  address?: string;
  tp?: string;
  mobile1?: string;
  mobile2?: string;
  email?: string;
  emergencyContactNumber?: string;
  bloodGroup?: string;
  isInpatient?: boolean;
  vitalStatus?: 'Alive' | 'Deceased' | 'Critical' | 'Serious' | 'Stable' | 'Improving' | 'Worsening' | 'Discharged';
  registeredBy?: string;
}

update-patient-request.model.ts

export class UpdatePatientRequest {
  rfid?: string;
  nic?: string;
  title?: string;
  name?: string;
  gender?: string;
  dob?: Date;
  address?: string;
  tp?: string;
  mobile1?: string;
  mobile2?: string;
  email?: string;
  emergencyContactNumber?: string;
  bloodGroup?: string;
  isInpatient?: boolean;
  vitalStatus?: 'Alive' | 'Deceased' | 'Critical' | 'Serious' | 'Stable' | 'Improving' | 'Worsening' | 'Discharged';
  registeredBy?: string;
}

TypeScript Declaration Files:(patient-extentions.ts)

import { AddPatientRequest } from 'src/app/Models/DTOs/add-patient-request.model';
import { UpdatePatientRequest } from 'src/app/Models/DTOs/update-patient-request.model';
import { Patient } from "src/app/Models/Entities/patient.model";

// Extend the Patient class with conversion methods
declare module 'src/app/Models/Entities/patient.model' {
  interface Patient {
    toAddPatientRequest(): AddPatientRequest;
    toUpdatePatientRequest(): UpdatePatientRequest;
  }
}

// Extend the AddPatientRequest class with conversion methods
declare module 'src/app/Models/DTOs/add-patient-request.model' {
  interface AddPatientRequest {
    toPatient(): Patient;
  }
}

// Extend the UpdatePatientRequest class with conversion methods
declare module 'src/app/Models/DTOs/update-patient-request.model' {
  interface UpdatePatientRequest {
    toPatient(): Patient;
  }
}

// Add conversion methods to the Patient class
Patient.prototype.toAddPatientRequest = function (): AddPatientRequest {
  const addPatientRequest = new AddPatientRequest();
  addPatientRequest.rfid = this.rfid;
  addPatientRequest.nic = this.nic;
  addPatientRequest.title = this.title;
  addPatientRequest.name = this.name;
  addPatientRequest.gender = this.gender;
  addPatientRequest.dob = this.dob;
  addPatientRequest.address = this.address;
  addPatientRequest.tp = this.tp;
  addPatientRequest.mobile1 = this.mobile1;
  addPatientRequest.mobile2 = this.mobile2;
  addPatientRequest.email = this.email;
  addPatientRequest.emergencyContactNumber = this.emergencyContactNumber;
  addPatientRequest.bloodGroup = this.bloodGroup;
  addPatientRequest.isInpatient = this.isInpatient;
  addPatientRequest.vitalStatus = this.vitalStatus;
  addPatientRequest.registeredBy = this.registeredBy;
  return addPatientRequest;
};

Patient.prototype.toUpdatePatientRequest = function (): UpdatePatientRequest {
  const updatePatientRequest = new UpdatePatientRequest();
  updatePatientRequest.rfid = this.rfid;
  updatePatientRequest.nic = this.nic;
  updatePatientRequest.title = this.title;
  updatePatientRequest.name = this.name;
  updatePatientRequest.gender = this.gender;
  updatePatientRequest.dob = this.dob;
  updatePatientRequest.address = this.address;
  updatePatientRequest.tp = this.tp;
  updatePatientRequest.mobile1 = this.mobile1;
  updatePatientRequest.mobile2 = this.mobile2;
  updatePatientRequest.email = this.email;
  updatePatientRequest.emergencyContactNumber = this.emergencyContactNumber;
  updatePatientRequest.bloodGroup = this.bloodGroup;
  updatePatientRequest.isInpatient = this.isInpatient;
  updatePatientRequest.vitalStatus = this.vitalStatus;
  updatePatientRequest.registeredBy = this.registeredBy;
  return updatePatientRequest;
};

// Add conversion methods to the AddPatientRequest class
AddPatientRequest.prototype.toPatient = function (): Patient {
  const patient = new Patient();
  // Set properties of the patient instance
  patient.id = ''; // Provide a default value or specific logic to generate it
  patient.rfid = this.rfid;
  patient.nic = this.nic;
  patient.title = this.title;
  patient.name = this.name;
  patient.gender = this.gender;
  patient.dob = this.dob;
  patient.address = this.address;
  patient.tp = this.tp;
  patient.mobile1 = this.mobile1;
  patient.mobile2 = this.mobile2;
  patient.email = this.email;
  patient.emergencyContactNumber = this.emergencyContactNumber;
  patient.bloodGroup = this.bloodGroup;
  patient.isInpatient = this.isInpatient;
  patient.vitalStatus = this.vitalStatus;
  patient.registeredBy = this.registeredBy;
  return patient;
};

// Add conversion methods to the UpdatePatientRequest class
UpdatePatientRequest.prototype.toPatient = function (): Patient {
  const patient = new Patient();
  // Set properties of the patient instance
  patient.id = ''; // Provide a default value or specific logic to generate it
  patient.rfid = this.rfid;
  patient.nic = this.nic;
  patient.title = this.title;
  patient.name = this.name;
  patient.gender = this.gender;
  patient.dob = this.dob;
  patient.address = this.address;
  patient.tp = this.tp;
  patient.mobile1 = this.mobile1;
  patient.mobile2 = this.mobile2;
  patient.email = this.email;
  patient.emergencyContactNumber = this.emergencyContactNumber;
  patient.bloodGroup = this.bloodGroup;
  patient.isInpatient = this.isInpatient;
  patient.vitalStatus = this.vitalStatus;
  patient.registeredBy = this.registeredBy;
  return patient;
};

In my component (patient-edit.component.ts), I'm trying to use these methods as follows:

this.editedPatient = this.patient.toUpdatePatientRequest();

Despite following the TypeScript extension process, I still get the error. I've checked for typos and ensured that the declaration files are correctly referenced. Can anyone help me understand what might be causing this error and how to resolve it? Error in Console

Error: src/app/components/patient-CRUD/patient-edit/patient-edit.component.ts:24:41 - error TS2339: Property 'toUpdatePatientRequest' does not exist on type 'Patient'.

24 this.editedPatient = this.patient.toUpdatePatientRequest();