diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 19107a2da1..ed7f34d51b 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -11,7 +11,7 @@ env:
 jobs:
   build:
     name: Windows
-    runs-on: windows-2019
+    runs-on: windows-2022
     steps:
       - name: Checkout
         uses: actions/checkout@v3.1.0
diff --git a/src/ServicePulse.Host/Hosting/Options.cs b/src/ServicePulse.Host/Hosting/Options.cs
index 00004a614c..89b5cc7f52 100644
--- a/src/ServicePulse.Host/Hosting/Options.cs
+++ b/src/ServicePulse.Host/Hosting/Options.cs
@@ -889,10 +889,7 @@ public List<string> Parse(IEnumerable<string> arguments)
                 }
             }
 
-            if (c.Option != null)
-            {
-                c.Option.Invoke(c);
-            }
+            c.Option?.Invoke(c);
 
             return unprocessed;
         }
diff --git a/src/ServicePulse.Host/vue/src/App.vue b/src/ServicePulse.Host/vue/src/App.vue
index de33fccb32..8d630fff3c 100644
--- a/src/ServicePulse.Host/vue/src/App.vue
+++ b/src/ServicePulse.Host/vue/src/App.vue
@@ -1,271 +1,18 @@
 <script setup>
-import { ref, provide, computed, onMounted, watch } from "vue";
 import { RouterView } from "vue-router";
 import PageFooter from "./components/PageFooter.vue";
 import PageHeader from "./components/PageHeader.vue";
+import { useServiceControlUrls } from "./composables/serviceServiceControlUrls.js";
 import {
-  key_ServiceControlUrl,
-  key_UnableToConnectToServiceControl,
-  key_UnableToConnectToMonitoring,
-  key_IsSCConnecting,
-  key_IsSCConnected,
-  key_ScConnectedAtLeastOnce,
-  key_UpdateConnections,
-  key_MonitoringUrl,
-  key_IsMonitoringEnabled,
-  key_IsSCMonitoringConnected,
-  key_IsSCMonitoringConnecting,
-  key_MonitoringVersion,
-  key_NewMonitoringVersion,
-  key_NewMonitoringVersionLink,
-  key_NewMonitoringVersionNumber,
-  key_License,
-  key_SPVersion,
-  key_NewSPVersion,
-  key_NewSPVersionLink,
-  key_NewSPVersionNumber,
-  key_SCVersion,
-  key_NewSCVersion,
-  key_NewSCVersionLink,
-  key_NewSCVersionNumber,
-} from "./composables/keys.js";
-import {
-  useServiceControlUrls,
-  updateServiceControlUrls,
-} from "./composables/serviceServiceControlUrls.js";
-import {
-  useServiceControlStats,
   useServiceControlVersion,
-  isServiceControlConnecting,
-  isServiceControlConnected,
-  serviceControlConnectedAtLeastOnce,
-  useServiceControlMonitoringStats,
-  isServiceControlMonitoringConnecting,
-  isServiceControlMonitoringConnected,
-  environment,
-  newVersions,
+  useServiceControl,
 } from "./composables/serviceServiceControl.js";
-import {
-  useLicense,
-  useLicenseStatus,
-  useGetWarningMessage,
-} from "./composables/serviceLicense.js";
-import { useShowToast } from "./composables/toast.js";
-
-onMounted(() => {
-  getLicense();
-  getServiceControlVersions();
-  getServiceControlStats();
-  getServiceControlMonitoringStats();
-});
-
-const { serviceControlUrl, monitoringUrl } = useServiceControlUrls();
-provide(key_ServiceControlUrl, serviceControlUrl);
-provide(key_MonitoringUrl, monitoringUrl);
-
-let license = ref(null);
-function getLicense() {
-  useLicense(serviceControlUrl.value).then((lic) => {
-    license.value = lic.value;
-  });
-}
-
-provide(key_License, license);
-
-watch(useLicenseStatus.isExpired, async (newValue, oldValue) => {
-  if (newValue != oldValue) {
-    if (newValue) {
-      useShowToast(
-        "error",
-        "Error",
-        'Your license has expired. Please contact Particular Software support at: <a href="http://particular.net/support">http://particular.net/support</a>',
-        true
-      );
-    }
-  }
-});
-
-watch(license, async (newValue, oldValue) => {
-  const checkForWarnings =
-    oldValue !== null
-      ? newValue && newValue.license_status != oldValue.license_status
-      : newValue !== null;
-  if (checkForWarnings) {
-    useGetWarningMessage(newValue.license_status, useShowToast);
-  }
-});
-
-let isSCConnecting = ref(true);
-let isSCConnected = ref(null);
-let scConnectedAtLeastOnce = ref(false);
-
-let isSCMonitoringConnecting = ref(true);
-let isSCMonitoringConnected = ref(null);
-let isMonitoringEnabled = computed(() => {
-  return (
-    monitoringUrl.value !== "!" &&
-    monitoringUrl.value !== "" &&
-    monitoringUrl.value !== null &&
-    monitoringUrl.value !== undefined
-  );
-});
-const unableToConnectToServiceControl = computed(() => {
-  return isSCConnecting.value ? false : !isSCConnected.value;
-});
-const unableToConnectToMonitoring = computed(() => {
-  return isSCMonitoringConnecting.value
-    ? false
-    : !isSCMonitoringConnected.value;
-});
-
-function updateConnections(urlParams, newServiceControlUrl, newMonitoringUrl) {
-  updateServiceControlUrls(urlParams, newServiceControlUrl, newMonitoringUrl);
-}
-
-setInterval(() => getServiceControlStats(), 5000); //NOTE is 5 seconds too often?
-setInterval(() => getServiceControlMonitoringStats(), 5000); //NOTE is 5 seconds too often?
-
-function getServiceControlStats() {
-  useServiceControlStats(serviceControlUrl.value).then(() => {
-    isSCConnecting.value = isServiceControlConnecting.value;
-    isSCConnected.value = isServiceControlConnected.value;
-    scConnectedAtLeastOnce.value = serviceControlConnectedAtLeastOnce.value;
-  });
-}
-function getServiceControlMonitoringStats() {
-  useServiceControlMonitoringStats(monitoringUrl.value).then(() => {
-    isSCMonitoringConnecting.value = isServiceControlMonitoringConnecting.value;
-    isSCMonitoringConnected.value = isServiceControlMonitoringConnected.value;
-  });
-}
-
-provide(key_UnableToConnectToServiceControl, unableToConnectToServiceControl);
-provide(key_UnableToConnectToMonitoring, unableToConnectToMonitoring);
-provide(key_IsSCConnecting, isSCConnecting);
-provide(key_IsSCConnected, isSCConnected);
-provide(key_ScConnectedAtLeastOnce, scConnectedAtLeastOnce);
-provide(key_UpdateConnections, updateConnections);
-
-provide(key_IsMonitoringEnabled, isMonitoringEnabled);
-provide(key_IsSCMonitoringConnected, isSCMonitoringConnected);
-provide(key_IsSCMonitoringConnecting, isSCMonitoringConnecting);
-
-watch(isSCConnected, async (newValue, oldValue) => {
-  if (newValue != oldValue && !(oldValue === null && newValue === true)) {
-    //NOTE to eliminate success msg showing everytime the screen is refreshed
-    if (!newValue) {
-      useShowToast(
-        "error",
-        "Error",
-        "Could not connect to ServiceControl at " +
-          serviceControlUrl.value +
-          '. <a class="btn btn-default" href="/configuration#connections">View connection settings</a>'
-      );
-    } else {
-      useShowToast(
-        "success",
-        "Success",
-        "Connection to ServiceControl was successful at " +
-          serviceControlUrl.value +
-          "."
-      );
-    }
-  }
-});
-
-watch(isSCMonitoringConnected, async (newValue, oldValue) => {
-  if (newValue != oldValue && !(oldValue === null && newValue === true)) {
-    //NOTE to eliminate success msg showing everytime the screen is refreshed
-    if (!newValue) {
-      useShowToast(
-        "error",
-        "Error",
-        "Could not connect to the ServiceControl Monitoring service at " +
-          monitoringUrl.value +
-          '. <a class="btn btn-default" href="/configuration#connections">View connection settings</a>'
-      );
-    } else {
-      useShowToast(
-        "success",
-        "Success",
-        "Connection to ServiceControl Monitoring service was successful at " +
-          monitoringUrl.value +
-          "."
-      );
-    }
-  }
-});
-
-let scVersion = ref(null);
-let newSCVersion = ref(null);
-let newSCVersionLink = ref(null);
-let newSCVersionNumber = ref(null);
-let spVersion = ref(null);
-let newSPVersion = ref(null);
-let newSPVersionLink = ref(null);
-let newSPVersionNumber = ref(null);
-let monitoringVersion = ref(null);
-let newmonitoringVersion = ref(null);
-let newmonitoringVersionLink = ref(null);
-let newmonitoringVersionNumber = ref(null);
-let isCompatibleWithSC = ref(true);
-let minimumSupportedSCVersion = ref(null);
-
-watch(isCompatibleWithSC, async (newValue, oldValue) => {
-  if (newValue != oldValue) {
-    if (!newValue) {
-      useShowToast(
-        "error",
-        "Error",
-        "You are using Service Control version " +
-          scVersion.value +
-          ". Please, upgrade to version " +
-          minimumSupportedSCVersion.value +
-          " or higher to unlock new functionality in ServicePulse."
-      );
-    }
-  }
-});
-
-setInterval(() => getServiceControlVersions(), 60000); //NOTE is this often enough or too often?
-
-function getServiceControlVersions() {
-  useServiceControlVersion(serviceControlUrl.value, monitoringUrl.value).then(
-    () => {
-      scVersion.value = environment.sc_version;
-      newSCVersion.value = newVersions.newSCVersion.newscversion;
-      newSCVersionLink.value = newVersions.newSCVersion.newscversionlink;
-      newSCVersionNumber.value = newVersions.newSCVersion.newscversionnumber;
-
-      spVersion.value = environment.sp_version;
-      newSPVersion.value = newVersions.newSPVersion.newspversion;
-      newSPVersionLink.value = newVersions.newSPVersion.newspversionlink;
-      newSPVersionNumber.value = newVersions.newSPVersion.newspversionnumber;
-
-      monitoringVersion.value = environment.monitoring_version;
-      newmonitoringVersion.value = newVersions.newMVersion.newmversion;
-      newmonitoringVersionLink.value = newVersions.newMVersion.newmversionlink;
-      newmonitoringVersionNumber.value =
-        newVersions.newMVersion.newmversionnumber;
+import { useLicense } from "./composables/serviceLicense.js";
 
-      isCompatibleWithSC.value = environment.is_compatible_with_sc;
-      minimumSupportedSCVersion.value =
-        environment.minimum_supported_sc_version;
-    }
-  );
-}
-provide(key_SCVersion, scVersion);
-provide(key_NewSCVersion, newSCVersion);
-provide(key_NewSCVersionLink, newSCVersionLink);
-provide(key_NewSCVersionNumber, newSCVersionNumber);
-provide(key_SPVersion, spVersion);
-provide(key_NewSPVersion, newSPVersion);
-provide(key_NewSPVersionLink, newSPVersionLink);
-provide(key_NewSPVersionNumber, newSPVersionNumber);
-provide(key_MonitoringVersion, monitoringVersion);
-provide(key_NewMonitoringVersion, newmonitoringVersion);
-provide(key_NewMonitoringVersionLink, newmonitoringVersionLink);
-provide(key_NewMonitoringVersionNumber, newmonitoringVersionNumber);
+useServiceControlUrls();
+useServiceControl();
+useServiceControlVersion();
+useLicense();
 </script>
 
 <template>
diff --git a/src/ServicePulse.Host/vue/src/components/EventItemShort.vue b/src/ServicePulse.Host/vue/src/components/EventItemShort.vue
index 9327602454..db54ae4939 100644
--- a/src/ServicePulse.Host/vue/src/components/EventItemShort.vue
+++ b/src/ServicePulse.Host/vue/src/components/EventItemShort.vue
@@ -1,16 +1,14 @@
 <script setup>
-import { ref, onMounted, inject } from "vue";
+import { ref, onMounted } from "vue";
 import { useRouter } from "vue-router";
 import { getEventLogItems } from "../composables/eventLogItems.js";
