diff --git a/gca-admin-gurusoft-message-dashboard/src/components/OverlayPopup.vue b/gca-admin-gurusoft-message-dashboard/src/components/OverlayPopup.vue
index 42d9a6a..b67ed79 100644
--- a/gca-admin-gurusoft-message-dashboard/src/components/OverlayPopup.vue
+++ b/gca-admin-gurusoft-message-dashboard/src/components/OverlayPopup.vue
@@ -5,7 +5,7 @@
   </button>
 
   <!-- Modal -->
-  <div class="modal" id="overlayPopup" tabindex="-1" aria-hidden="true">
+  <div class="modal" id="overlayPopup" tabindex="-1" aria-hidden="true" ref="overlayPopup">
     <div class="modal-dialog modal-lg modal-dialog-centered">
       <div class="modal-content rounded-0">
         <div class="modal-header justify-content-center text-center w-100 border-0">
@@ -33,11 +33,15 @@
 import {ref, onMounted} from 'vue';
 import {initializeApi} from '@/utils/api';
 
+const overlayPopup = ref(null)
+const overlayInfo = ref({})
 const api = initializeApi();
-const overlayInfo = ref({});
+
 
 onMounted(async () => {
   overlayInfo.value = await api.getOverlayPopup();
+  const modalInstance = new bootstrap.Modal(overlayPopup.value)
+  modalInstance.show()
 });
 
 </script>
\ No newline at end of file