MassTransit retry functionality

src/Frontend/src/components/LicenseNotifications.vue

@@ -6,10 +6,13 @@ import { useShowToast } from "@/composables/toast";
 import { TYPE } from "vue-toastification";
 import routeLinks from "@/router/routeLinks";
 import { useRouter } from "vue-router";
+import { useConfiguration } from "@/composables/configuration";
 
 const router = useRouter();
 const { license, getOrUpdateLicenseStatus } = useLicense();
 
+const configuration = useConfiguration();
+
 function displayWarningMessage(licenseStatus: LicenseStatus) {
   const configurationRootLink = router.resolve(routeLinks.configuration.root).href;
   switch (licenseStatus) {
@@ -19,7 +22,9 @@ function displayWarningMessage(licenseStatus: LicenseStatus) {
       break;
     }
     case "ValidWithExpiringTrial": {
-      const trialExpiring = `<div><strong>Non-production development license expiring</strong><div>Your non-production development license will expire soon. To continue using the Particular Service Platform you'll need to extend your license.</div><a href="${license.license_extension_url}" class="btn btn-warning"><i class="fa fa-external-link-alt"></i> Extend your license</a><a href="${configurationRootLink}" class="btn btn-light">View license details</a></div>`;
+      const trialExpiring = configuration.value?.mass_transit_connector
+        ? `<div><strong>Early Access license expiring</strong><div>Your Early Access license will expire soon. To continue using the Particular Service Platform you'll need to extend your license.</div><a href="${license.license_extension_url}" class="btn btn-warning"><i class="fa fa-external-link-alt"></i> Extend your license</a><a href="${configurationRootLink}" class="btn btn-light">View license details</a></div>`
+        : `<div><strong>Non-production development license expiring</strong><div>Your non-production development license will expire soon. To continue using the Particular Service Platform you'll need to extend your license.</div><a href="${license.license_extension_url}" class="btn btn-warning"><i class="fa fa-external-link-alt"></i> Extend your license</a><a href="${configurationRootLink}" class="btn btn-light">View license details</a></div>`;
       useShowToast(TYPE.WARNING, "", trialExpiring, true);
       break;
     }

src/Frontend/src/components/PageFooter.vue

@@ -5,6 +5,7 @@ import { monitoringUrl, serviceControlUrl } from "../composables/serviceServiceC
 import { license, licenseStatus } from "../composables/serviceLicense";
 import { LicenseStatus } from "@/resources/LicenseInfo";
 import routeLinks from "@/router/routeLinks";
+import { useConfiguration } from "@/composables/configuration";
 
 const isMonitoringEnabled = computed(() => {
   return monitoringUrl.value !== "!" && monitoringUrl.value !== "" && monitoringUrl.value !== null && monitoringUrl.value !== undefined;
@@ -17,6 +18,8 @@ const scAddressTooltip = computed(() => {
 const scMonitoringAddressTooltip = computed(() => {
   return `Monitoring URL ${monitoringUrl.value}`;
 });
+
+const configuration = useConfiguration();
 </script>
 
 <template>
@@ -64,7 +67,7 @@ const scMonitoringAddressTooltip = computed(() => {
           </template>
         </div>
       </div>
-      <template v-if="license.license_status !== LicenseStatus.Unavailable && licenseStatus.isTrialLicense">
+      <template v-if="license.license_status !== LicenseStatus.Unavailable && !configuration?.mass_transit_connector && licenseStatus.isTrialLicense">
         <div class="row trialLicenseBar">
           <div role="status" aria-label="trial license bar information">
             <RouterLink :to="routeLinks.configuration.license.link">{{ license.license_type }} license</RouterLink>, non-production use only

src/Frontend/src/components/configuration/MassTransitConnector.vue

@@ -0,0 +1,99 @@
+<script setup lang="ts">
+import { useConfiguration } from "@/composables/configuration";
+import moment from "moment";
+
+const configuration = useConfiguration();
+// "Wed, Jan 15th 2025 10:56:21 +10:00",
+function formatDate(date: string) {
+  return moment(date).local().format("LLLL"); //.format("ddd, MMM Do YYYY HH:mm:ss Z");
+}
+</script>
+
+<template>
+  <div class="box" v-if="configuration?.mass_transit_connector !== undefined">
+    <div class="row margin-bottom-10">
+      <h4>
+        Connector Version: <span class="version-format">{{ configuration.mass_transit_connector.version }}</span>
+      </h4>
+    </div>
+    <div class="row margin-bottom-10">
+      <h4>List of error queues configured in the connector.</h4>
+      <div class="queues-container">
+        <div class="row margin-gap hover-highlight" v-for="queue in configuration.mass_transit_connector.error_queues" :key="queue.name">
+          <div :title="queue.name">{{ queue.name }}</div>
+          <div class="error-color" v-if="!queue.ingesting">Not ingesting</div>
+          <div class="ok-color" v-else>Ok</div>
+        </div>
+      </div>
+    </div>
+    <div class="row">
+      <h4>The entries below are the most recent warning and error-level events recorded on the ServiceControl Connector.</h4>
+      <div class="logs-container">
+        <div class="row margin-gap hover-highlight" v-for="log in [...configuration.mass_transit_connector.logs].reverse()" :key="log.date">
+          <div class="col-2">{{ formatDate(log.date) }}</div>
+          <div class="col-1" :class="`${log.level.toLowerCase()}-color`">{{ log.level }}</div>
+          <div class="col-9" :class="`${log.level.toLowerCase()}-color`">
+            <pre>{{ log.message }}</pre>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="box" v-else>
+    <p>MassTransit Connector for ServiceControl is not configured.</p>
+    <p><a target="_blank" href="https://particular.net/learn-more-about-masstransit-connector">Learn more about the MassTransit Connector.</a></p>
+  </div>
+</template>
+
+<style scoped>
+.hover-highlight:hover {
+  background-color: #ededed;
+}
+
+.margin-gap {
+  margin-bottom: 3px;
+}
+
+.queues-container {
+  max-width: 100%;
+  width: fit-content;
+  padding: 0.75rem;
+}
+.queues-container .row {
+  display: grid;
+  grid-template-columns: 5fr minmax(10em, 1fr);
+}
+.queues-container .row div {
+  overflow-wrap: anywhere;
+}
+
+.logs-container {
+  padding: 0.75rem;
+}
+.version-format {
+  font-weight: bold;
+}
+.box > .row:not(:last-child) {
+  padding-bottom: 0.5rem;
+  border-bottom: 1px solid #ccc;
+  margin-bottom: 0.5rem;
+}
+
+.logs-container pre {
+  all: revert;
+  margin: 0;
+  font-size: 0.9rem;
+  overflow-wrap: break-word;
+  text-wrap: auto;
+}
+
+.warning-color {
+  color: var(--bs-warning);
+}
+.error-color {
+  color: var(--bs-danger);
+}
+.ok-color {
+  color: var(--bs-success);
+}
+</style>

src/Frontend/src/components/configuration/PlatformLicense.vue

@@ -6,6 +6,8 @@ import { connectionState } from "@/composables/serviceServiceControl";
 import BusyIndicator from "../BusyIndicator.vue";
 import ExclamationMark from "./../../components/ExclamationMark.vue";
 import convertToWarningLevel from "@/components/configuration/convertToWarningLevel";
+import { useConfiguration } from "@/composables/configuration";
+import { typeText } from "@/resources/LicenseInfo";
 
 // This is needed because the ConfigurationView.vue routerView expects this event.
 // The event is only actually emitted on the RetryRedirects.vue component
@@ -18,6 +20,8 @@ defineEmits<{
 const loading = computed(() => {
   return !license;
 });
+
+const configuration = useConfiguration();
 </script>
 
 <template>
@@ -31,7 +35,7 @@ const loading = computed(() => {
           <div class="box">
             <div class="row">
               <div class="license-info">
-                <div><b>Platform license type:</b> {{ license.license_type }}{{ license.licenseEdition }}</div>
+                <div><b>Platform license type:</b> {{ typeText(license, configuration) }}{{ license.licenseEdition }}</div>
 
                 <template v-if="licenseStatus.isSubscriptionLicense">
                   <div>

src/Frontend/src/components/failedmessages/DeletedMessages.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onBeforeMount, onMounted, onUnmounted, ref, watch } from "vue";
+import { onMounted, onUnmounted, ref, watch } from "vue";
 import { licenseStatus } from "../../composables/serviceLicense";
 import { connectionState } from "../../composables/serviceServiceControl";
 import { usePatchToServiceControl, useTypedFetchFromServiceControl } from "../../composables/serviceServiceControlUrls";
@@ -13,14 +13,13 @@ import ConfirmDialog from "../ConfirmDialog.vue";
 import PaginationStrip from "../../components/PaginationStrip.vue";
 import moment from "moment";
 import { ExtendedFailedMessage } from "@/resources/FailedMessage";
-import Configuration from "@/resources/Configuration";
 import { TYPE } from "vue-toastification";
 import FailureGroup from "@/resources/FailureGroup";
+import { useConfiguration } from "@/composables/configuration";
 
 let pollingFaster = false;
 let refreshInterval: number | undefined;
 const perPage = 50;
-const configuration = ref<Configuration | null>(null);
 
 const route = useRoute();
 const groupId = ref<string>(route.params.groupId as string);
@@ -36,6 +35,7 @@ const messageList = ref<IMessageList | undefined>();
 const messages = ref<ExtendedFailedMessage[]>([]);
 
 watch(pageNumber, () => loadMessages());
+const configuration = useConfiguration();
 
 function loadMessages() {
   let startDate = new Date(0);
@@ -162,11 +162,6 @@ function periodChanged(period: PeriodOption) {
   loadMessages();
 }
 
-async function getConfiguration() {
-  const [, data] = await useTypedFetchFromServiceControl<Configuration>("configuration");
-  configuration.value = data;
-}
-
 function isRestoreInProgress() {
   return messages.value.some((message) => message.restoreInProgress);
 }
@@ -196,10 +191,6 @@ onBeforeRouteLeave(() => {
   groupName.value = "";
 });
 
-onBeforeMount(() => {
-  getConfiguration();
-});
-
 onUnmounted(() => {
   if (refreshInterval != null) {
     window.clearInterval(refreshInterval);

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

@@ -106,7 +106,7 @@ function isContentTypeSupported(contentType: string) {
 
 function getMessageIntent() {
   const intent = findHeadersByKey("NServiceBus.MessageIntent");
-  return intent.value;
+  return intent?.value ?? "";
 }
 
 function removeHeadersMarkedAsRemoved() {