How to use a react class model or typescript to convert a known complex json response?

Question

This is the Json I want to fetch from a web service and break it down into sub-elements for display on the frontend, the best approach I thought, was to create and use a model class to capture the fetched data object and parse it into a model class object. I am getting an error on my typescript class not being recognized by on compile-time where I am importing I have provided the image

{
  "resourceType": "Patient",
  "id": "p805",
  "active": true,
  "name": [
    {
      "use": "official",
"family": "Siddiqui",
      "given": [
        "Muhammad",
        "Ahsan"
      ]
    },
    {
      "use": "usual",
      "given": [
        "Ahsan"
      ]
    }
  ],
  "telecom": [
    {
      "use": "home"
    },
    {
      "system": "phone",
      "value": "(03) 5555 6473",
      "use": "work",
      "rank": 1
    },
    {
      "system": "phone",
      "value": "(03) 3410 5613",
      "use": "mobile",
      "rank": 2
    },
    {
      "system": "phone",
      "value": "(03) 5555 8834",
      "use": "old",
      "period": {
        "end": "2014"
      }
    }
  ],
  "gender": "male",
  "birthDate": "1974-12-25",
  "_birthDate": {
    "extension": [
      {
        "url": "http://hl7.org/fhir/StructureDefinition/patient-birthTime",
        "valueDateTime": "1974-12-25T14:35:45-05:00"
      }
    ]
  },
  "deceasedBoolean": false,
  "address": [
    {
      "use": "home",
      "type": "both",
      "text": "house 305 Fosse Road SOuth off Narborough Road",
      "line": [
        "534 Erewhon St"
      ],
      "city": "Leicester",
      "district": "LE3",
      "state": "LeicesterShire",
      "postalCode": "LE3 0fQ",
      "period": {
        "start": "2014-01-01"
      }
    }
  ],
  "contact": [
    {
      "relationship": [
        {
          "coding": [
            {
              "system": "http://terminology.hl7.org/CodeSystem/v2-0131",
              "code": "N"
            }
          ]
        }
      ],
      "name": {
        "family": "du Marché",
        "_family": {
          "extension": [
            {
              "url": "http://hl7.org/fhir/StructureDefinition/humanname-own-prefix",
              "valueString": "VV"
            }
          ]
        },
        "given": [
          "Bénédicte"
        ]
      },
      "telecom": [
        {
          "system": "phone",
          "value": "+33 (237) 998327"
        }
      ],
      "address": {
        "use": "home",
        "type": "both",
        "line": [
          "534 Erewhon St"
        ],
        "city": "PleasantVille",
        "district": "Rainbow",
        "state": "Vic",
        "postalCode": "3999",
        "period": {
          "start": "1974-12-25"
        }
      },
      "gender": "female",
      "period": {
        "start": "2012"
      }
    }
  ],
  "managingOrganization": {
    "reference": ""
  }
}

And want to convert this response to an object class.

   fetch("someurl/Patient")
     .then((res) => res.json())
     .then((json) => {  
        console.log(json)                               
        setPatient(json);                       
     }) 

I made the following file in ts for all the classes needed

 export interface Patient {

    resourceType: string;
    pid:          string;
    active:       boolean;
    name:         patName[];
    telecom:      patTelecom[];
    gender:       string;
    address:      patAddress[];
    link:         patLink;
    linkcode:     number;
    birthDate:    string;
   
}

export interface patAddress {
    use:        string;
    Type:       string;
    line:       string[];
    city:       string;
    District:   string;
    State:      string;
    postalCode: string;
}

export interface patLink {
    patientname: string;
    patientcode: string;
}

export interface patName {
    use:    string;
    text:   string;
    family: string;
    given:  string[];
    prefix: string[];
    suffix: string[];
}

export interface patTelecom {
    system: string;
    value:  string;
    use:    string;
}
 

And also installed the typescript dependency npm install -g typescript and tried to import it in a react function-component but it is not importing or matching with the class object