-import { key_ServiceControlUrl } from "@/composables/keys";
 import TimeSince from "./TimeSince.vue";
 
 const router = useRouter();
 const eventLogItems = ref([]);
 const eventCount = ref(0);
 onMounted(() => {
-  const serviceControlUrl = inject(key_ServiceControlUrl);
-  getEventLogItems(serviceControlUrl).then((data) => {
+  getEventLogItems().then((data) => {
     eventCount.value = data.length;
     eventLogItems.value = data.slice(0, 10);
   });
@@ -91,7 +89,7 @@ function navigateToEvent(eventLogItem) {
       window.location = "/a/#/failed-messages/groups";
       break;
     case "MessageRedirects":
-      router.push("/configuration#redirects");
+      router.push("/configuration#retry-redirects");
       break;
     default:
   }
diff --git a/src/ServicePulse.Host/vue/src/components/LicenseExpired.vue b/src/ServicePulse.Host/vue/src/components/LicenseExpired.vue
index 12b7662cb4..eaee10efe8 100644
--- a/src/ServicePulse.Host/vue/src/components/LicenseExpired.vue
+++ b/src/ServicePulse.Host/vue/src/components/LicenseExpired.vue
@@ -1,14 +1,9 @@
 <script setup>
-import { useLicenseStatus } from "./../composables/serviceLicense.js";
-
-const isPlatformExpired = useLicenseStatus.isPlatformExpired;
-const isPlatformTrialExpired = useLicenseStatus.isPlatformTrialExpired;
-const isInvalidDueToUpgradeProtectionExpired =
-  useLicenseStatus.isInvalidDueToUpgradeProtectionExpired;
+import { licenseStatus } from "./../composables/serviceLicense.js";
 </script>
 
 <template>
-  <template v-if="isPlatformExpired">
+  <template v-if="licenseStatus.isPlatformExpired">
     <div class="text-center monitoring-no-data" style="max-width: 620px">
       <h1>Platform license expired</h1>
       <p>
@@ -22,7 +17,7 @@ const isInvalidDueToUpgradeProtectionExpired =
       </div>
     </div>
   </template>
-  <template v-if="isPlatformTrialExpired">
+  <template v-if="licenseStatus.isPlatformTrialExpired">
     <div class="text-center monitoring-no-data" style="max-width: 720px">
       <h1>License expired</h1>
       <p>
@@ -42,7 +37,7 @@ const isInvalidDueToUpgradeProtectionExpired =
       </div>
     </div>
   </template>
-  <template v-if="isInvalidDueToUpgradeProtectionExpired">
+  <template v-if="licenseStatus.isInvalidDueToUpgradeProtectionExpired">
     <div class="text-center monitoring-no-data" style="max-width: 620px">
       <h1>Platform license expired</h1>
       <p>
diff --git a/src/ServicePulse.Host/vue/src/components/PageFooter.vue b/src/ServicePulse.Host/vue/src/components/PageFooter.vue
index 7156945b80..bb1daade80 100644
--- a/src/ServicePulse.Host/vue/src/components/PageFooter.vue
+++ b/src/ServicePulse.Host/vue/src/components/PageFooter.vue
@@ -1,48 +1,24 @@
 <script setup>
-import { inject, computed } from "vue";
+import { computed } from "vue";
 import {
-  key_ServiceControlUrl,
-  key_IsSCConnected,
-  key_IsSCConnecting,
-  key_MonitoringUrl,
-  key_IsMonitoringEnabled,
-  key_IsSCMonitoringConnected,
-  key_IsSCMonitoringConnecting,
-  key_SCVersion,
-  key_NewSCVersion,
-  key_NewSCVersionLink,
-  key_NewSCVersionNumber,
-  key_SPVersion,
-  key_NewSPVersion,
-  key_NewSPVersionLink,
-  key_NewSPVersionNumber,
-  key_MonitoringVersion,
-  key_NewMonitoringVersion,
-  key_NewMonitoringVersionLink,
-  key_NewMonitoringVersionNumber,
-} from "../composables/keys.js";
-
-const serviceControlUrl = inject(key_ServiceControlUrl);
-const isSCConnected = inject(key_IsSCConnected);
-const isSCConnecting = inject(key_IsSCConnecting);
-
-const monitoringUrl = inject(key_MonitoringUrl);
-const isMonitoringEnabled = inject(key_IsMonitoringEnabled);
-const isSCMonitoringConnected = inject(key_IsSCMonitoringConnected);
-const isSCMonitoringConnecting = inject(key_IsSCMonitoringConnecting);
+  environment,
+  newVersions,
+  connectionState,
+  monitoringConnectionState,
+} from "../composables/serviceServiceControl.js";
+import {
+  serviceControlUrl,
+  monitoringUrl,
+} from "../composables/serviceServiceControlUrls.js";
 
-const scVersion = inject(key_SCVersion);
-const scNewVersion = inject(key_NewSCVersion);
-const scNewVersionLink = inject(key_NewSCVersionLink);
-const scNewVersionNumber = inject(key_NewSCVersionNumber);
-const spVersion = inject(key_SPVersion);
-const spNewVersion = inject(key_NewSPVersion);
-const spNewVersionLink = inject(key_NewSPVersionLink);
-const spNewVersionNumber = inject(key_NewSPVersionNumber);
-const monitoringVersion = inject(key_MonitoringVersion);
-const monitoringNewVersion = inject(key_NewMonitoringVersion);
-const monitoringNewVersionLink = inject(key_NewMonitoringVersionLink);
-const monitoringNewVersionNumber = inject(key_NewMonitoringVersionNumber);
+const isMonitoringEnabled = computed(() => {
+  return (
+    monitoringUrl.value !== "!" &&
+    monitoringUrl.value !== "" &&
+    monitoringUrl.value !== null &&
+    monitoringUrl.value !== undefined
+  );
+});
 
 const scAddressTooltip = computed(() => {
   return "ServiceControl URL " + serviceControlUrl.value;
@@ -65,43 +41,61 @@ const scMonitoringAddressTooltip = computed(() => {
             >
           </span>
 
-          <span v-if="!spNewVersion && spVersion">
-            ServicePulse v{{ spVersion }}
+          <span
+            v-if="
+              !newVersions.newSPVersion.newspversion && environment.sp_version
+            "
+          >
+            ServicePulse v{{ environment.sp_version }}
           </span>
-          <span v-if="spNewVersion && spVersion">
-            ServicePulse v{{ spVersion }} (<i
-              v-if="spNewVersionNumber"
+          <span
+            v-if="
+              newVersions.newSPVersion.newspversion && environment.sp_version
+            "
+          >
+            ServicePulse v{{ environment.sp_version }} (<i
+              v-if="newVersions.newSPVersion.newspversionnumber"
               class="fa fa-level-up fake-link"
             ></i>
-            <a :href="spNewVersionLink" target="_blank"
-              >v{{ spNewVersionNumber }} available</a
+            <a :href="newVersions.newSPVersion.newspversionlink" target="_blank"
+              >v{{ newVersions.newSPVersion.newspversionnumber }} available</a
             >)
           </span>
           <span :title="scAddressTooltip">
             Service Control:
             <span
               class="connected-status"
-              v-if="isSCConnected && !isSCConnecting"
+              v-if="connectionState.connected && !connectionState.connecting"
             >
               <div class="fa pa-connection-success"></div>
-              <span v-if="!scVersion">Connected</span>
-              <span v-if="scVersion" class="versionnumber"
-                >v{{ scVersion }}</span
+              <span v-if="!environment.sc_version">Connected</span>
+              <span v-if="environment.sc_version" class="versionnumber"
+                >v{{ environment.sc_version }}</span
               >
-              <span v-if="scNewVersion" class="newscversion"
+              <span
+                v-if="newVersions.newSCVersion.newscversion"
+                class="newscversion"
                 >(<i class="fa fa-level-up fake-link"></i>
-                <a :href="scNewVersionLink" target="_blank"
-                  >v{{ scNewVersionNumber }} available</a
+                <a
+                  :href="newVersions.newSCVersion.newscversionlink"
+                  target="_blank"
+                  >v{{
+                    newVersions.newSCVersion.newscversionnumber
+                  }}
+                  available</a
                 >)</span
               >
             </span>
             <span
-              v-if="!isSCConnected && !isSCConnecting"
+              v-if="!connectionState.connected && !connectionState.connecting"
               class="connection-failed"
             >
               <i class="fa pa-connection-failed"></i> Not connected
             </span>
-            <span v-if="isSCConnecting" class="connection-establishing">
+            <span
+              v-if="connectionState.connecting"
+              class="connection-establishing"
+            >
               <i class="fa pa-connection-establishing"></i> Connecting
             </span>
           </span>
@@ -114,25 +108,38 @@ const scMonitoringAddressTooltip = computed(() => {
               SC Monitoring:
               <span
                 class="connected-status"
-                v-if="isSCMonitoringConnected && !isSCMonitoringConnecting"
+                v-if="
+                  monitoringConnectionState.connected &&
+                  !monitoringConnectionState.connecting
+                "
               >
                 <div class="fa pa-connection-success"></div>
-                <span v-if="monitoringVersion"> v{{ monitoringVersion }}</span>
-                <span v-if="monitoringNewVersion"
+                <span v-if="environment.monitoring_version">
+                  v{{ environment.monitoring_version }}</span
+                >
+                <span v-if="newVersions.newMVersion.newmversion"
                   >(<i class="fa fa-level-up fake-link"></i>
-                  <a :href="monitoringNewVersionLink" target="_blank"
-                    >v{{ monitoringNewVersionNumber }} available</a
+                  <a
+                    :href="newVersions.newMVersion.newmversionlink"
+                    target="_blank"
+                    >v{{
+                      newVersions.newMVersion.newmversionnumber
+                    }}
+                    available</a
                   >)</span
                 >
               </span>
               <span
-                v-if="!isSCMonitoringConnected && !isSCMonitoringConnecting"
+                v-if="
+                  !monitoringConnectionState.connected &&
+                  !monitoringConnectionState.connecting
+                "
                 class="connection-failed"
               >
                 <i class="fa pa-connection-failed"></i> Not connected
               </span>
               <span
-                v-if="isSCMonitoringConnecting"
+                v-if="monitoringConnectionState.connecting"
                 class="connection-establishing"
               >
                 <i class="fa pa-connection-establishing"></i> Connecting
diff --git a/src/ServicePulse.Host/vue/src/components/PageHeader.vue b/src/ServicePulse.Host/vue/src/components/PageHeader.vue
index e248bd73e3..9afb5575e5 100644
--- a/src/ServicePulse.Host/vue/src/components/PageHeader.vue
+++ b/src/ServicePulse.Host/vue/src/components/PageHeader.vue
@@ -1,14 +1,13 @@
 <script setup>
 import { RouterLink, useRoute } from "vue-router";
-import { inject, computed } from "vue";
-import {
-  key_License,
-  key_UnableToConnectToServiceControl,
-  key_UnableToConnectToMonitoring,
-} from "./../composables/keys.js";
+import { computed } from "vue";
 import ExclamationMark from "./ExclamationMark.vue";
-import { stats } from "../composables/serviceServiceControl.js";
-import { useLicenseWarningLevel } from "./../composables/serviceLicense.js";
+import {
+  stats,
+  connectionState,
+  monitoringConnectionState,
+} from "../composables/serviceServiceControl.js";
+import { licenseStatus } from "./../composables/serviceLicense.js";
 
 function subIsActive(input, exact) {
   const paths = Array.isArray(input) ? input : [input];
@@ -18,26 +17,14 @@ function subIsActive(input, exact) {
   });
 }
 
-const unableToConnectToServiceControl = inject(
-  key_UnableToConnectToServiceControl
-);
-const unableToConnectToMonitoring = inject(key_UnableToConnectToMonitoring);
-const license = inject(key_License);
-
 const displayWarn = computed(() => {
-  const expiredWarningType = useLicenseWarningLevel(
-    license.value ? license.value.license_status : ""
-  );
-  return expiredWarningType === "warning";
+  return licenseStatus.warningLevel === "warning";
 });
 const displayDanger = computed(() => {
-  const expiredWarningType = useLicenseWarningLevel(
-    license.value ? license.value.license_status : ""
-  );
   return (
-    unableToConnectToServiceControl.value ||
-    unableToConnectToMonitoring.value ||
-    expiredWarningType === "danger"
+    connectionState.unableToConnect ||
+    monitoringConnectionState.unableToConnect ||
+    licenseStatus.warningLevel === "danger"
   );
 });
 </script>
diff --git a/src/ServicePulse.Host/vue/src/components/ServiceControlNotAvailable.vue b/src/ServicePulse.Host/vue/src/components/ServiceControlNotAvailable.vue
index d51b0690df..cdbfb26aaf 100644
--- a/src/ServicePulse.Host/vue/src/components/ServiceControlNotAvailable.vue
+++ b/src/ServicePulse.Host/vue/src/components/ServiceControlNotAvailable.vue
@@ -1,22 +1,12 @@
 <script setup>
-import { inject } from "vue";
-import { key_ServiceControlUrl } from "./../composables/keys.js";
-const serviceControlUrl = inject(key_ServiceControlUrl);
-
-const props = defineProps({
-  isSCConnected: Boolean,
-  isSCConnecting: Boolean,
-  scConnectedAtLeastOnce: Boolean,
-});
+import { connectionState } from "./../composables/serviceServiceControl";
+import { serviceControlUrl } from "./../composables/serviceServiceControlUrls";
 </script>
 
 <template>
+  <div class="sp-loader" v-if="connectionState.connecting"></div>
   <template
-    v-if="
-      !props.isSCConnected &&
-      !props.isSCConnecting &&
-      !props.scConnectedAtLeastOnce
-    "
+    v-if="connectionState.unableToConnect && !connectionState.connecting"
   >
     <div class="text-center monitoring-no-data">
       <h1>Cannot connect to ServiceControl</h1>
diff --git a/src/ServicePulse.Host/vue/src/components/ToastPopup.vue b/src/ServicePulse.Host/vue/src/components/ToastPopup.vue
index 64bb94037f..e4436c9799 100644
--- a/src/ServicePulse.Host/vue/src/components/ToastPopup.vue
+++ b/src/ServicePulse.Host/vue/src/components/ToastPopup.vue
@@ -10,31 +10,41 @@ const props = defineProps({
   <div class="toast-container">
     <template v-if="props.type === 'success'">
       <div class="toast-success">
-        <p><strong>{{ props.title }}</strong></p>
+        <p>
+          <strong>{{ props.title }}</strong>
+        </p>
         <span v-html="props.message"></span>
       </div>
     </template>
     <template v-if="props.type === 'info'">
       <div class="toast-info">
-        <p><strong>{{ props.title }}</strong></p>
+        <p>
+          <strong>{{ props.title }}</strong>
+        </p>
         <span v-html="props.message"></span>
       </div>
     </template>
     <template v-if="props.type === 'error'">
       <div class="toast-error">
-        <p><strong>{{ props.title }}</strong></p>
+        <p>
+          <strong>{{ props.title }}</strong>
+        </p>
         <span v-html="props.message"></span>
       </div>
     </template>
     <template v-if="props.type === 'warning'">
       <div class="toast-warning">
-        <p><strong>{{ props.title }}</strong></p>
+        <p>
+          <strong>{{ props.title }}</strong>
+        </p>
         <span v-html="props.message"></span>
       </div>
     </template>
     <template v-if="props.type === 'default'">
       <div class="toast-default">
-        <p><strong>{{ props.title }}</strong></p>
+        <p>
+          <strong>{{ props.title }}</strong>
+        </p>
         <span v-html="props.message"></span>
       </div>
     </template>
diff --git a/src/ServicePulse.Host/vue/src/components/configuration/EndpointConnection.vue b/src/ServicePulse.Host/vue/src/components/configuration/EndpointConnection.vue
index 140a232190..17a0993ffa 100644
--- a/src/ServicePulse.Host/vue/src/components/configuration/EndpointConnection.vue
+++ b/src/ServicePulse.Host/vue/src/components/configuration/EndpointConnection.vue
@@ -1,28 +1,17 @@
 <script setup>
-import { ref, inject, onMounted } from "vue";
+import { ref, onMounted } from "vue";
 import LicenseExpired from "../LicenseExpired.vue";
 import ServiceControlNotAvailable from "../ServiceControlNotAvailable.vue";
-import { useLicenseStatus } from "../../composables/serviceLicense.js";
+import { licenseStatus } from "../../composables/serviceLicense.js";
 import {
-  key_ServiceControlUrl,
-  key_MonitoringUrl,
-  key_IsSCConnected,
-  key_ScConnectedAtLeastOnce,
-  key_IsSCConnecting,
-} from "./../../composables/keys.js";
-import { useServiceControlConnections } from "../../composables/serviceServiceControl.js";
+  useServiceControlConnections,
+  connectionState,
+} from "../../composables/serviceServiceControl.js";
 import BusyIndicator from "../BusyIndicator.vue";
 import { HighCode } from "vue-highlight-code";
 import "vue-highlight-code/dist/style.css";
 
-const isExpired = ref(useLicenseStatus.isExpired);
-
-const configuredServiceControlUrl = inject(key_ServiceControlUrl);
-const configuredMonitoringUrl = inject(key_MonitoringUrl);
-
-const isSCConnected = inject(key_IsSCConnected);
-const scConnectedAtLeastOnce = inject(key_ScConnectedAtLeastOnce);
-const isSCConnecting = inject(key_IsSCConnecting);
+const isExpired = licenseStatus.isExpired;
 
 const loading = ref(true);
 const showCodeOnlyTab = ref(true);
@@ -43,10 +32,7 @@ function getCode() {
 var servicePlatformConnection = ServicePlatformConnectionConfiguration.Parse(json);
 endpointConfiguration.ConnectToServicePlatform(servicePlatformConnection);
 `;
-  useServiceControlConnections(
-    configuredServiceControlUrl.value,
-    configuredMonitoringUrl.value
-  ).then((connections) => {
+  useServiceControlConnections().then((connections) => {
     const config = {
       heartbeats: connections.serviceControl.settings.Heartbeats,
       customChecks: connections.serviceControl.settings.CustomChecks,
@@ -88,14 +74,8 @@ function switchJsonTab() {
   <LicenseExpired />
   <template v-if="!isExpired">
     <section name="platformconnection">
-      <div class="sp-loader" v-if="isSCConnecting"></div>
-      <ServiceControlNotAvailable
-        :isSCConnected="isSCConnected"
-        :isSCConnecting="isSCConnecting"
-        :scConnectedAtLeastOnce="scConnectedAtLeastOnce"
-      />
-
-      <template v-if="isSCConnected || scConnectedAtLeastOnce">
+      <ServiceControlNotAvailable />
+      <template v-if="!connectionState.unableToConnect">
         <div class="box">
           <div class="row">
             <div class="col-sm-12">
diff --git a/src/ServicePulse.Host/vue/src/components/configuration/HealthCheckNotifications.vue b/src/ServicePulse.Host/vue/src/components/configuration/HealthCheckNotifications.vue
index e7688a4e9a..cf1cb74be8 100644
--- a/src/ServicePulse.Host/vue/src/components/configuration/HealthCheckNotifications.vue
+++ b/src/ServicePulse.Host/vue/src/components/configuration/HealthCheckNotifications.vue
@@ -1,15 +1,10 @@
 <script setup>
-import { inject, ref, onMounted } from "vue";
+import { ref, onMounted } from "vue";
 import LicenseExpired from "../LicenseExpired.vue";
 import ServiceControlNotAvailable from "../ServiceControlNotAvailable.vue";
-import { useLicenseStatus } from "../../composables/serviceLicense.js";
+import { licenseStatus } from "../../composables/serviceLicense.js";
+import { connectionState } from "../../composables/serviceServiceControl";
 import HealthCheckNotifications_EmailConfiguration from "./HealthCheckNotifications_ConfigureEmail.vue";
-import {
-  key_ServiceControlUrl,
-  key_IsSCConnected,
-  key_ScConnectedAtLeastOnce,
-  key_IsSCConnecting,
-} from "./../../composables/keys.js";
 import {
   useEmailNotifications,
   useUpdateEmailNotifications,
@@ -18,14 +13,7 @@ import {
 } from "../../composables/serviceNotifications.js";
 import { useShowToast } from "../../composables/toast.js";
 
-const isExpired = ref(useLicenseStatus.isExpired);
-
-const isSCConnected = inject(key_IsSCConnected);
-const scConnectedAtLeastOnce = inject(key_ScConnectedAtLeastOnce);
-const isSCConnecting = inject(key_IsSCConnecting);
-
-const configuredServiceControlUrl = inject(key_ServiceControlUrl);
-
+const isExpired = licenseStatus.isExpired;
 const emailTestSuccessful = ref(null);
 const emailTestInProgress = ref(null);
 const emailToggleSucessful = ref(null);
@@ -47,7 +35,6 @@ function toggleEmailNotifications() {
   emailTestSuccessful.value = null;
   emailUpdateSuccessful.value = null;
   useToggleEmailNotifications(
-    configuredServiceControlUrl.value,
     emailNotifications.value.enabled === null
       ? true
       : !emailNotifications.value.enabled
@@ -72,10 +59,7 @@ function editEmailNotifications() {
 function saveEditedEmailNotifications(newSettings) {
   emailUpdateSuccessful.value = null;
   showEmailConfiguration.value = false;
-  useUpdateEmailNotifications(
-    configuredServiceControlUrl.value,
-    newSettings
-  ).then((result) => {
+  useUpdateEmailNotifications(newSettings).then((result) => {
     if (result.message === "success") {
       emailUpdateSuccessful.value = true;
       useShowToast("info", "Info", "Email settings updated.");
@@ -99,21 +83,19 @@ function testEmailNotifications() {
   emailTestInProgress.value = true;
   emailToggleSucessful.value = null;
   emailUpdateSuccessful.value = null;
-  useTestEmailNotifications(configuredServiceControlUrl.value).then(
-    (result) => {
-      if (result.message === "success") {
-        emailTestSuccessful.value = true;
-      } else {
-        emailTestSuccessful.value = false;
-      }
-      emailTestInProgress.value = false;
+  useTestEmailNotifications().then((result) => {
+    if (result.message === "success") {
+      emailTestSuccessful.value = true;
+    } else {
+      emailTestSuccessful.value = false;
     }
-  );
+    emailTestInProgress.value = false;
+  });
 }
 
 function getEmailNotifications() {
   showEmailConfiguration.value = false;
-  useEmailNotifications(configuredServiceControlUrl.value).then((result) => {
+  useEmailNotifications().then((result) => {
     emailNotifications.value.enabled = result.enabled;
     emailNotifications.value.enable_tls = result.enable_tls;
     emailNotifications.value.smtp_server = result.smtp_server
@@ -140,14 +122,8 @@ onMounted(() => {
   <LicenseExpired />
   <template v-if="!isExpired">
     <section name="notifications">
-      <div class="sp-loader" v-if="isSCConnecting"></div>
-      <ServiceControlNotAvailable
-        :isSCConnected="isSCConnected"
-        :isSCConnecting="isSCConnecting"
-        :scConnectedAtLeastOnce="scConnectedAtLeastOnce"
-      />
-
-      <template v-if="isSCConnected || scConnectedAtLeastOnce">
+      <ServiceControlNotAvailable />
+      <template v-if="!connectionState.unableToConnect">
         <section>
           <div class="row">
             <div class="col-sm-12">
diff --git a/src/ServicePulse.Host/vue/src/components/configuration/PlatformConnections.vue b/src/ServicePulse.Host/vue/src/components/configuration/PlatformConnections.vue
index 917c512808..2c025de780 100644
--- a/src/ServicePulse.Host/vue/src/components/configuration/PlatformConnections.vue
+++ b/src/ServicePulse.Host/vue/src/components/configuration/PlatformConnections.vue
@@ -1,30 +1,22 @@
 <script setup>
-import { ref, inject } from "vue";
-import { useRoute } from "vue-router";
+import { ref } from "vue";
 import LicenseExpired from "../LicenseExpired.vue";
-import { useLicenseStatus } from "../../composables/serviceLicense.js";
+import { licenseStatus } from "../../composables/serviceLicense.js";
 import {
-  key_ServiceControlUrl,
-  key_MonitoringUrl,
-  key_UpdateConnections,
-  key_UnableToConnectToServiceControl,
-  key_UnableToConnectToMonitoring,
-} from "../../composables/keys.js";
-
-const isExpired = ref(useLicenseStatus.isExpired);
+  updateServiceControlUrls,
+  serviceControlUrl as configuredServiceControlUrl,
+  monitoringUrl as configuredMonitoringUrl,
+} from "./../../composables/serviceServiceControlUrls.js";
+import {
+  connectionState,
+  monitoringConnectionState,
+} from "../../composables/serviceServiceControl";
 
-const configuredServiceControlUrl = inject(key_ServiceControlUrl);
-const configuredMonitoringUrl = inject(key_MonitoringUrl);
-const updateConnections = inject(key_UpdateConnections);
+const isExpired = licenseStatus.isExpired;
 
 const serviceControlUrl = ref(configuredServiceControlUrl.value);
 const monitoringUrl = ref(configuredMonitoringUrl.value);
 
-const unableToConnectToServiceControl = inject(
-  key_UnableToConnectToServiceControl
-);
-const unableToConnectToMonitoring = inject(key_UnableToConnectToMonitoring);
-
 const testingServiceControl = ref(false);
 const serviceControlValid = ref(null);
 
@@ -32,14 +24,14 @@ const testingMonitoring = ref(false);
 const monitoringValid = ref(null);
 
 const connectionSaved = ref(null);
-const urlParams = ref(useRoute());
 
 function testServiceControlUrl(event) {
   if (event) {
     testingServiceControl.value = true;
     return fetch(serviceControlUrl.value)
-      .then(() => {
-        serviceControlValid.value = true;
+      .then((response) => {
+        serviceControlValid.value =
+          response.ok && response.headers.has("X-Particular-Version");
       })
       .catch(() => {
         serviceControlValid.value = false;
@@ -54,8 +46,9 @@ function testMonitoringUrl(event) {
   if (event) {
     testingMonitoring.value = true;
     return fetch(monitoringUrl.value + "monitored-endpoints")
-      .then(() => {
-        monitoringValid.value = true;
+      .then((response) => {
+        monitoringValid.value =
+          response.ok && response.headers.has("X-Particular-Version");
       })
       .catch(() => {
         monitoringValid.value = false;
@@ -68,11 +61,7 @@ function testMonitoringUrl(event) {
 
 function saveConnections(event) {
   if (event) {
-    updateConnections(
-      urlParams.value,
-      serviceControlUrl.value,
-      monitoringUrl.value
-    );
+    updateServiceControlUrls(serviceControlUrl.value, monitoringUrl.value);
     connectionSaved.value = true;
   }
 }
@@ -91,7 +80,7 @@ function saveConnections(event) {
                 <div class="col-sm-7 form-group">
                   <label for="serviceControlUrl"
                     >CONNECTION URL
-                    <template v-if="unableToConnectToServiceControl">
+                    <template v-if="connectionState.unableToConnect">
                       <span class="failed-validation">
                         <i class="fa fa-exclamation-triangle"></i> Unable to
                         connect</span
@@ -148,7 +137,7 @@ function saveConnections(event) {
                   <label for="monitoringUrl"
                     >CONNECTION URL
                     <span class="auxilliary-label">(OPTIONAL)</span>
-                    <template v-if="unableToConnectToMonitoring">
+                    <template v-if="monitoringConnectionState.unableToConnect">
                       <span class="failed-validation">
                         <i class="fa fa-exclamation-triangle"></i> Unable to
                         connect
diff --git a/src/ServicePulse.Host/vue/src/components/configuration/PlatformLicense.vue b/src/ServicePulse.Host/vue/src/components/configuration/PlatformLicense.vue
index fd28a70d72..60c021ea43 100644
--- a/src/ServicePulse.Host/vue/src/components/configuration/PlatformLicense.vue
+++ b/src/ServicePulse.Host/vue/src/components/configuration/PlatformLicense.vue
@@ -1,58 +1,11 @@
 <script setup>
-import { inject, ref, computed } from "vue";
-import {
-  key_IsSCConnected,
-  key_IsSCConnecting,
-  key_ScConnectedAtLeastOnce,
-  key_License,
-} from "./../../composables/keys.js";
-import {
-  useIsSubscriptionLicense,
-  useIsExpired,
-  useIsExpiring,
-  useIsValid,
-  useIsUpgradeProtectionLicense,
-  useLicenseWarningLevel,
-  useUpgradeDaysLeft,
-  useExpirationDaysLeft,
-} from "./../../composables/serviceLicense.js";
+import { computed } from "vue";
+import { license, licenseStatus } from "./../../composables/serviceLicense.js";
 import ServiceControlNotAvailable from "../ServiceControlNotAvailable.vue";
+import { connectionState } from "../../composables/serviceServiceControl";
 import BusyIndicator from "../BusyIndicator.vue";
 import ExclamationMark from "./../../components/ExclamationMark.vue";
 
-const isSCConnected = inject(key_IsSCConnected);
-const isSCConnecting = inject(key_IsSCConnecting);
-const scConnectedAtLeastOnce = inject(key_ScConnectedAtLeastOnce);
-const license = inject(key_License);
-const isSubscriptionLicense = ref(useIsSubscriptionLicense(license.value));
-const isTrialLicense = ref(license.value.trial_license);
-const isExpired = ref(useIsExpired(license.value.license_status));
-const isExpiring = ref(useIsExpiring(license.value.license_status));
-const isValid = ref(useIsValid(license.value.license_status));
-const isUpgradeProtectionLicense = ref(
-  useIsUpgradeProtectionLicense(license.value)
-);
-const expiredWarningType = ref(
-  useLicenseWarningLevel(license.value.license_status)
-);
-const licenseEdition = ref(license.value.licenseEdition);
-const instanceName = ref(license.value.formattedInstanceName);
-
-const upgradeDaysLeft = ref(
-  useUpgradeDaysLeft(license.value.upgrade_protection_expiration, isValid.value)
-);
-const expirationDaysLeft = ref(
-  useExpirationDaysLeft(
-    license.value.expiration_date,
-    isValid.value,
-    isExpiring.value
-  )
-);
-const formattedExpirationDate = ref(license.value.formattedExpirationDate);
-const formattedUpgradeProtectionExpiration = ref(
-  license.value.formattedUpgradeProtectionExpiration
-);
-
 const loading = computed(() => {
   return !license;
 });
@@ -60,14 +13,8 @@ const loading = computed(() => {
 
 <template>
   <section name="license">
-    <div class="sp-loader" v-if="isSCConnecting"></div>
-    <ServiceControlNotAvailable
-      :isSCConnected="isSCConnected"
-      :isSCConnecting="isSCConnecting"
-      :scConnectedAtLeastOnce="scConnectedAtLeastOnce"
-    />
-
-    <template v-if="isSCConnected || scConnectedAtLeastOnce">
+    <ServiceControlNotAvailable />
+    <template v-if="!connectionState.unableToConnect">
       <section>
         <busy-indicator v-if="loading"></busy-indicator>
 
@@ -77,33 +24,55 @@ const loading = computed(() => {
               <div class="license-info">
                 <div>
                   <b>Platform license type:</b> {{ license.license_type
-                  }}{{ licenseEdition }}
+                  }}{{ license.licenseEdition.value }}
                 </div>
 
-                <template v-if="isSubscriptionLicense || isTrialLicense">
+                <template v-if="licenseStatus.isSubscriptionLicense">
                   <div>
                     <b>License expiry date: </b>
-                    <span :class="{ 'license-expired': isExpired }">
-                      {{ formattedExpirationDate }} {{ expirationDaysLeft }}
-                      <exclamation-mark :type="expiredWarningType" />
+                    <span
+                      :class="{
+                        'license-expired': licenseStatus.isPlatformExpired,
+                      }"
+                    >
+                      {{ license.formattedExpirationDate.value }}
+                      {{ licenseStatus.subscriptionDaysLeft }}
+                      <exclamation-mark :type="licenseStatus.warningLevel" />
                     </span>
                     <div
                       class="license-expired-text"
-                      v-if="isExpired && isSubscriptionLicense"
+                      v-if="licenseStatus.isPlatformExpired"
                     >
                       Your license expired. Please update the license to
                       continue using the Particular Service Platform.
                     </div>
+                  </div>
+                </template>
+                <template v-if="licenseStatus.isTrialLicense">
+                  <div>
+                    <b>License expiry date: </b>
+                    <span
+                      :class="{
+                        'license-expired': licenseStatus.isPlatformTrialExpired,
+                      }"
+                    >
+                      {{ license.formattedExpirationDate.value }}
+                      {{ licenseStatus.trialDaysLeft }}
+                      <exclamation-mark :type="licenseStatus.warningLevel" />
+                    </span>
                     <div
                       class="license-expired-text"
-                      v-if="isExpired && isTrialLicense"
+                      v-if="licenseStatus.isPlatformTrialExpired"
                     >
                       Your license expired. To continue using the Particular
                       Service Platform you'll need to extend your license.
                     </div>
                     <div
                       class="license-page-extend-trial"
-                      v-if="isTrialLicense && (isExpiring || isExpired)"
+                      v-if="
+                        licenseStatus.isPlatformTrialExpiring &&
+                        licenseStatus.isPlatformTrialExpired
+                      "
                     >
                       <a
                         class="btn btn-default btn-primary"
@@ -116,30 +85,46 @@ const loading = computed(() => {
                     </div>
                   </div>
                 </template>
-                <template v-if="isUpgradeProtectionLicense">
+                <template v-if="licenseStatus.isUpgradeProtectionLicense">
                   <div>
                     <span>
                       <b>Upgrade protection expiry date:</b>
-                      <span :class="{ 'license-expired': !isValid }">
-                        {{ formattedUpgradeProtectionExpiration }}
-                        {{ upgradeDaysLeft }}
-                        <exclamation-mark :type="expiredWarningType" />
+                      <span
+                        :class="{
+                          'license-expired':
+                            licenseStatus.isInvalidDueToUpgradeProtectionExpired,
+                        }"
+                      >
+                        {{ license.formattedUpgradeProtectionExpiration.value }}
+                        {{ licenseStatus.upgradeDaysLeft }}
+                        <exclamation-mark :type="licenseStatus.warningLevel" />
                       </span>
                     </span>
                     <div
                       class="license-expired-text"
-                      v-if="isValid && (isExpiring || isExpired)"
+                      v-if="
+                        licenseStatus.isValidWithExpiredUpgradeProtection ||
+                        licenseStatus.isValidWithExpiringUpgradeProtection
+                      "
                     >
                       <b>Warning:</b> Once upgrade protection expires, you'll no
                       longer have access to support or new product versions.
                     </div>
-                    <div class="license-expired-text" v-if="!isValid">
+                    <div
+                      class="license-expired-text"
+                      v-if="
+                        licenseStatus.isInvalidDueToUpgradeProtectionExpired
+                      "
+                    >
                       Your license upgrade protection expired before this
                       version of ServicePulse was released.
                     </div>
                   </div>
                 </template>
-                <div><b>ServiceControl instance:</b> {{ instanceName }}</div>
+                <div>
+                  <b>ServiceControl instance:</b>
+                  {{ license.formattedInstanceName.value }}
+                </div>
                 <ul class="license-install-info">
                   <li>
                     <a
diff --git a/src/ServicePulse.Host/vue/src/components/configuration/RetryRedirects.vue b/src/ServicePulse.Host/vue/src/components/configuration/RetryRedirects.vue
index 8f1304bf2d..2b24a570ec 100644
--- a/src/ServicePulse.Host/vue/src/components/configuration/RetryRedirects.vue
+++ b/src/ServicePulse.Host/vue/src/components/configuration/RetryRedirects.vue
@@ -1,39 +1,27 @@
 <script setup>
-import { inject, ref, reactive, onMounted } from "vue";
+import { ref, reactive, onMounted } from "vue";
 import LicenseExpired from "../LicenseExpired.vue";
-import { useLicenseStatus } from "../../composables/serviceLicense.js";
+import { licenseStatus } from "../../composables/serviceLicense.js";
 import ServiceControlNotAvailable from "../ServiceControlNotAvailable.vue";
+import { connectionState } from "../../composables/serviceServiceControl";
 import RetryRedirectEdit from "./RetryRedirectEdit.vue";
 import RetryRedirectDelete from "./RetryRedirectDelete.vue";
 import NoData from "../NoData.vue";
 import BusyIndicator from "../BusyIndicator.vue";
 import { useShowToast } from "../../composables/toast.js";
 import TimeSince from "../TimeSince.vue";
-
-import {
-  key_ServiceControlUrl,
-  key_IsSCConnected,
-  key_ScConnectedAtLeastOnce,
-  key_IsSCConnecting,
-} from "./../../composables/keys.js";
 import {
   useRedirects,
   useUpdateRedirects,
   useCreateRedirects,
   useDeleteRedirects,
-  retryPendingMessagesForQueue,
+  useRetryPendingMessagesForQueue,
 } from "../../composables/serviceRedirects.js";
 
-const isExpired = ref(useLicenseStatus.isExpired);
+const isExpired = licenseStatus.isExpired;
 
 const emit = defineEmits(["redirectCountUpdated"]);
 
-const isSCConnected = inject(key_IsSCConnected);
-const scConnectedAtLeastOnce = inject(key_ScConnectedAtLeastOnce);
-const isSCConnecting = inject(key_IsSCConnecting);
-
-const configuredServiceControlUrl = inject(key_ServiceControlUrl);
-
 const loadingData = ref(true);
 const redirects = reactive({
   total: 0,
@@ -54,7 +42,7 @@ const redirectSaveSuccessful = ref(null);
 
 function getRedirect() {
   loadingData.value = true;
-  useRedirects(configuredServiceControlUrl.value).then((result) => {
+  useRedirects().then((result) => {
     if (redirects.total != result.total) {
       emit("redirectCountUpdated", result.total);
     }
@@ -85,7 +73,6 @@ function saveEditedRedirect(redirect) {
   redirectSaveSuccessful.value = null;
   showEdit.value = false;
   useUpdateRedirects(
-    configuredServiceControlUrl.value,
     redirect.redirectId,
     redirect.sourceQueue,
     redirect.targetQueue
@@ -113,10 +100,7 @@ function saveEditedRedirect(redirect) {
     })
     .then((result) => {
       if (result.message === "success" && redirect.immediatelyRetry) {
-        return retryPendingMessagesForQueue(
-          configuredServiceControlUrl.value,
-          redirect.sourceQueue
-        );
+        return useRetryPendingMessagesForQueue(redirect.sourceQueue);
       } else {
         return result;
       }
@@ -126,41 +110,39 @@ function saveEditedRedirect(redirect) {
 function saveCreatedRedirect(redirect) {
   redirectSaveSuccessful.value = null;
   showEdit.value = false;
-  useCreateRedirects(
-    configuredServiceControlUrl.value,
-    redirect.sourceQueue,
-    redirect.targetQueue
-  ).then((result) => {
-    if (result.message === "success") {
-      redirectSaveSuccessful.value = true;
-      useShowToast("info", "Info", "Redirect created successfully");
-      getRedirect();
-    } else {
-      redirectSaveSuccessful.value = false;
-      if (
-        (result.status === "409" || result.status === 409) &&
-        result.statusText === "Duplicate"
-      ) {
-        useShowToast(
-          "error",
-          "Error",
-          "Failed to create a redirect, can not create more than one redirect for queue: " +
-            redirect.sourceQueue
-        );
-      } else if (
-        (result.status === "409" || result.status === 409) &&
-        result.statusText === "Dependents"
-      ) {
-        useShowToast(
-          "error",
-          "Error",
-          "Failed to create a redirect, can not create a redirect to a queue that already has a redirect or is a target of a redirect."
-        );
+  useCreateRedirects(redirect.sourceQueue, redirect.targetQueue).then(
+    (result) => {
+      if (result.message === "success") {
+        redirectSaveSuccessful.value = true;
+        useShowToast("info", "Info", "Redirect created successfully");
+        getRedirect();
       } else {
-        useShowToast("error", "Error", result.message);
+        redirectSaveSuccessful.value = false;
+        if (
+          (result.status === "409" || result.status === 409) &&
+          result.statusText === "Duplicate"
+        ) {
+          useShowToast(
+            "error",
+            "Error",
+            "Failed to create a redirect, can not create more than one redirect for queue: " +
+              redirect.sourceQueue
+          );
+        } else if (
+          (result.status === "409" || result.status === 409) &&
+          result.statusText === "Dependents"
+        ) {
+          useShowToast(
+            "error",
+            "Error",
+            "Failed to create a redirect, can not create a redirect to a queue that already has a redirect or is a target of a redirect."
+          );
+        } else {
+          useShowToast("error", "Error", result.message);
+        }
       }
     }
-  });
+  );
 }
 
 function deleteRedirect(redirect) {
@@ -171,18 +153,16 @@ function deleteRedirect(redirect) {
 
 function saveDeleteRedirect(redirectId) {
   showDelete.value = false;
-  useDeleteRedirects(configuredServiceControlUrl.value, redirectId).then(
-    (result) => {
-      if (result.message === "success") {
-        redirectSaveSuccessful.value = true;
-        useShowToast("info", "Info", "Redirect deleted");
-        getRedirect();
-      } else {
-        redirectSaveSuccessful.value = false;
-        useShowToast("error", "Error", result.message);
-      }
+  useDeleteRedirects(redirectId).then((result) => {
+    if (result.message === "success") {
+      redirectSaveSuccessful.value = true;
+      useShowToast("info", "Info", "Redirect deleted");
+      getRedirect();
+    } else {
+      redirectSaveSuccessful.value = false;
+      useShowToast("error", "Error", result.message);
     }
-  );
+  });
 }
 
 onMounted(() => {
@@ -194,14 +174,8 @@ onMounted(() => {
   <LicenseExpired />
   <template v-if="!isExpired">
     <section name="redirects">
-      <div class="sp-loader" v-if="isSCConnecting"></div>
-      <ServiceControlNotAvailable
-        :isSCConnected="isSCConnected"
-        :isSCConnecting="isSCConnecting"
-        :scConnectedAtLeastOnce="scConnectedAtLeastOnce"
-      />
-
-      <template v-if="isSCConnected || scConnectedAtLeastOnce">
+      <ServiceControlNotAvailable />
+      <template v-if="!connectionState.unableToConnect">
         <section>
           <busy-indicator v-if="loadingData"></busy-indicator>
 
diff --git a/src/ServicePulse.Host/vue/src/composables/eventLogItems.js b/src/ServicePulse.Host/vue/src/composables/eventLogItems.js
index c5729913be..dfb76944a6 100644
--- a/src/ServicePulse.Host/vue/src/composables/eventLogItems.js
+++ b/src/ServicePulse.Host/vue/src/composables/eventLogItems.js
@@ -1,7 +1,7 @@
-export function getEventLogItems(serviceControlUrl) {
-  var url = serviceControlUrl.value + "eventlogitems";
+import { useFetchFromServiceControl } from "./serviceServiceControlUrls";
 
-  return fetch(url).then((response) => {
+export function getEventLogItems() {
+  return useFetchFromServiceControl("eventlogitems").then((response) => {
     return response.json();
   });
 }
diff --git a/src/ServicePulse.Host/vue/src/composables/fetch.js b/src/ServicePulse.Host/vue/src/composables/fetch.js
deleted file mode 100644
index 2a70782805..0000000000
--- a/src/ServicePulse.Host/vue/src/composables/fetch.js
+++ /dev/null
@@ -1,35 +0,0 @@
-import { ref, isRef, unref, watchEffect } from "vue";
-
-export function useFetch(url) {
-  const data = ref(null);
-  const error = ref(null);
-
-  async function doFetch() {
-    // reset state before fetching..
-    data.value = null;
-    error.value = null;
-
-    // resolve the url value synchronously so it's tracked as a
-    // dependency by watchEffect()
-    const urlValue = unref(url);
-
-    try {
-      // unref() will return the ref value if it's a ref
-      // otherwise the value will be returned as-is
-      const res = await fetch(urlValue);
-      data.value = res; //await res.json()
-    } catch (e) {
-      error.value = e;
-    }
-  }
-
-  if (isRef(url)) {
-    // setup reactive re-fetch if input URL is a ref
-    watchEffect(doFetch);
-  } else {
-    // otherwise, just fetch once
-    doFetch();
-  }
-
-  return { data, error, retry: doFetch };
-}
diff --git a/src/ServicePulse.Host/vue/src/composables/keys.js b/src/ServicePulse.Host/vue/src/composables/keys.js
deleted file mode 100644
index 0540b37352..0000000000
--- a/src/ServicePulse.Host/vue/src/composables/keys.js
+++ /dev/null
@@ -1,32 +0,0 @@
-export const key_ServiceControlUrl = Symbol("serviceControlUrl");
-export const key_MonitoringUrl = Symbol("monitoringUrl");
-export const key_UnableToConnectToServiceControl = Symbol(
-  "unableToConnectToServiceControl"
-);
-export const key_UnableToConnectToMonitoring = Symbol(
-  "unableToConnectToMonitoring"
-);
-export const key_IsSCConnecting = Symbol("isSCConnecting");
-export const key_IsSCConnected = Symbol("isSCConnected");
-export const key_ScConnectedAtLeastOnce = Symbol("scConnectedAtLeastOnce");
-export const key_IsMonitoringEnabled = Symbol("isMonitoringEnabled");
-export const key_IsSCMonitoringConnected = Symbol("isSCMonitoringConnected");
-export const key_IsSCMonitoringConnecting = Symbol("isSCMonitoringConnecting");
-export const key_UpdateConnections = Symbol("updateConnections");
-export const key_Stats = Symbol("stats");
-export const key_License = Symbol("license");
-export const key_IsCompatibleWithSC = Symbol("IsCompatibleWithSC");
-export const key_SPVersion = Symbol("spVersion");
-export const key_NewSPVersion = Symbol("newSPVersion");
-export const key_NewSPVersionLink = Symbol("newSPVersionLink");
-export const key_NewSPVersionNumber = Symbol("newSPVersionNumber");
-export const key_SCVersion = Symbol("scVersion");
-export const key_NewSCVersion = Symbol("newSCVersion");
-export const key_NewSCVersionLink = Symbol("newSPCersionLink");
-export const key_NewSCVersionNumber = Symbol("newSCPVersionNumber");
-export const key_MonitoringVersion = Symbol("monitoringVersion");
-export const key_NewMonitoringVersion = Symbol("newMonitoringVersion");
-export const key_NewMonitoringVersionLink = Symbol("newMonitoringVersionLink");
-export const key_NewMonitoringVersionNumber = Symbol(
-  "newMonitoringVersionNumber"
-);
diff --git a/src/ServicePulse.Host/vue/src/composables/serviceLicense.js b/src/ServicePulse.Host/vue/src/composables/serviceLicense.js
index 0809fcc7c1..bf3d0ed636 100644
--- a/src/ServicePulse.Host/vue/src/composables/serviceLicense.js
+++ b/src/ServicePulse.Host/vue/src/composables/serviceLicense.js
@@ -1,5 +1,7 @@
-import { ref, computed } from "vue";
+import { reactive, computed, watch } from "vue";
 import { useGetDayDiffFromToday } from "./formatter";
+import { useFetchFromServiceControl } from "./serviceServiceControlUrls";
+import { useShowToast } from "./toast.js";
 
 const subscriptionExpiring =
   '<div class="license-warning"><strong>Platform license expires soon</strong><div>Once the license expires you\'ll no longer be able to continue using the Particular Service Platform.</div><a href="/configuration#license" class="btn btn-license-warning">View license details</a></div>';
@@ -10,7 +12,7 @@ const upgradeProtectionExpired =
 const trialExpiring =
   '<div class="license-warning"><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="http://particular.net/extend-your-trial?p=servicepulse" class="btn btn-license-warning"><i class="fa fa-external-link-alt"></i> Extend your license</a><a href="/configuration#license" class="btn btn-license-warning-light">View license details</a></div>';
 
-const license = ref({
+export var license = reactive({
   edition: "",
   licenseEdition: "",
   expiration_date: undefined,
@@ -24,99 +26,118 @@ const license = ref({
   license_status: "Unavailable",
 });
 
-const isPlatformExpired = computed(() => {
-  return license.value
-    ? license.value.license_status == "InvalidDueToExpiredSubscription"
-    : false;
+export const licenseStatus = reactive({
+  isSubscriptionLicense: false,
+  isUpgradeProtectionLicense: false,
+  isTrialLicense: false,
+  isPlatformExpired: false,
+  isPlatformTrialExpired: false,
+  isPlatformTrialExpiring: false,
+  isInvalidDueToUpgradeProtectionExpired: false,
+  isValidWithExpiredUpgradeProtection: false,
+  isValidWithExpiringUpgradeProtection: false,
+  isExpired: false,
+  upgradeDaysLeft: "",
+  subscriptionDaysLeft: "",
+  trialDaysLeft: "",
+  warningLevel: "",
 });
 
-const isPlatformTrialExpired = computed(() => {
-  return license.value
-    ? license.value.license_status === "InvalidDueToExpiredTrial"
-    : false;
-});
-const isInvalidDueToUpgradeProtectionExpired = computed(() => {
-  return license.value
-    ? license.value.license_status === "InvalidDueToExpiredUpgradeProtection"
-    : false;
-});
-
-const isExpired = computed(() => {
-  return (
-    isPlatformExpired.value ||
-    isPlatformTrialExpired.value ||
-    isInvalidDueToUpgradeProtectionExpired.value
-  );
-});
-
-export const useLicenseStatus = {
-  isPlatformExpired: isPlatformExpired,
-  isPlatformTrialExpired: isPlatformTrialExpired,
-  isInvalidDueToUpgradeProtectionExpired:
-    isInvalidDueToUpgradeProtectionExpired,
-  isExpired: isExpired,
-};
-
-export function useLicense(serviceControlUrl) {
-  return getLicense(serviceControlUrl, license).then((lic) => {
-    license.value = lic;
-    license.value.licenseEdition = computed(() => {
-      return license.value.license_type && license.value.edition
-        ? ", " + license.value.edition
-        : "";
-    });
-    license.value.formattedInstanceName = computed(() => {
-      return (
-        license.value.instance_name ||
-        "Upgrade ServiceControl to v3.4.0+ to see more information about this license"
-      );
-    });
-    license.value.formattedExpirationDate = computed(() => {
-      return license.value.expiration_date
-        ? new Date(
-            license.value.expiration_date.replace("Z", "")
-          ).toLocaleDateString()
-        : "";
-    });
-    license.value.formattedUpgradeProtectionExpiration = computed(() => {
-      return license.value.upgrade_protection_expiration
-        ? new Date(
-            license.value.upgrade_protection_expiration.replace("Z", "")
-          ).toLocaleDateString()
-        : "";
-    });
-    return license;
+export function useLicense() {
+  watch(license, async (newValue, oldValue) => {
+    const checkForWarnings =
+      oldValue !== null
+        ? newValue && newValue.license_status != oldValue.license_status
+        : newValue !== null;
+    if (checkForWarnings) {
+      displayWarningMessage(newValue.license_status);
+    }
   });
-}
 
-export function useIsValidWithWarning(licenseStatus) {
-  return (
-    licenseStatus === "ValidWithExpiringUpgradeProtection" ||
-    licenseStatus === "ValidWithExpiringTrial" ||
-    licenseStatus === "ValidWithExpiredUpgradeProtection" ||
-    licenseStatus === "ValidWithExpiringSubscription"
-  );
+  return getLicense(license)
+    .then((lic) => {
+      license = lic;
+      license.licenseEdition = computed(() => {
+        return license.license_type && license.edition
+          ? ", " + license.edition
+          : "";
+      });
+      license.formattedInstanceName = computed(() => {
+        return (
+          license.instance_name ||
+          "Upgrade ServiceControl to v3.4.0+ to see more information about this license"
+        );
+      });
+      license.formattedExpirationDate = computed(() => {
+        return license.expiration_date
+          ? new Date(
+              license.expiration_date.replace("Z", "")
+            ).toLocaleDateString()
+          : "";
+      });
+      license.formattedUpgradeProtectionExpiration = computed(() => {
+        return license.upgrade_protection_expiration
+          ? new Date(
+              license.upgrade_protection_expiration.replace("Z", "")
+            ).toLocaleDateString()
+          : "";
+      });
+      return license;
+    })
+    .then((lic) => {
+      licenseStatus.isSubscriptionLicense = isSubscriptionLicense(lic);
+      licenseStatus.isUpgradeProtectionLicense =
+        isUpgradeProtectionLicense(lic);
+      licenseStatus.isTrialLicense = lic.trial_license;
+      licenseStatus.isPlatformExpired =
+        lic.license_status === "InvalidDueToExpiredSubscription";
+      licenseStatus.isPlatformTrialExpiring =
+        lic.license_status === "ValidWithExpiringTrial";
+      licenseStatus.isPlatformTrialExpired =
+        lic.license_status === "InvalidDueToExpiredTrial";
+      licenseStatus.isInvalidDueToUpgradeProtectionExpired =
+        lic.license_status === "InvalidDueToExpiredUpgradeProtection";
+      licenseStatus.isValidWithExpiredUpgradeProtection =
+        lic.license_status === "ValidWithExpiredUpgradeProtection";
+      licenseStatus.isValidWithExpiringUpgradeProtection =
+        lic.license_status === "ValidWithExpiringUpgradeProtection";
+      licenseStatus.upgradeDaysLeft = getUpgradeDaysLeft(lic);
+      licenseStatus.subscriptionDaysLeft = getSubscriptionDaysLeft(lic);
+      licenseStatus.trialDaysLeft = getTrialDaysLeft(lic);
+      licenseStatus.warningLevel = getLicenseWarningLevel(lic.license_status);
+      licenseStatus.isExpired =
+        licenseStatus.isPlatformExpired ||
+        licenseStatus.isPlatformTrialExpired ||
+        licenseStatus.isInvalidDueToUpgradeProtectionExpired;
+      return lic;
+    });
 }
 
-export function useLicenseWarningLevel(licenseStatus) {
+function getLicenseWarningLevel(licenseStatus) {
   if (
     licenseStatus === "InvalidDueToExpiredTrial" ||
     licenseStatus === "InvalidDueToExpiredSubscription" ||
     licenseStatus === "InvalidDueToExpiredUpgradeProtection"
   )
     return "danger";
-  else if (useIsValidWithWarning(licenseStatus)) return "warning";
+  else if (
+    licenseStatus === "ValidWithExpiringUpgradeProtection" ||
+    licenseStatus === "ValidWithExpiringTrial" ||
+    licenseStatus === "ValidWithExpiredUpgradeProtection" ||
+    licenseStatus === "ValidWithExpiringSubscription"
+  )
+    return "warning";
   return "";
 }
 
-export function useIsUpgradeProtectionLicense(license) {
+function isUpgradeProtectionLicense(license) {
   return (
     license.upgrade_protection_expiration !== undefined &&
     license.upgrade_protection_expiration !== ""
   );
 }
 
-export function useIsSubscriptionLicense(license) {
+function isSubscriptionLicense(license) {
   return (
     license.expiration_date !== undefined &&
     license.expiration_date !== "" &&
@@ -124,40 +145,7 @@ export function useIsSubscriptionLicense(license) {
   );
 }
 
-export function useIsExpiring(licenseStatus) {
-  return (
-    licenseStatus === "ValidWithExpiringSubscription" ||
-    licenseStatus === "ValidWithExpiringTrial" ||
-    licenseStatus === "ValidWithExpiringUpgradeProtection"
-  );
-}
-
-export function useIsExpired(licenseStatus) {
-  return (
-    licenseStatus === "InvalidDueToExpiredTrial" ||
-    licenseStatus === "InvalidDueToExpiredSubscription" ||
-    licenseStatus === "ValidWithExpiredUpgradeProtection" ||
-    licenseStatus === "InvalidDueToExpiredUpgradeProtection"
-  );
-}
-
-export function useIsValid(licenseStatus) {
-  return (
-    licenseStatus !== "InvalidDueToExpiredTrial" &&
-    licenseStatus !== "InvalidDueToExpiredSubscription" &&
-    licenseStatus !== "InvalidDueToExpiredUpgradeProtection"
-  );
-}
-
-export function useUpgradeDaysLeft(expirationDate, isValid) {
-  return getUpgradeDaysLeft(expirationDate, isValid);
-}
-
-export function useExpirationDaysLeft(expirationDate, isValid, isExpiring) {
-  return getExpirationDaysLeft(expirationDate, isValid, isExpiring);
-}
-
-export function useGetWarningMessage(licenseStatus, useShowToast) {
+function displayWarningMessage(licenseStatus) {
   switch (licenseStatus) {
     case "ValidWithExpiredUpgradeProtection":
       useShowToast("warning", "", upgradeProtectionExpired, true);
@@ -174,31 +162,61 @@ export function useGetWarningMessage(licenseStatus, useShowToast) {
     case "ValidWithExpiringUpgradeProtection":
       useShowToast("warning", "", upgradeProtectionExpiring, true);
       break;
+
+    case "InvalidDueToExpiredTrial":
+    case "InvalidDueToExpiredSubscription":
+    case "InvalidDueToExpiredUpgradeProtection":
+      useShowToast(
+        "error",
+        "Error",
+        'Your license has expired. Please contact Particular Software support at: <a href="http://particular.net/support">http://particular.net/support</a>',
+        true
+      );
+      break;
   }
 }
 
-function getExpirationDaysLeft(expirationDate, isValid, isExpiring) {
-  if (!isValid) return " - expired";
+function getSubscriptionDaysLeft(license) {
+  if (license.license_status === "InvalidDueToExpiredSubscription")
+    return " - expired";
+
+  const isExpiring = license.license_status === "ValidWithExpiringSubscription";
 
-  const expiringIn = useGetDayDiffFromToday(expirationDate);
+  const expiringIn = useGetDayDiffFromToday(license.expiration_date);
   if (!isExpiring) return " - " + expiringIn + " days left";
   if (expiringIn === 0) return " - expiring today";
   if (expiringIn === 1) return " - expiring tomorrow";
   return " - expiring in " + expiringIn + " days";
 }
 
-function getUpgradeDaysLeft(expirationDate, isValid) {
-  if (!isValid) return " - expired";
+function getTrialDaysLeft(license) {
+  if (license.license_status === "InvalidDueToExpiredTrial")
+    return " - expired";
 
-  const expiringIn = useGetDayDiffFromToday(expirationDate);
+  const isExpiring = license.license_status === "ValidWithExpiringTrial";
+
+  const expiringIn = useGetDayDiffFromToday(license.expiration_date);
+  if (!isExpiring) return " - " + expiringIn + " days left";
+  if (expiringIn === 0) return " - expiring today";
+  if (expiringIn === 1) return " - expiring tomorrow";
+  return " - expiring in " + expiringIn + " days";
+}
+
+function getUpgradeDaysLeft(license) {
+  if (license.license_status === "InvalidDueToExpiredUpgradeProtection")
+    return " - expired";
+
+  const expiringIn = useGetDayDiffFromToday(
+    license.upgrade_protection_expiration
+  );
   if (expiringIn <= 0) return " - expired";
   if (expiringIn === 0) return " - expiring today";
   if (expiringIn === 1) return " - 1 day left";
   return " - " + expiringIn + " days left";
 }
 
-function getLicense(serviceControlUrl, emptyLicense) {
-  return fetch(serviceControlUrl + "license?refresh=true")
+function getLicense(emptyLicense) {
+  return useFetchFromServiceControl("license?refresh=true")
     .then((response) => {
       return response.json();
     })
diff --git a/src/ServicePulse.Host/vue/src/composables/serviceNotifications.js b/src/ServicePulse.Host/vue/src/composables/serviceNotifications.js
index a182f9a048..5af4c51038 100644
--- a/src/ServicePulse.Host/vue/src/composables/serviceNotifications.js
+++ b/src/ServicePulse.Host/vue/src/composables/serviceNotifications.js
@@ -1,5 +1,10 @@
-export function useEmailNotifications(serviceControlUrl) {
-  const emailNotificationResults = getEmailNotifications(serviceControlUrl);
+import {
+  useFetchFromServiceControl,
+  usePostToServiceControl,
+} from "./serviceServiceControlUrls";
+
+export function useEmailNotifications() {
+  const emailNotificationResults = getEmailNotifications();
 
   return Promise.all([emailNotificationResults])
     .then(([emailNotifications]) => {
@@ -10,8 +15,8 @@ export function useEmailNotifications(serviceControlUrl) {
     });
 }
 
-function getEmailNotifications(serviceControlUrl) {
-  return fetch(serviceControlUrl + "notifications/email")
+function getEmailNotifications() {
+  return useFetchFromServiceControl("notifications/email")
     .then((response) => {
       return response.json();
     })
@@ -28,14 +33,8 @@ function getEmailNotifications(serviceControlUrl) {
     });
 }
 
-export function useUpdateEmailNotifications(serviceControlUrl, settings) {
-  const requestOptions = {
-    method: "POST",
-    headers: { "Content-Type": "application/json" },
-    body: JSON.stringify(settings),
-  };
-
-  return fetch(serviceControlUrl + "notifications/email", requestOptions)
+export function useUpdateEmailNotifications(settings) {
+  return usePostToServiceControl("notifications/email", settings)
     .then((response) => {
       var result = {
         message: response.ok ? "success" : "error:" + response.statusText,
@@ -54,14 +53,8 @@ export function useUpdateEmailNotifications(serviceControlUrl, settings) {
     });
 }
 
-export function useTestEmailNotifications(serviceControlUrl) {
-  const requestOptions = {
-    method: "POST",
-    headers: { "Content-Type": "application/json" },
-    body: JSON.stringify({}),
-  };
-
-  return fetch(serviceControlUrl + "notifications/email/test", requestOptions)
+export function useTestEmailNotifications() {
+  return usePostToServiceControl("notifications/email/test", {})
     .then((response) => {
       var result = {
         message: response.ok ? "success" : "error:" + response.statusText,
@@ -80,14 +73,10 @@ export function useTestEmailNotifications(serviceControlUrl) {
     });
 }
 
-export function useToggleEmailNotifications(serviceControlUrl, enabled) {
-  const requestOptions = {
-    method: "POST",
-    headers: { "Content-Type": "application/json" },
-    body: JSON.stringify({ enabled: enabled }),
-  };
-
-  return fetch(serviceControlUrl + "notifications/email/toggle", requestOptions)
+export function useToggleEmailNotifications(enabled) {
+  return usePostToServiceControl("notifications/email/toggle", {
+    enabled: enabled,
+  })
     .then((response) => {
       var result = {
         message: response.ok ? "success" : "error:" + response.statusText,
diff --git a/src/ServicePulse.Host/vue/src/composables/serviceRedirects.js b/src/ServicePulse.Host/vue/src/composables/serviceRedirects.js
index 6b23a06836..26c604f96e 100644
--- a/src/ServicePulse.Host/vue/src/composables/serviceRedirects.js
+++ b/src/ServicePulse.Host/vue/src/composables/serviceRedirects.js
@@ -1,18 +1,25 @@
+import {
+  useFetchFromServiceControl,
+  useDeleteFromServiceControl,
+  usePutToServiceControl,
+  usePostToServiceControl,
+} from "./serviceServiceControlUrls.js";
+
 const redirects = {
   data: [],
   queues: [],
   total: 0,
 };
-export function useRedirects(serviceControlUrl) {
-  return getRedirects(serviceControlUrl)
-    .then(() => getKnownQueues(serviceControlUrl))
+export function useRedirects() {
+  return getRedirects()
+    .then(() => getKnownQueues())
     .then(() => {
       return redirects;
     });
 }
 
-function getKnownQueues(serviceControlUrl) {
-  return fetch(serviceControlUrl + `errors/queues/addresses`)
+function getKnownQueues() {
+  return useFetchFromServiceControl(`errors/queues/addresses`)
     .then((response) => {
       return response.json();
     })
@@ -26,8 +33,8 @@ function getKnownQueues(serviceControlUrl) {
     });
 }
 
-function getRedirects(serviceControlUrl) {
-  return fetch(serviceControlUrl + "redirects")
+function getRedirects() {
+  return useFetchFromServiceControl("redirects")
     .then((response) => {
       redirects.total = parseInt(response.headers.get("Total-Count"));
       return response.json();
@@ -40,14 +47,8 @@ function getRedirects(serviceControlUrl) {
     });
 }
 
-export function retryPendingMessagesForQueue(serviceControlUrl, queueName) {
-  const requestOptions = {
-    method: "POST",
-  };
-  return fetch(
-    serviceControlUrl + "errors/queues/" + queueName + "/retry",
-    requestOptions
-  )
+export function useRetryPendingMessagesForQueue(queueName) {
+  return usePostToServiceControl("errors/queues/" + queueName + "/retry")
     .then((response) => {
       var result = {
         message: response.ok ? "success" : "error:" + response.statusText,
@@ -65,23 +66,12 @@ export function retryPendingMessagesForQueue(serviceControlUrl, queueName) {
     });
 }
 
-export function useUpdateRedirects(
-  serviceControlUrl,
-  redirectId,
-  sourceEndpoint,
-  targetEndpoint
-) {
-  const requestOptions = {
-    method: "PUT",
-    headers: { "Content-Type": "application/json" },
-    body: JSON.stringify({
-      id: redirectId,
-      fromphysicaladdress: sourceEndpoint,
-      tophysicaladdress: targetEndpoint,
-    }),
-  };
-
-  return fetch(serviceControlUrl + "redirects/" + redirectId, requestOptions)
+export function useUpdateRedirects(redirectId, sourceEndpoint, targetEndpoint) {
+  return usePutToServiceControl("redirects/" + redirectId, {
+    id: redirectId,
+    fromphysicaladdress: sourceEndpoint,
+    tophysicaladdress: targetEndpoint,
+  })
     .then((response) => {
       var result = {
         message: response.ok ? "success" : "error:" + response.statusText,
@@ -100,21 +90,11 @@ export function useUpdateRedirects(
     });
 }
 
-export function useCreateRedirects(
-  serviceControlUrl,
-  sourceEndpoint,
-  targetEndpoint
-) {
-  const requestOptions = {
-    method: "POST",
-    headers: { "Content-Type": "application/json" },
-    body: JSON.stringify({
-      fromphysicaladdress: sourceEndpoint,
-      tophysicaladdress: targetEndpoint,
-    }),
-  };
-
-  return fetch(serviceControlUrl + "redirects", requestOptions)
+export function useCreateRedirects(sourceEndpoint, targetEndpoint) {
+  return usePostToServiceControl("redirects", {
+    fromphysicaladdress: sourceEndpoint,
+    tophysicaladdress: targetEndpoint,
+  })
     .then((response) => {
       var result = {
         message: response.ok ? "success" : "error:" + response.statusText,
@@ -133,12 +113,8 @@ export function useCreateRedirects(
     });
 }
 
-export function useDeleteRedirects(serviceControlUrl, redirectId) {
-  const requestOptions = {
-    method: "DELETE",
-  };
-
-  return fetch(serviceControlUrl + "redirects/" + redirectId, requestOptions)
+export function useDeleteRedirects(redirectId) {
+  return useDeleteFromServiceControl("redirects/" + redirectId)
     .then((response) => {
       var result = {
         message: response.ok ? "success" : "error:" + response.statusText,
diff --git a/src/ServicePulse.Host/vue/src/composables/serviceServiceControl.js b/src/ServicePulse.Host/vue/src/composables/serviceServiceControl.js
index 4304b4a57c..b891d08339 100644
--- a/src/ServicePulse.Host/vue/src/composables/serviceServiceControl.js
+++ b/src/ServicePulse.Host/vue/src/composables/serviceServiceControl.js
@@ -1,12 +1,14 @@
-import { ref, reactive } from "vue";
+import { reactive, onMounted, watch, computed } from "vue";
 import { useIsSupported, useIsUpgradeAvailable } from "./serviceSemVer.js";
 import { useServiceProductUrls } from "./serviceProductUrls.js";
+import {
+  useFetchFromServiceControl,
+  useFetchFromMonitoring,
+  serviceControlUrl,
+  monitoringUrl,
+} from "./serviceServiceControlUrls";
+import { useShowToast } from "./toast.js";
 
-export const isServiceControlConnecting = ref(true);
-export const isServiceControlConnected = ref(false);
-export const serviceControlConnectedAtLeastOnce = ref(false);
-export const isServiceControlMonitoringConnecting = ref(true);
-export const isServiceControlMonitoringConnected = ref(false);
 export const stats = reactive({
   active_endpoints: 0,
   failing_endpoints: 0,
@@ -20,6 +22,20 @@ export const stats = reactive({
   number_of_disconnected_endpoints: 0,
 });
 
+export const connectionState = reactive({
+  connected: false,
+  connecting: false,
+  connectedRecently: false,
+  unableToConnect: null,
+});
+
+export const monitoringConnectionState = reactive({
+  connected: false,
+  connecting: false,
+  connectedRecently: false,
+  unableToConnect: null,
+});
+
 export const environment = reactive({
   monitoring_version: "",
   sc_version: "",
@@ -70,11 +86,71 @@ export const connections = reactive({
   },
 });
 
-export function useServiceControlStats(serviceControlUrl) {
-  const failedHeartBeatsResult = getFailedHeartBeatsCount(serviceControlUrl);
-  const failedMessagesResult = getFailedMessagesCount(serviceControlUrl);
-  const failedCustomChecksResult =
-    getFailedCustomChecksCount(serviceControlUrl);
+export function useServiceControl() {
+  onMounted(() => {
+    useServiceControlStats();
+    useServiceControlMonitoringStats();
+  });
+
+  setInterval(() => useServiceControlStats(), 5000); //NOTE is 5 seconds too often?
+  setInterval(() => useServiceControlMonitoringStats(), 5000); //NOTE is 5 seconds too often?
+
+  const scConnectionFailure = computed(() => connectionState.unableToConnect);
+  const monitoringConnectionFailure = computed(
+    () => monitoringConnectionState.unableToConnect
+  );
+
+  watch(scConnectionFailure, async (newValue, oldValue) => {
+    //NOTE to eliminate success msg showing everytime the screen is refreshed
+    if (newValue != oldValue && !(oldValue === null && newValue === false)) {
+      if (newValue) {
+        useShowToast(
+          "error",
+          "Error",
+          "Could not connect to ServiceControl at " +
+            serviceControlUrl.value +
+            '. <a class="btn btn-default" href="/configuration#connections">View connection settings</a>'
+        );
+      } else {
+        useShowToast(
+          "success",
+          "Success",
+          "Connection to ServiceControl was successful at " +
+            serviceControlUrl.value +
+            "."
+        );
+      }
+    }
+  });
+
+  watch(monitoringConnectionFailure, async (newValue, oldValue) => {
+    //NOTE to eliminate success msg showing everytime the screen is refreshed
+    if (newValue != oldValue && !(oldValue === null && newValue === false)) {
+      if (newValue) {
+        useShowToast(
+          "error",
+          "Error",
+          "Could not connect to the ServiceControl Monitoring service at " +
+            monitoringUrl.value +
+            '. <a class="btn btn-default" href="/configuration#connections">View connection settings</a>'
+        );
+      } else {
+        useShowToast(
+          "success",
+          "Success",
+          "Connection to ServiceControl Monitoring service was successful at " +
+            monitoringUrl.value +
+            "."
+        );
+      }
+    }
+  });
+}
+
+export function useServiceControlStats() {
+  const failedHeartBeatsResult = getFailedHeartBeatsCount();
+  const failedMessagesResult = getFailedMessagesCount();
+  const failedCustomChecksResult = getFailedCustomChecksCount();
 
   return Promise.all([
     failedHeartBeatsResult,
@@ -86,19 +162,15 @@ export function useServiceControlStats(serviceControlUrl) {
       stats.number_of_failed_messages = failedM;
       stats.number_of_failed_checks = failedCC;
       stats.number_of_failed_heartbeats = failedHB;
-
-      isServiceControlConnecting.value = false;
     })
     .catch((err) => {
-      console.log(err)(err);
-      isServiceControlConnecting.value = false;
+      console.log(err);
     });
 }
 
-export function useServiceControlMonitoringStats(monitoringUrl) {
-  const monitoredEndpointsResult = getMonitoredEndpoints(monitoringUrl);
-  const disconnectedEndpointsCountResult =
-    getDisconnectedEndpointsCount(monitoringUrl);
+export function useServiceControlMonitoringStats() {
+  const monitoredEndpointsResult = getMonitoredEndpoints();
+  const disconnectedEndpointsCountResult = getDisconnectedEndpointsCount();
 
   return Promise.all([
     monitoredEndpointsResult,
@@ -106,14 +178,12 @@ export function useServiceControlMonitoringStats(monitoringUrl) {
   ]).then(([, disconnectedEndpoints]) => {
     //Do something here with the argument to the callback in the future if we are using them
     stats.number_of_disconnected_endpoints = disconnectedEndpoints;
-
-    isServiceControlMonitoringConnecting.value = false;
   });
 }
 
-export function useServiceControlConnections(serviceControlUrl, monitoringUrl) {
-  const scConnectionResult = getSCConnection(serviceControlUrl);
-  const monitoringConnectionResult = getMonitoringConnection(monitoringUrl);
+export function useServiceControlConnections() {
+  const scConnectionResult = getSCConnection();
+  const monitoringConnectionResult = getMonitoringConnection();
 
   return Promise.all([scConnectionResult, monitoringConnectionResult]).then(
     ([scConnection, mConnection]) => {
@@ -131,10 +201,33 @@ export function useServiceControlConnections(serviceControlUrl, monitoringUrl) {
   );
 }
 
-export function useServiceControlVersion(serviceControlUrl, monitoringUrl) {
+export function useServiceControlVersion() {
+  onMounted(() => {
+    getServiceControlVersion();
+    setInterval(() => getServiceControlVersion(), 60000);
+  });
+
+  watch(environment, async (newValue, oldValue) => {
+    if (newValue.is_compatible_with_sc != oldValue.is_compatible_with_sc) {
+      if (!newValue.is_compatible_with_sc) {
+        useShowToast(
+          "error",
+          "Error",
+          "You are using Service Control version " +
+            newValue.sc_version +
+            ". Please, upgrade to version " +
+            newValue.minimum_supported_sc_version.value +
+            " or higher to unlock new functionality in ServicePulse."
+        );
+      }
+    }
+  });
+}
+
+function getServiceControlVersion() {
   const productsResult = useServiceProductUrls();
-  const scResult = getSCVersion(serviceControlUrl);
-  const mResult = getMonitoringVersion(monitoringUrl);
+  const scResult = getSCVersion();
+  const mResult = getMonitoringVersion();
 
   return Promise.all([productsResult, scResult, mResult]).then(
     ([products, scVer]) => {
@@ -190,34 +283,36 @@ export function useServiceControlVersion(serviceControlUrl, monitoringUrl) {
   );
 }
 
-function getSCConnection(serviceControlUrl) {
-  return fetch(serviceControlUrl + "connection")
+function getSCConnection() {
+  return useFetchFromServiceControl("connection")
     .then((response) => {
       return response.json();
     })
     .catch(() => {
       connections.serviceControl.errors = [
-        "Error reaching ServiceControl at " + serviceControlUrl + "connection",
+        "Error reaching ServiceControl at " +
+          serviceControlUrl.value +
+          "connection",
       ];
       return {};
     });
 }
 
-function getMonitoringConnection(monitoringUrl) {
-  return fetch(monitoringUrl + "connection")
+function getMonitoringConnection() {
+  return useFetchFromMonitoring("connection")
     .then((response) => {
       return response.json();
     })
     .catch(() => {
       connections.monitoring.errors = [
-        "Error SC Monitoring instance at " + monitoringUrl + "connection",
+        "Error SC Monitoring instance at " + monitoringUrl.value + "connection",
       ];
       return {};
     });
 }
 
-function getSCVersion(serviceControlUrl) {
-  return fetch(serviceControlUrl)
+function getSCVersion() {
+  return useFetchFromServiceControl("")
     .then((response) => {
       environment.sc_version = response.headers.get("X-Particular-Version");
       return response.json();
@@ -227,8 +322,8 @@ function getSCVersion(serviceControlUrl) {
     });
 }
 
-function getMonitoringVersion(monitoringUrl) {
-  return fetch(monitoringUrl)
+function getMonitoringVersion() {
+  return useFetchFromMonitoring("")
     .then((response) => {
       environment.monitoring_version = response.headers.get(
         "X-Particular-Version"
@@ -240,80 +335,90 @@ function getMonitoringVersion(monitoringUrl) {
     });
 }
 
-function getFailedHeartBeatsCount(serviceControlUrl) {
-  return fetch(serviceControlUrl + "heartbeats/stats")
-    .then((response) => {
-      return response.json();
-    })
-    .then((json) => {
-      isServiceControlConnected.value = true;
-      serviceControlConnectedAtLeastOnce.value = true;
-      return parseInt(json.failing);
-    })
-    .catch((err) => {
-      isServiceControlConnected.value = false;
-      console.log(err);
-      return 0;
-      // return Math.floor(Math.random()*(10-0+1)+0)
-    });
+function fetchWithErrorHandling(fetchFunction, connectionState, action) {
+  if (connectionState.connecting) {
+    //Skip the connection state checking
+    return fetchFunction()
+      .then((response) => action(response))
+      .catch((err) => {
+        console.log(err);
+      });
+  }
+  try {
+    connectionState.connecting = true;
+    connectionState.connected = false;
+    return fetchFunction()
+      .then((response) => action(response))
+      .then((response) => {
+        connectionState.unableToConnect = false;
+        connectionState.connectedRecently = true;
+        connectionState.connected = true;
+        connectionState.connecting = false;
+        return response;
+      })
+      .catch((err) => {
+        connectionState.connected = false;
+        connectionState.unableToConnect = true;
+        connectionState.connectedRecently = false;
+        connectionState.connecting = false;
+        console.log(err);
+      });
+  } catch (err) {
+    connectionState.connecting = false;
+    connectionState.connected = false;
+  }
 }
 
-function getFailedMessagesCount(serviceControlUrl) {
-  return fetch(serviceControlUrl + "errors?status=unresolved")
-    .then((response) => {
-      isServiceControlConnected.value = true;
-      serviceControlConnectedAtLeastOnce.value = true;
-      return parseInt(response.headers.get("Total-Count"));
-    })
-    .catch((err) => {
-      isServiceControlConnected.value = false;
-      console.log(err);
-      return 0;
-      //return Math.floor(Math.random()*(10-0+1)+0)
-    });
+function getFailedHeartBeatsCount() {
+  return fetchWithErrorHandling(
+    () => useFetchFromServiceControl("heartbeats/stats"),
+    connectionState,
+    (response) => {
+      return response.json().then((data) => {
+        return parseInt(data.failing);
+      });
+    }
+  );
 }
 
-function getFailedCustomChecksCount(serviceControlUrl) {
-  return fetch(serviceControlUrl + "customchecks?status=fail")
-    .then((response) => {
-      isServiceControlConnected.value = true;
-      serviceControlConnectedAtLeastOnce.value = true;
-      return parseInt(response.headers.get("Total-Count"));
-    })
-    .catch((err) => {
-      isServiceControlConnected.value = false;
-      console.log(err);
-      return 0;
-      //return Math.floor(Math.random()*(10-0+1)+0)
-    });
+function getFailedMessagesCount() {
+  return fetchWithErrorHandling(
+    () => useFetchFromServiceControl("errors?status=unresolved"),
+    connectionState,
+    (response) => parseInt(response.headers.get("Total-Count"))
+  );
 }
 
-function getMonitoredEndpoints(monitoringUrl) {
-  return fetch(monitoringUrl + "monitored-endpoints?history=1")
-    .then((response) => {
-      return response.json();
-    })
-    .then((data) => {
-      isServiceControlMonitoringConnected.value = true;
-      return data;
-    })
-    .catch((err) => {
-      isServiceControlMonitoringConnected.value = false;
-      console.log(err);
-    });
+function getFailedCustomChecksCount() {
+  return fetchWithErrorHandling(
+    () => useFetchFromServiceControl("customchecks?status=fail"),
+    connectionState,
+    (response) => parseInt(response.headers.get("Total-Count"))
+  );
 }
 
-function getDisconnectedEndpointsCount(monitoringUrl) {
-  return fetch(monitoringUrl + "monitored-endpoints/disconnected")
-    .then((response) => {
-      return response.json();
-    })
-    .then((data) => {
-      isServiceControlMonitoringConnected.value = true;
-      return data;
-    })
-    .catch((err) => {
-      isServiceControlMonitoringConnected.value = false;
-      console.log(err);
-    });
+function getMonitoredEndpoints() {
+  return fetchWithErrorHandling(
+    () => useFetchFromMonitoring("monitored-endpoints?history=1"),
+    monitoringConnectionState,
+    (response) => {
+      if (response != null && response.ok) {
+        return response.json();
+      }
+      throw "Error connecting to monitoring";
+    }
+  );
+}
+
+function getDisconnectedEndpointsCount() {
+  return fetchWithErrorHandling(
+    () => useFetchFromMonitoring("monitored-endpoints/disconnected"),
+    monitoringConnectionState,
+    (response) => {
+      if (response != null && response.ok) {
+        return response.json();
+      }
+      throw "Error connecting to monitoring";
+    }
+  );
 }
diff --git a/src/ServicePulse.Host/vue/src/composables/serviceServiceControlUrls.js b/src/ServicePulse.Host/vue/src/composables/serviceServiceControlUrls.js
index 07c6e6918f..04f56e369b 100644
--- a/src/ServicePulse.Host/vue/src/composables/serviceServiceControlUrls.js
+++ b/src/ServicePulse.Host/vue/src/composables/serviceServiceControlUrls.js
@@ -1,7 +1,51 @@
 import { ref } from "vue";
 
-const serviceControlUrl = ref(null);
-const monitoringUrl = ref(null);
+export const serviceControlUrl = ref(null);
+export const monitoringUrl = ref(null);
+
+export function useFetchFromServiceControl(suffix) {
+  return fetch(serviceControlUrl.value + suffix);
+}
+
+export function useFetchFromMonitoring(suffix) {
+  if (
+    monitoringUrl.value === null ||
+    monitoringUrl.value === "" ||
+    monitoringUrl.value === "!"
+  ) {
+    return Promise.resolve(null);
+  }
+  return fetch(monitoringUrl.value + suffix);
+}
+
+export function usePostToServiceControl(suffix, payload) {
+  const requestOptions = {
+    method: "POST",
+  };
+  if (payload !== undefined) {
+    requestOptions.headers = { "Content-Type": "application/json" };
+    requestOptions.body = JSON.stringify(payload);
+  }
+  return fetch(serviceControlUrl.value + suffix, requestOptions);
+}
+
+export function usePutToServiceControl(suffix, payload) {
+  const requestOptions = {
+    method: "PUT",
+  };
+  if (payload !== undefined) {
+    requestOptions.headers = { "Content-Type": "application/json" };
+    requestOptions.body = JSON.stringify(payload);
+  }
+  return fetch(serviceControlUrl.value + suffix, requestOptions);
+}
+
+export function useDeleteFromServiceControl(suffix) {
+  const requestOptions = {
+    method: "DELETE",
+  };
+  return fetch(serviceControlUrl.value + suffix, requestOptions);
+}
 
 export function useServiceControlUrls() {
   const params = getParams();
@@ -56,7 +100,6 @@ export function useServiceControlUrls() {
 }
 
 export function updateServiceControlUrls(
-  route,
   newServiceControlUrl,
   newMonitoringUrl
 ) {
diff --git a/src/ServicePulse.Host/vue/src/router/index.js b/src/ServicePulse.Host/vue/src/router/index.js
index 54fe774211..d39a0f6910 100644
--- a/src/ServicePulse.Host/vue/src/router/index.js
+++ b/src/ServicePulse.Host/vue/src/router/index.js
@@ -8,6 +8,9 @@ const router = createRouter({
       path: "/dashboard",
       name: "dashboard",
       component: DashboardView,
+      meta: {
+        title: "Dashboard • ServicePulse",
+      },
     },
     {
       path: "/",
@@ -20,9 +23,17 @@ const router = createRouter({
       // this generates a separate chunk (About.[hash].js) for this route
       // which is lazy-loaded when the route is visited.
       component: () => import("../views/ConfigurationView.vue"),
+      meta: {
+        title: "Configuration • ServicePulse",
+      },
     },
   ],
   strict: false,
 });
 
+router.beforeEach((to, from, next) => {
+  document.title = to.meta.title || "ServicePulse";
+  next();
+});
+
 export default router;
diff --git a/src/ServicePulse.Host/vue/src/views/ConfigurationView.vue b/src/ServicePulse.Host/vue/src/views/ConfigurationView.vue
index c753ac2e49..2ad71cdb00 100644
--- a/src/ServicePulse.Host/vue/src/views/ConfigurationView.vue
+++ b/src/ServicePulse.Host/vue/src/views/ConfigurationView.vue
@@ -1,38 +1,32 @@
 <script setup>
-import { ref, computed, inject, watch, onMounted } from "vue";
+import { ref, computed, watch, onMounted } from "vue";
 import PlatformConnections from "../components/configuration/PlatformConnections.vue";
 import PlatformLicense from "../components/configuration/PlatformLicense.vue";
 import EndpointConnection from "../components/configuration/EndpointConnection.vue";
 import HealthCheckNotifications from "../components/configuration/HealthCheckNotifications.vue";
 import RetryRedirects from "../components/configuration/RetryRedirects.vue";
+import { licenseStatus } from "../composables/serviceLicense.js";
 import {
-  useLicenseWarningLevel,
-  useLicenseStatus,
-} from "../composables/serviceLicense.js";
+  connectionState,
+  monitoringConnectionState,
+} from "../composables/serviceServiceControl";
 import ExclamationMark from "../components/ExclamationMark.vue";
-import {
-  key_UnableToConnectToServiceControl,
-  key_UnableToConnectToMonitoring,
-  key_IsSCConnected,
-  key_ScConnectedAtLeastOnce,
-  key_License,
-} from "./../composables/keys.js";
-
-const unableToConnectToServiceControl = inject(
-  key_UnableToConnectToServiceControl
-);
-const unableToConnectToMonitoring = inject(key_UnableToConnectToMonitoring);
-const isSCConnected = inject(key_IsSCConnected);
-const scConnectedAtLeastOnce = inject(key_ScConnectedAtLeastOnce);
-const pLicense = inject(key_License);
-const isExpired = ref(useLicenseStatus.isExpired);
 
 const routes = {
-  license: PlatformLicense,
-  "health-check-notifications": HealthCheckNotifications,
-  "retry-redirects": RetryRedirects,
-  connections: PlatformConnections,
-  "endpoint-connection": EndpointConnection,
+  license: { component: PlatformLicense, title: "License" },
+  "health-check-notifications": {
+    component: HealthCheckNotifications,
+    title: "Health Check Notifications",
+  },
+  "retry-redirects": { component: RetryRedirects, title: "Retry Redirects" },
+  connections: {
+    component: PlatformConnections,
+    title: "Platform Connections",
+  },
+  "endpoint-connection": {
+    component: EndpointConnection,
+    title: "Endpoint Connetion",
+  },
 };
 
 const currentPath = ref(window.location.hash);
@@ -52,12 +46,19 @@ function subIsActive(subPath) {
 }
 
 const currentView = computed(() => {
-  return routes[currentPath.value.slice(1) || "/"] || PlatformLicense;
+  return routes[currentPath.value.slice(1) || "/"]
+    ? routes[currentPath.value.slice(1) || "/"].component
+    : PlatformLicense;
 });
 
 const currentEvents = ref({});
 watch(currentPath, async (newValue) => {
   setupEvents(newValue);
+  if (routes[currentPath.value.slice(1) || "/"]) {
+    document.title =
+      routes[currentPath.value.slice(1) || "/"].title +
+      " - Configuration • ServicePulse";
+  }
 });
 
 function setupEvents(newPath) {
@@ -69,6 +70,14 @@ function setupEvents(newPath) {
 }
 
 onMounted(() => {
+  const path = currentPath.value.slice(1) || "/";
+  if (
+    path === "/" &&
+    !connectionState.connected &&
+    !connectionState.connectedRecently
+  ) {
+    window.location.hash = "connections";
+  }
   setupEvents(currentPath.value);
 });
 </script>
@@ -86,28 +95,32 @@ onMounted(() => {
           <h5
             :class="{
               active: subIsActive('#license') || subIsActive(''),
-              disabled: !isSCConnected && !scConnectedAtLeastOnce,
+              disabled:
+                !connectionState.connected &&
+                !connectionState.connectedRecently,
             }"
           >
             <a href="#license">License</a>
-            <exclamation-mark
-              :type="useLicenseWarningLevel(pLicense.license_status)"
-            />
+            <exclamation-mark :type="licenseStatus.warningLevel" />
           </h5>
           <h5
-            v-if="!isExpired"
+            v-if="!licenseStatus.isExpired"
             :class="{
               active: subIsActive('#health-check-notifications'),
-              disabled: !isSCConnected && !scConnectedAtLeastOnce,
+              disabled:
+                !connectionState.connected &&
+                !connectionState.connectedRecently,
             }"
           >
             <a href="#health-check-notifications">Health Check Notifications</a>
           </h5>
           <h5
-            v-if="!isExpired"
+            v-if="!licenseStatus.isExpired"
             :class="{
               active: subIsActive('#retry-redirects'),
-              disabled: !isSCConnected && !scConnectedAtLeastOnce,
+              disabled:
+                !connectionState.connected &&
+                !connectionState.connectedRecently,
             }"
           >
             <a href="#retry-redirects"
@@ -115,14 +128,15 @@ onMounted(() => {
             </a>
           </h5>
           <h5
-            v-if="!isExpired"
+            v-if="!licenseStatus.isExpired"
             :class="{ active: subIsActive('#connections') }"
           >
             <a href="#connections">
               Connections
               <template
                 v-if="
-                  unableToConnectToServiceControl || unableToConnectToMonitoring
+                  connectionState.unableToConnect ||
+                  monitoringConnectionState.unableToConnect
                 "
               >
                 <span><i class="fa fa-exclamation-triangle"></i></span>
@@ -130,10 +144,12 @@ onMounted(() => {
             </a>
           </h5>
           <h5
-            v-if="!isExpired"
+            v-if="!licenseStatus.isExpired"
             :class="{
               active: subIsActive('#endpoint-connection'),
-              disabled: !isSCConnected && !scConnectedAtLeastOnce,
+              disabled:
+                !connectionState.connected &&
+                !connectionState.connectedRecently,
             }"
           >
             <a href="#endpoint-connection">Endpoint Connection</a>
diff --git a/src/ServicePulse.Host/vue/src/views/DashboardView.vue b/src/ServicePulse.Host/vue/src/views/DashboardView.vue
index ddfe0a300e..7e40745f1c 100644
--- a/src/ServicePulse.Host/vue/src/views/DashboardView.vue
+++ b/src/ServicePulse.Host/vue/src/views/DashboardView.vue
@@ -1,35 +1,19 @@
 <script setup>
-import { inject, ref } from "vue";
 import DashboardItem from "../components/DashboardItem.vue";
 import EventItemShort from "../components/EventItemShort.vue";
 import LicenseExpired from "../components/LicenseExpired.vue";
 import ServiceControlNotAvailable from "../components/ServiceControlNotAvailable.vue";
-import {
-  key_IsSCConnected,
-  key_ScConnectedAtLeastOnce,
-  key_IsSCConnecting,
-} from "../composables/keys.js";
-import { stats } from "./../composables/serviceServiceControl.js";
-import { useLicenseStatus } from "./../composables/serviceLicense.js";
-
-const isExpired = ref(useLicenseStatus.isExpired);
-const isSCConnected = inject(key_IsSCConnected);
-const scConnectedAtLeastOnce = inject(key_ScConnectedAtLeastOnce);
-const isSCConnecting = inject(key_IsSCConnecting);
+import { connectionState, stats } from "../composables/serviceServiceControl";
+import { licenseStatus } from "./../composables/serviceLicense.js";
 </script>
 
 <template>
   <LicenseExpired />
-  <template v-if="!isExpired">
+  <template v-if="!licenseStatus.isExpired">
     <div class="container">
-      <div class="sp-loader" v-if="isSCConnecting"></div>
-      <ServiceControlNotAvailable
-        :isSCConnected="isSCConnected"
-        :isSCConnecting="isSCConnecting"
-        :scConnectedAtLeastOnce="scConnectedAtLeastOnce"
-      />
+      <ServiceControlNotAvailable />
 
-      <template v-if="isSCConnected || scConnectedAtLeastOnce">
+      <template v-if="connectionState.connected">
         <div class="row">
           <div class="col-sm-12">
             <h1>Dashboard</h1>
@@ -67,8 +51,8 @@ const isSCConnecting = inject(key_IsSCConnecting);
                     >
                   </div>
                 </div>
-              </div>              
-            </div>            
+              </div>
+            </div>
           </div>
           <EventItemShort></EventItemShort>
         </div>