Merge pull request #431 from bcgov/bugfix/contact-disabled-tooltip

fix: show tooltip when hovering disabled edit contact button

Author: qhanson55

frontend/src/components/contact/ContactsProponentsList.vue

@@ -235,19 +235,39 @@ onBeforeMount(() => {
         >
           <font-awesome-icon icon="fa fa-eye" />
         </Button>
-        <Button
-          aria-label="Edit contact"
-          class="p-button-lg p-button-text p-0"
-          :disabled="data.userId"
-          @click="
-            () => {
-              selection = data;
-              updateContactModalVisible = true;
-            }
-          "
+        <span
+          v-if="data.userId"
+          v-tooltip="t('contactsProponentsList.editDisabledReason')"
         >
-          <font-awesome-icon icon="fa fa-pen-to-square" />
-        </Button>
+          <Button
+            aria-label="Edit contact"
+            class="p-button-lg p-button-text p-0"
+            :disabled="data.userId"
+            @click="
+              () => {
+                selection = data;
+                updateContactModalVisible = true;
+              }
+            "
+          >
+            <font-awesome-icon icon="fa fa-pen-to-square" />
+          </Button>
+        </span>
+        <span v-else>
+          <Button
+            aria-label="Edit contact"
+            class="p-button-lg p-button-text p-0"
+            :disabled="data.userId"
+            @click="
+              () => {
+                selection = data;
+                updateContactModalVisible = true;
+              }
+            "
+          >
+            <font-awesome-icon icon="fa fa-pen-to-square" />
+          </Button>
+        </span>
         <Button
           aria-label="Delete contact"
           class="p-button-lg p-button-text p-button-danger p-0"

frontend/src/locales/en-CA.json

@@ -672,6 +672,7 @@
     "deleteContactNotLoaded": "Contact not loaded into Contact Details page",
     "deleteContactSuccess": "Contact deleted",
     "deleteContactSuccessMessage": "has been deleted.",
+    "editDisabledReason": "Edit is disabled because this is a not a manually entered contact",
     "email": "Email",
     "firstName": "First name",
     "lastName": "Last name",