Flutter - nested json from API

Question

I am still new to flutter development and recently I've been trying to call API. I've managed to do so without placing data into the model and it worked fine. The issue is when I try to serialize the data. I've created a model using webinovers

https://run.mocky.io/v3/5c648026-c95a-4cf8-9a14-79f13cfb29d3

json data

{
"problems": [{
    "Diabetes":[{
        "medications":[{
            "medicationsClasses":[{
                "className":[{
                    "associatedDrug":[{
                        "name":"asprin",
                        "dose":"",
                        "strength":"500 mg"
                    }],
                    "associatedDrug#2":[{
                        "name":"somethingElse",
                        "dose":"",
                        "strength":"500 mg"
                    }]
                }],
                "className2":[{
                    "associatedDrug":[{
                        "name":"asprin",
                        "dose":"",
                        "strength":"500 mg"
                    }],
                    "associatedDrug#2":[{
                        "name":"somethingElse",
                        "dose":"",
                        "strength":"500 mg"
                    }]
                }]
            }]
        }],
        "labs":[{
            "missing_field": "missing_value"
        }]
    }],
    "Asthma":[{}]
}]}

here is my code problem_models

class AllProblem {
 late List<Problem>? problems;

 AllProblem({this.problems});
  AllProblem.fromJson(Map<dynamic, dynamic> json) {
    if (json['problems'] != null) {
      problems =  <Problem>[];
      json['problems'].forEach((v) { problems!.add( Problem.fromJson(v)); });
    }
  }
}

class Problem {
 late List<Diabete> diabetes;
 late List<Asthma> asthma;

  Problem.fromJson(Map<dynamic, dynamic> json) {
    if (json['Diabetes'] != null) {
      diabetes =  <Diabete>[];
      json['Diabetes'].forEach((v) { diabetes.add( Diabete.fromJson(v)); });
    }
    if (json['Asthma'] != null) {
      asthma = <Asthma>[];
      json['Asthma'].forEach((v) { asthma.add( Asthma.fromJson(v)); });
    }
  }

}

class Diabete {
 late List<Medication> medications;
 late List<Labs> labs;

  Diabete.fromJson(Map<dynamic, dynamic> json) {
    if (json['medications'] != null) {
      medications = <Medication>[];
      json['medications'].forEach((v) { medications.add( Medication.fromJson(v)); });
    }
    if (json['labs'] != null) {
      labs = <Labs>[];
      json['labs'].forEach((v) { labs.add( Labs.fromJson(v)); });
    }
  }

}

class Medication {
late  List<MedicationsClass> medicationsClasses;


  Medication.fromJson(Map<dynamic, dynamic> json) {
    if (json['medicationsClasses'] != null) {
      medicationsClasses = <MedicationsClass>[];
      json['medicationsClasses'].forEach((v) { medicationsClasses.add( MedicationsClass.fromJson(v)); });
    }
  }


}

class MedicationsClass {
 late List<ClassName> className;
 late List<ClassName> className2;

  MedicationsClass.fromJson(Map<dynamic, dynamic> json) {
    if (json['className'] != null) {
      className = <ClassName>[];
      json['className'].forEach((v) { className.add( ClassName.fromJson(v)); });
    }
    if (json['className2'] != null) {
      className2 = <ClassName>[];
      json['className2'].forEach((v) { className2.add( ClassName.fromJson(v)); });
    }
  }

}

class ClassName {
 late List<AssociatedDrug> associatedDrug;
 late List<AssociatedDrug> associatedDrug2;



  ClassName.fromJson(Map<dynamic, dynamic> json) {
    if (json['associatedDrug'] != null) {
      associatedDrug = <AssociatedDrug>[];
      json['associatedDrug'].forEach((v) { associatedDrug.add( AssociatedDrug.fromJson(v)); });
    }
    if (json['associatedDrug#2'] != null) {
      associatedDrug2 = <AssociatedDrug>[];
      json['associatedDrug#2'].forEach((v) { associatedDrug2.add( AssociatedDrug.fromJson(v)); });
    }
  }
}

class AssociatedDrug {
 late String name;
  String? dose;
 late String strength;

  AssociatedDrug.fromJson(Map<dynamic, dynamic> json) {
    name = json['name'];
    dose = json['dose'];
    strength = json['strength'];
  }
}

class Labs {
 late String missingField;

  Labs.fromJson(Map<dynamic, dynamic> json) {
    missingField = json['missing_field'];
  }

}

class Asthma {
  Asthma();
Asthma.fromJson(Map<dynamic, dynamic> json) {
}

Map<dynamic, dynamic> toJson() {
  final Map<dynamic, dynamic> data =  <dynamic, dynamic>{};
  return data;
}
}

resposiory_problem

import 'package:mvvp_simple/model/problems_model.dart';

abstract class ProblemsRepository{
  Future<List<AllProblem>> getAllProblem();
}

this is resposiory_problem_API

import 'dart:convert';
import 'package:mvvp_simple/model/problems_model.dart';
import 'package:mvvp_simple/repository/problem/problems_repository.dart';
import 'package:http/http.dart' as http;

class ProblemsAPI extends ProblemsRepository{

  //late AllProblem allProblem;
  @override
  Future<List<AllProblem>> getAllProblem() async{
    List<AllProblem> problemList =[];
    var apiURl = 'https://run.mocky.io/v3/5c648026-c95a-4cf8-9a14-79f13cfb29d3';
    var response = await http.get(Uri.parse(apiURl));
    if (response.statusCode == 200) {
     var data  = await jsonDecode(response.body.toString());
     problemList = data.map((problems)=> AllProblem.fromJson(problems));

     for(Map i in data){
       problemList.add(AllProblem.fromJson(i));
     }
     print(problemList);
    }
    return problemList;
  }

}

widget to fetch data

child: FutureBuilder(
                  future: HomeViewModel().fetchAllProblem(),
                  builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
                    if (snapshot.connectionState == ConnectionState.waiting) {
                      return const Loading();
                    } else {
                      print('this data loaded ${snapshot.data}' );
                      var problems = snapshot.data;
                      return Center(
                          child: ListView.builder(
                            itemCount: problems?.length,
                            itemBuilder: (context, index) =>  const ListTile(title: Text('Problem'),subtitle: Text('Medications'),),
                          ));
                    }
                  },
                ))