diff --git a/lib/component/quiz_container_component.dart b/lib/component/quiz_container_component.dart
index 137ad6c..97bd6f2 100644
--- a/lib/component/quiz_container_component.dart
+++ b/lib/component/quiz_container_component.dart
@@ -4,8 +4,13 @@ import 'package:quiz_app/data/models/quiz/quiz_listing_model.dart';
 
 class QuizContainerComponent extends StatelessWidget {
   final QuizListingModel data;
-  final Function(String) onTap;
-  const QuizContainerComponent({required this.data, required this.onTap, super.key});
+  final void Function(String quizId) onTap;
+
+  const QuizContainerComponent({
+    required this.data,
+    required this.onTap,
+    super.key,
+  });
 
   @override
   Widget build(BuildContext context) {
@@ -16,75 +21,78 @@ class QuizContainerComponent extends StatelessWidget {
         decoration: BoxDecoration(
           color: AppColors.background,
           borderRadius: BorderRadius.circular(12),
-          border: Border.all(
-            color: Color(0xFFE1E4E8),
-          ),
+          border: Border.all(color: const Color(0xFFE1E4E8)),
           boxShadow: [
             BoxShadow(
               color: Colors.black.withOpacity(0.03),
               blurRadius: 8,
-              offset: Offset(0, 2),
-            )
+              offset: const Offset(0, 2),
+            ),
           ],
         ),
         child: Row(
           crossAxisAlignment: CrossAxisAlignment.start,
           children: [
-            Container(
-              width: 50,
-              height: 50,
-              decoration: BoxDecoration(
-                color: Color(0xFF0052CC),
-                borderRadius: BorderRadius.circular(8),
-              ),
-              child: const Icon(Icons.school, color: Colors.white, size: 28),
-            ),
+            _buildIconBox(),
             const SizedBox(width: 12),
-            // Quiz Info
-            Expanded(
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  Text(
-                    data.title,
-                    style: TextStyle(
-                      fontSize: 16,
-                      fontWeight: FontWeight.bold,
-                      color: Color(0xFF172B4D),
-                    ),
-                  ),
-                  const SizedBox(height: 4),
-                  Text(
-                    "created by ${data.authorName}",
-                    style: TextStyle(
-                      fontSize: 12,
-                      color: Color(0xFF6B778C),
-                    ),
-                  ),
-                  const SizedBox(height: 8),
-                  Row(
-                    children: const [
-                      Icon(Icons.format_list_bulleted, size: 14, color: Color(0xFF6B778C)),
-                      SizedBox(width: 4),
-                      Text(
-                        "50 Quizzes",
-                        style: TextStyle(fontSize: 12, color: Color(0xFF6B778C)),
-                      ),
-                      SizedBox(width: 12),
-                      Icon(Icons.access_time, size: 14, color: Color(0xFF6B778C)),
-                      SizedBox(width: 4),
-                      Text(
-                        "1 hr duration",
-                        style: TextStyle(fontSize: 12, color: Color(0xFF6B778C)),
-                      ),
-                    ],
-                  )
-                ],
-              ),
-            )
+            Expanded(child: _buildQuizInfo()),
           ],
         ),
       ),
     );
   }
+
+  Widget _buildIconBox() {
+    return Container(
+      width: 50,
+      height: 50,
+      decoration: BoxDecoration(
+        color: const Color(0xFF0052CC),
+        borderRadius: BorderRadius.circular(8),
+      ),
+      child: const Icon(Icons.school, color: Colors.white, size: 28),
+    );
+  }
+
+  Widget _buildQuizInfo() {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        Text(
+          data.title,
+          style: const TextStyle(
+            fontSize: 16,
+            fontWeight: FontWeight.bold,
+            color: Color(0xFF172B4D),
+          ),
+        ),
+        const SizedBox(height: 4),
+        Text(
+          'Created by ${data.authorName}',
+          style: const TextStyle(
+            fontSize: 12,
+            color: Color(0xFF6B778C),
+          ),
+        ),
+        const SizedBox(height: 8),
+        Row(
+          children: [
+            const Icon(Icons.format_list_bulleted, size: 14, color: Color(0xFF6B778C)),
+            const SizedBox(width: 4),
+            Text(
+              '${data.totalQuiz} Quizzes',
+              style: const TextStyle(fontSize: 12, color: Color(0xFF6B778C)),
+            ),
+            const SizedBox(width: 12),
+            const Icon(Icons.access_time, size: 14, color: Color(0xFF6B778C)),
+            const SizedBox(width: 4),
+            Text(
+              '${data.duration} menit',
+              style: const TextStyle(fontSize: 12, color: Color(0xFF6B778C)),
+            ),
+          ],
+        ),
+      ],
+    );
+  }
 }
diff --git a/lib/data/models/quiz/quiz_listing_model.dart b/lib/data/models/quiz/quiz_listing_model.dart
index 7f9bfc6..3df0073 100644
--- a/lib/data/models/quiz/quiz_listing_model.dart
+++ b/lib/data/models/quiz/quiz_listing_model.dart
@@ -5,6 +5,8 @@ class QuizListingModel {
   final String title;
   final String description;
   final String date;
+  final int totalQuiz;
+  final int duration;
 
   QuizListingModel({
     required this.quizId,
@@ -13,6 +15,8 @@ class QuizListingModel {
     required this.title,
     required this.description,
     required this.date,
+    required this.duration,
+    required this.totalQuiz,
   });
 
   factory QuizListingModel.fromJson(Map<String, dynamic> json) {
@@ -23,6 +27,8 @@ class QuizListingModel {
       title: json['title'] as String,
       description: json['description'] as String,
       date: json['date'] as String,
+      duration: json['duration'] as int,
+      totalQuiz: json["total_quiz"] as int,
     );
   }
 
@@ -34,6 +40,8 @@ class QuizListingModel {
       'title': title,
       'description': description,
       'date': date,
+      'duration': duration,
+      "total_quiz": totalQuiz
     };
   }
 }