From c114488531deaced3172b50c038a4d2961f972ca Mon Sep 17 00:00:00 2001
From: Nabil Ananthamangalath <nabilmanjeri@gmail.com>
Date: Wed, 8 Jan 2025 15:50:37 +0530
Subject: [PATCH] Vue3: Add error toast message when CSR generation fails

 - Read-only user will now see a error toast message when trying to generate a CSR.

 - Defect: https://jazz07.rchland.ibm.com:13443/jazz/web/projects/CSSD#action=com.ibm.team.workitem.viewWorkItem&id=671025

Signed-off-by: Nabil Ananthamangalath <nabilmanjeri@gmail.com>
---
 src/locales/en-US.json                         |  1 +
 .../SecurityAndAccess/CertificatesStore.js     |  7 ++++++-
 .../Certificates/ModalGenerateCsr.vue          | 18 ++++++++++++------
 3 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/src/locales/en-US.json b/src/locales/en-US.json
index 6380fb021d..d7bf14f8dd 100644
--- a/src/locales/en-US.json
+++ b/src/locales/en-US.json
@@ -382,6 +382,7 @@
       "errorAddCertificate": "Error adding certificate.",
       "errorDeleteCertificate": "Error deleting certificate.",
       "errorReplaceCertificate": "Error replacing certificate.",
+      "errorGenerateCsr": "Error generating CSR.",
       "successAddCertificate": "Successfully added %{certificate}.",
       "successAddedHTTPCertificate": "Successfully added %{certificate}. Reload the browser page to see the changes.",
       "successDeleteCertificate": "Successfully deleted %{certificate}.",
diff --git a/src/store/modules/SecurityAndAccess/CertificatesStore.js b/src/store/modules/SecurityAndAccess/CertificatesStore.js
index 9ba470c1a4..4b1b2dd5e6 100644
--- a/src/store/modules/SecurityAndAccess/CertificatesStore.js
+++ b/src/store/modules/SecurityAndAccess/CertificatesStore.js
@@ -384,7 +384,12 @@ export const CertificatesStore = defineStore('certificates', {
         )
         //TODO: Success response also throws error so
         // can't accurately show legitimate error in UI
-        .catch((error) => console.log(error));
+        .catch((error) => {
+          console.log(error);
+          throw new Error(
+            i18n.global.t('pageCertificates.toast.errorGenerateCsr')
+          );
+        });
     },
   },
 });
diff --git a/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue b/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue
index 79018924ce..50cdbf58af 100644
--- a/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue
+++ b/src/views/SecurityAndAccess/Certificates/ModalGenerateCsr.vue
@@ -355,11 +355,14 @@ import { CertificatesStore } from '@/store';
 
 import IconAdd from '@carbon/icons-vue/es/add--alt/20';
 
+import useToast from '@/components/Composables/useToastComposable';
 import { COUNTRY_LIST } from './CsrCountryCodes';
 import { CERTIFICATE_TYPES } from '@/store/modules/SecurityAndAccess/CertificatesStore';
 import useVuelidateComposable from '@/components/Composables/useVuelidateComposable';
 import eventBus from '@/eventBus';
 
+const { errorToast } = useToast();
+
 const { getValidationState } = useVuelidateComposable();
 const openCsrModal = ref(false);
 const uploadCertificate = CertificatesStore();
@@ -432,12 +435,15 @@ const modal = ref(false);
 const handleSubmit = () => {
   v$.value.$touch();
   if (v$.value.$invalid) return;
-  uploadCertificate.generateCsr(form.value).then(({ data: { CSRString } }) => {
-    csrString.value = CSRString;
-    modal.value = false;
-    openCsrModal.value = true;
-    v$.value.form.$reset();
-  });
+  uploadCertificate
+    .generateCsr(form.value)
+    .then(({ data: { CSRString } }) => {
+      csrString.value = CSRString;
+      modal.value = false;
+      openCsrModal.value = true;
+      v$.value.form.$reset();
+    })
+    .catch(({ message }) => errorToast(message));
 };
 
 const resetCsr = () => {