diff --git a/public/js/apps/Cis/ProfilUpdateRequests.js b/public/js/apps/Cis/ProfilUpdateRequests.js
index 24e33110e..21bf32444 100755
--- a/public/js/apps/Cis/ProfilUpdateRequests.js
+++ b/public/js/apps/Cis/ProfilUpdateRequests.js
@@ -11,6 +11,59 @@ const app = Vue.createApp({
     return {
       showAll: false,
       profil_updates_table_options: {
+        
+       
+        rowContextMenu: (e, component)=>{
+
+          let menu =[];
+          if(component.getData().status === "pending"){
+            menu.push(
+              
+                {
+                    label:"<i class='fa fa-check'></i> Accept Request",
+                    action:(e, column)=>{
+                      Vue.$fhcapi.ProfilUpdate.acceptProfilRequest(column.getData()).then((res) => {
+                        this.$refs.UpdatesTable.tabulator.setData();
+                      });
+                   
+                    }
+                },
+                {
+                    separator:true,
+                },
+                {
+                    label:" <i style='width:16px' class='text-center fa fa-xmark'></i> Deny Request",
+                    action:(e, column)=>{
+                      
+                      Vue.$fhcapi.ProfilUpdate.denyProfilRequest(column.getData()).then((res) => {
+                        this.$refs.UpdatesTable.tabulator.setData();
+                      });
+                    }
+                },
+                {
+                    separator:true,
+                },
+                {
+                    label:"<i class='fa fa-eye'></i> Show Request",
+                    action:(e, column)=>{
+                      this.showModal(column.getData());
+                    }
+                }
+              
+            );
+          }else{
+            menu.push(
+              {
+                label:"<i class='fa fa-eye'></i> Show Request",
+                action:(e, column)=>{
+                  this.showModal(column.getData());
+                }
+              }
+            )
+          }
+          return menu;
+
+        } ,
         ajaxURL:FHC_JS_DATA_STORAGE_OBJECT.app_root +
         FHC_JS_DATA_STORAGE_OBJECT.ci_router +
         `/Cis/ProfilUpdate/`,
@@ -66,8 +119,6 @@ const app = Vue.createApp({
             hozAlign: "center",
             headerFilter: true,
             formatter: function (cell, para) {
-              let res = Object.getPrototypeOf(cell);
-              //console.log(res);
 
               switch (cell.getValue()) {
                 case "pending":
@@ -95,20 +146,9 @@ const app = Vue.createApp({
             hozAlign: "center",
             cellClick: (e, cell) => {
               //! function that is called when clicking on a row in the table
-
               let cellData = cell.getRow().getData();
+              this.showModal(cellData);
               
-              AcceptDenyUpdate.popup({ value: cellData })
-                .then((res) => {
-                  console.log("res of the modal: ", res);
-                  //? refetches the data, if any request was denied or accepted
-                  //* setData will call the ajaxURL again to refresh the data
-                  this.$refs.UpdatesTable.tabulator.setData();
-                })
-                .catch((e) => {
-                  //? catches the rejected Promise if the result of the modal was falsy
-                  console.log("catch of the modal: ", e);
-                });
             },
             //responsive:0,
           },
@@ -130,6 +170,19 @@ const app = Vue.createApp({
     }
   },
   methods: {
+    showModal: function(value){
+      AcceptDenyUpdate.popup({ value: value })
+                .then((res) => {
+                  console.log("res of the modal: ", res);
+                  //? refetches the data, if any request was denied or accepted
+                  //* setData will call the ajaxURL again to refresh the data
+                  this.$refs.UpdatesTable.tabulator.setData();
+                })
+                .catch((e) => {
+                  //? catches the rejected Promise if the result of the modal was falsy
+                  console.log("catch of the modal: ", e);
+                });
+    },
     updateData: function(event){
       
       this.$refs.UpdatesTable.tabulator.setData(); 
diff --git a/public/js/components/Cis/ProfilUpdate/AcceptDenyUpdate.js b/public/js/components/Cis/ProfilUpdate/AcceptDenyUpdate.js
index 896a2edf9..0e6c0c3d3 100755
--- a/public/js/components/Cis/ProfilUpdate/AcceptDenyUpdate.js
+++ b/public/js/components/Cis/ProfilUpdate/AcceptDenyUpdate.js
@@ -49,18 +49,14 @@ export default {
     },
     acceptRequest: function () {
       Vue.$fhcapi.ProfilUpdate.acceptProfilRequest(this.data).then((res) => {
-        console.log("res", res);
-        console.log("res.data", res.data);
         this.result = true;
       });
       this.hide();
     },
 
     denyRequest: function () {
-      console.log(this.data.profil_update_id);
+      
       Vue.$fhcapi.ProfilUpdate.denyProfilRequest(this.data).then((res) => {
-        console.log("res", res);
-        console.log("res.data", res.data);
         this.result = true;
       });
       this.hide();
@@ -129,14 +125,14 @@ export default {
     -->
     
    <div class="row">
-    <div  class="form-underline mb-2 col">
+    <div  class="form-underline mb-2 col-12 col-sm-6">
       <div class="form-underline-titel">Status: </div>
 
       <span  class="form-underline-content" >{{data.status}}</span>
     </div>
 
 
-    <div  class="form-underline mb-2 col">
+    <div v-if="data.status!=='pending'" class="form-underline mb-2 col-12 col-sm-6">
       <div class="form-underline-titel">Date of Status: </div>
       <!-- only status timestamp and status message can be null in the database -->
       <span  class="form-underline-content" >{{data.status_timestamp?data.status_timestamp:'-'}}</span>
@@ -144,16 +140,19 @@ export default {
 
 
     
-    <div  class="form-underline mb-2 col">
+    <div  class="form-underline mb-2 col-12 col-sm-6">
       <div class="form-underline-titel">UserID: </div>
 
       <span  class="form-underline-content" >{{data.uid}}</span>
     </div>
 
+    <div  class="form-underline mb-2 col-12 col-sm-6">
+      <div class="form-underline-titel">Name: </div>
 
+      <span  class="form-underline-content" >{{data.name}}</span>
+    </div>
 
-
-    <div  class="form-underline mb-2 col">
+    <div  class="form-underline mb-2 col-12 col-sm-6">
       <div class="form-underline-titel">Topic of Request: </div>
 
       <span  class="form-underline-content" >{{data.topic}}</span>
@@ -162,7 +161,7 @@ export default {
 
 
 
-    <div  class="form-underline mb-2 col">
+    <div  class="form-underline mb-2 col-12 col-sm-6">
       <div class="form-underline-titel">Date of Request:</div>
 
       <span  class="form-underline-content" >{{data.insertamum}}</span>