diff --git a/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue b/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue
index a74a1e4..53364de 100644
--- a/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue
+++ b/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue
@@ -3,6 +3,7 @@
     <b-modal
       id="generate-csr"
       ref="modal"
+      v-model="isVisible"
       size="lg"
       no-stacking
       :title="$t('pageCertificates.modal.generateACertificateSigningRequest')"
@@ -157,7 +158,8 @@
                 <b-col lg="6">
                   <b-form-group label-for="contact-person">
                     <template #label>
-                      {{ $t('pageCertificates.modal.contactPerson') }} -
+                      {{ $t('pageCertificates.modal.contactPerson') }}
+                      -
                       <span class="form-text d-inline">
                         {{ $t('global.form.optional') }}
                       </span>
@@ -175,7 +177,8 @@
                 <b-col lg="6">
                   <b-form-group label-for="email-address">
                     <template #label>
-                      {{ $t('pageCertificates.modal.emailAddress') }} -
+                      {{ $t('pageCertificates.modal.emailAddress') }}
+                      -
                       <span class="form-text d-inline">
                         {{ $t('global.form.optional') }}
                       </span>
@@ -193,7 +196,8 @@
                 <b-col lg="12">
                   <b-form-group label-for="alternate-name">
                     <template #label>
-                      {{ $t('pageCertificates.modal.alternateName') }} -
+                      {{ $t('pageCertificates.modal.alternateName') }}
+                      -
                       <span class="form-text d-inline">
                         {{ $t('global.form.optional') }}
                       </span>
@@ -218,7 +222,8 @@
                       data-test-id="modalGenerateCsr-input-alternateName"
                     >
                       <template #add-button-text>
-                        <icon-add /> {{ $t('global.action.add') }}
+                        <icon-add />
+                        {{ $t('global.action.add') }}
                       </template>
                     </b-form-tags>
                   </b-form-group>
@@ -311,7 +316,7 @@
           </b-row>
         </b-container>
       </b-form>
-      <template #modal-footer="{ ok, cancel }">
+      <template #footer="{ ok, cancel }">
         <b-button variant="secondary" @click="cancel()">
           {{ $t('global.action.cancel') }}
         </b-button>
@@ -328,13 +333,14 @@
     </b-modal>
     <b-modal
       id="csr-string"
+      v-model="showCsrString"
       no-stacking
       size="lg"
       :title="$t('pageCertificates.modal.certificateSigningRequest')"
       @hidden="onHiddenCsrStringModal"
     >
       {{ csrString }}
-      <template #modal-footer>
+      <template #footer>
         <b-btn variant="secondary" @click="copyCsrString">
           <template v-if="csrStringCopied">
             <icon-checkmark />
@@ -375,6 +381,13 @@
   name: 'ModalGenerateCsr',
   components: { IconAdd, IconCheckmark },
   mixins: [BVToastMixin, VuelidateMixin],
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  emits: ['update:modelValue'],
   setup() {
     return {
       v$: useVuelidate(),
@@ -383,6 +396,7 @@
   data() {
     return {
       $t: useI18n().t,
+      showCsrString: false,
       form: {
         certificateType: null,
         country: null,
@@ -410,6 +424,14 @@
     };
   },
   computed: {
+    isVisible: {
+      get() {
+        return this.modelValue;
+      },
+      set(value) {
+        this.$emit('update:modelValue', value);
+      },
+    },
     certificateTypes() {
       return this.$store.getters['certificates/certificateTypes'];
     },
@@ -457,7 +479,7 @@
         .dispatch('certificates/generateCsr', this.form)
         .then(({ data: { CSRString } }) => {
           this.csrString = CSRString;
-          this.$bvModal.show('csr-string');
+          this.showCsrString = true;
           this.v$.$reset();
         });
     },