fix legacy angular tooltips (#2141)

* fix tooltip attribute name

* fix tooltip messages

Author: PhilBastian

src/Frontend/src/components/failedmessages/EditMessageHeader.vue

@@ -43,26 +43,26 @@ onMounted(() => {
     <span :class="{ 'header-removed': header.isMarkedAsRemoved }">{{ settings.header.key }}</span>
     <span v-if="header.isLocked">
       &nbsp;
-      <i class="fa fa-lock" tooltip="Protected system header"></i>
+      <i class="fa fa-lock" v-tippy="`Protected system header`"></i>
     </span>
     <span v-if="(header.isChanged || header.isMarkedAsRemoved) && header.isSensitive">
       &nbsp;
-      <i class="fa fa-exclamation-triangle" uib-tooltip="This is a sensitive message header that if changed can the system behavior. Proceed with caution."></i>
+      <i class="fa fa-exclamation-triangle" v-tippy="`This is a sensitive message header that if changed can the system behavior. Proceed with caution.`"></i>
     </span>
     <span v-if="header.isChanged">
       &nbsp;
-      <i class="fa fa-pencil" tooltip="Edited"></i>
+      <i class="fa fa-pencil" v-tippy="`Edited`"></i>
     </span>
   </td>
   <td>
     <input :class="{ 'header-removed': header.isMarkedAsRemoved }" class="form-control" :disabled="header.isLocked" v-model="header.value" />
   </td>
   <td>
     <a v-if="!header.isLocked && !header.isMarkedAsRemoved" @click="markHeaderAsRemoved()">
-      <i class="fa fa-trash" tooltip="Protected system header"></i>
+      <i class="fa fa-trash" v-tippy="`Remove header`"></i>
     </a>
     <a v-if="header.isChanged" @click="resetHeaderChanges()">
-      <i class="fa fa-undo" tooltip="Protected system header"></i>
+      <i class="fa fa-undo" v-tippy="`Reset changes`"></i>
     </a>
   </td>
 </template>

src/Frontend/src/components/failedmessages/EditRetryDialog.vue

@@ -216,7 +216,7 @@ onMounted(() => {
                       <div role="tabpanel" v-if="panel === 2 && !localMessage?.bodyUnavailable" style="height: calc(100% - 260px)">
                         <textarea aria-label="message body" class="form-control" :disabled="!localMessage?.isContentTypeSupported" v-model="localMessage.messageBody"></textarea>
                         <span class="empty-error" v-if="localMessage?.isBodyEmpty"><i class="fa fa-exclamation-triangle"></i> Message body cannot be empty</span>
-                        <span class="reset-body" v-if="localMessage?.isBodyChanged"><i class="fa fa-undo" uib-tooltip="Reset changes"></i> <a @click="resetBodyChanges()" href="javascript:void(0)">Reset changes</a></span>
+                        <span class="reset-body" v-if="localMessage?.isBodyChanged"><i class="fa fa-undo" v-tippy="`Reset changes`"></i> <a @click="resetBodyChanges()" href="javascript:void(0)">Reset changes</a></span>
                         <div class="alert alert-info" v-if="localMessage?.panel === 2 && localMessage.bodyUnavailable">{{ localMessage.bodyUnavailable }}</div>
                       </div>
                     </div>

src/Frontend/src/components/failedmessages/MessageList.vue

@@ -118,7 +118,7 @@ defineExpose<IMessageList>({
                 <span v-if="message.number_of_processing_attempts > 1" :title="`This message has already failed ${message.number_of_processing_attempts} times`" class="label sidebar-label label-important metadata-label"
                   >{{ message.number_of_processing_attempts === 10 ? "9+" : message.number_of_processing_attempts - 1 }} Retry Failures</span
                 >
-                <span v-if="message.restoreInProgress" tooltip="Message is being restored" class="label sidebar-label label-warning metadata-label metadata in-progress"><i class="bi-recycle"></i> Restore in progress</span>
+                <span v-if="message.restoreInProgress" v-tippy="`Message is being restored`" class="label sidebar-label label-warning metadata-label metadata in-progress"><i class="bi-recycle"></i> Restore in progress</span>
                 <span v-if="message.edited" :title="'Message was edited'" class="label sidebar-label label-info metadata-label">Edited</span>
 
                 <span class="metadata"><i class="fa fa-clock-o"></i> Failed: <time-since :dateUtc="message.time_of_failure"></time-since></span>

src/Frontend/src/components/failedmessages/MessageView.vue

@@ -403,7 +403,7 @@ onUnmounted(() => {
                 <span v-if="failedMessage.number_of_processing_attempts > 1" :title="'This message has already failed ' + failedMessage.number_of_processing_attempts + ' times'" class="label sidebar-label label-important metadata-label">
                   {{ failedMessage.number_of_processing_attempts - 1 }} Retry Failures
                 </span>
-                <span v-if="failedMessage.edited" tooltip="Message was edited" class="label sidebar-label label-info metadata-label">Edited</span>
+                <span v-if="failedMessage.edited" v-tippy="`Message was edited`" class="label sidebar-label label-info metadata-label">Edited</span>
                 <span v-if="failedMessage.edited" class="metadata metadata-link"><i class="fa fa-history"></i> <RouterLink :to="routeLinks.failedMessage.message.link(failedMessage.edit_of)">View previous version</RouterLink></span>
                 <span v-if="failedMessage.time_of_failure" class="metadata"><i class="fa fa-clock-o"></i> Failed: <time-since :date-utc="failedMessage.time_of_failure"></time-since></span>
                 <span class="metadata"><i class="fa pa-endpoint"></i> Endpoint: {{ failedMessage.receiving_endpoint?.name }}</span>