diff --git a/app/Controllers/Contacts.php b/app/Controllers/Contacts.php
index 9bc53db..a01c709 100644
--- a/app/Controllers/Contacts.php
+++ b/app/Controllers/Contacts.php
@@ -21,7 +21,11 @@ class Contacts extends Controller {
 	
 	public function view($contactid = null) {
 		$db = \Config\Database::connect();
-		$sql = "SELECT * FROM contacts where contactid='$contactid'";
+		$sql = "SELECT c.*, ct.cert_name, ct.file_url, ct.issued_date FROM contacts c 
+				LEFT join certificates_training ctt on ctt.contact_id = c.contactid
+				LEFT join certificates ct on ct.cert_id = ctt.cert_id
+				WHERE contactid=$contactid
+				order by ct.issued_date DESC";
 		$query = $db->query($sql);
 		$results = $query->getResultArray();
 		$data['contacts'] = $results;
diff --git a/app/Views/contacts_index.php b/app/Views/contacts_index.php
index 46680dc..bbf16f9 100644
--- a/app/Views/contacts_index.php
+++ b/app/Views/contacts_index.php
@@ -55,7 +55,7 @@
 		</div>
 		
 		<div id="modal" class="modal" tabindex="-1" role="dialog" aria-labelledby="tooltipmodel" aria-hidden="true">
-			<div class="modal-dialog modal-dialog-centered modal-xl">
+			<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable modal-xl">
 				<div class="modal-content">
 				</div>
 			</div>
diff --git a/app/Views/contacts_view.php b/app/Views/contacts_view.php
index a3e1ca6..bcdc998 100644
--- a/app/Views/contacts_view.php
+++ b/app/Views/contacts_view.php
@@ -11,6 +11,8 @@ $phone = $data['phone'];
 $mobile_1 = $data['mobile_1'];
 $mobile_2 = $data['mobile_2'];
 $createdate = date('d-m-Y', strtotime($data['createdate']));
+
+$totalCertificate = count($contacts);
 ?>
 <div class="modal-header">
 	<h4 class="modal-title" id="tooltipmodel">Contact Detail</h4>
@@ -50,7 +52,64 @@ $createdate = date('d-m-Y', strtotime($data['createdate']));
 	<div class='row'>
 		<div class='col-3'>Create Date</div> <div class='col-9'>: <?=$createdate;?></div>
 	</div>
+	
+
+	<?php if ( $contacts[0]['cert_name'] != null ) : ?>
+	<div class="card shadow-sm border-0 mt-4"> <!-- Sertifikat -->
+
+			<div class="card-header bg-white border-bottom pt-3 pb-2 d-flex justify-content-between align-items-center">
+				<h6 class="fw-bold mb-0 text-dark">
+					<i class="fa-solid fa-award text-primary mt-0 me-1"></i> Certificates
+				</h6>
+				<span class="badge bg-primary rounded-pill"><?=$totalCertificate;?> Files</span>
+			</div>
+				
+			<div class="list-group list-group-flush">
+
+				<?php foreach ( $contacts as $key => $value) : ?>
+					
+					<div class="list-group-item list-group-item-action d-flex justify-content-between align-items-center p-3">
+						<div class="d-flex align-items-center gap-3">
+							<div class="bg-light p-2 rounded text-center" style="width: 45px; height: 45px;">
+								<i class="fa-solid fa-file-pdf text-danger fs-4 mt-1"></i>
+							</div>
+							
+							<div>
+								<h6 class="mb-1 fw-semibold text-dark text-truncate" >
+									<?= $value['cert_name'] ?> 
+								</h6>
+								<small class="text-muted">
+									<i class="fa-regular fa-calendar-alt me-1"></i> <?php echo (date('d M Y', strtotime($data['issued_date']))); ?> 
+									<!-- &nbsp;&bull;&nbsp;  -->
+									<!-- <i class="fa-solid fa-hard-drive me-1"></i> 2.4 MB -->
+								</small>
+							</div>
+						</div>
+						
+						<div class="d-flex gap-2">
+							<a href="<?= $value['file_url'] ?>" class="btn btn-sm btn-outline-secondary text-primary border-0 bg-light" target='_blank' title="Preview" data-bs-toggle="tooltip">
+								<i class="fa-solid fa-eye"></i>
+							</a>
+							<a href="<?= $value['file_url'] ?>" download="<?= $value['cert_name'] ?>" class="btn btn-sm btn-outline-secondary text-success border-0 bg-light" title="Download" data-bs-toggle="tooltip">
+								<i class="fa-solid fa-download"></i>
+							</a>
+						</div>
+					</div>
+
+				<?php endforeach ?>
+
+			</div>
+		</div>
+	<?php endif ?>
+
 </div>
 <div class="modal-footer">
 	<button type="button" class="btn btn-info waves-effect text-white" data-bs-dismiss="modal">Close</button>
 </div>
+
+<script>
+    var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
+    var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
+        return new bootstrap.Tooltip(tooltipTriggerEl)
+    })
+</script>
\ No newline at end of file