Modify delivery delay parser to include days and remove unused message url link (#2378)

Author: soujay

src/Frontend/src/components/messages2/SagaDiagram.spec.ts

@@ -77,35 +77,6 @@ describe("Feature: Detecting no Audited Saga Data Available", () => {
 });
 
 describe("Feature: Navigation and Contextual Information", () => {
-  describe("Rule: Provide clear navigational elements to move between the message flow diagram and the saga view.", () => {
-    test("EXAMPLE: A message record with id '123' and with a saga Id '88878' gets selected", () => {
-      //A "← Back to Messages" link allows users to easily navigate back to the flow diagram.
-      const storedMessageRecordId = "123";
-      const message_id = "456";
-
-      const messageStore = {} as MessageStore;
-      messageStore.state = {} as MessageStore["state"];
-      messageStore.state.data = {} as MessageStore["state"]["data"];
-      messageStore.state.data.message_id = message_id;
-      messageStore.state.data.id = storedMessageRecordId;
-      messageStore.state.data.invoked_saga = {
-        has_saga: true,
-        saga_id: "saga-id-123",
-        saga_type: "Shipping.ShipOrderWorkflow",
-      };
-
-      // Set initial state with sample saga history
-      const componentDriver = rendercomponent({
-        initialState: {
-          MessageStore: messageStore,
-          SagaDiagramStore: { sagaHistory: sampleSagaHistory },
-        },
-      });
-
-      componentDriver.assert.linkIsShown({ withText: "← Back to Messages", withHref: `#/messages/${message_id}/${storedMessageRecordId}` });
-    });
-  });
-
   describe("Rule: Clearly indicate contextual information like Saga ID and Saga Type.", () => {
     test("EXAMPLE: A message with a Saga Id '123' and a Saga Type 'ServiceControl.SmokeTest.AuditingSaga' gets selected", () => {
       const messageStore = {} as MessageStore;

src/Frontend/src/components/messages2/SagaDiagram.vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { computed, onUnmounted, watch } from "vue";
-import routeLinks from "@/router/routeLinks";
 import { useSagaDiagramStore } from "@/stores/SagaDiagramStore";
 import { useMessageStore } from "@/stores/MessageStore";
 import { storeToRefs } from "pinia";
@@ -50,9 +49,6 @@ const vm = computed<SagaViewModel>(() => {
     SagaTitle: typeToName(saga.saga_type) || "Unknown saga",
     SagaGuid: saga.saga_id || "Missing guid",
 
-    // Navigation
-    MessageIdUrl: routeLinks.messages.successMessage.link(data.message_id || "", data.id || ""),
-
     // Status flags
     ParticipatedInSaga: saga.has_saga || false,
     HasSagaData: !!sagaHistory,
@@ -89,7 +85,7 @@ const vm = computed<SagaViewModel>(() => {
     <div v-else-if="vm.HasSagaData" role="table" aria-label="saga-sequence-list" class="body" style="display: flex">
       <div class="container">
         <!-- Saga header with title and navigation -->
-        <SagaHeader :saga-title="vm.SagaTitle" :saga-guid="vm.SagaGuid" :message-id-url="vm.MessageIdUrl" />
+        <SagaHeader :saga-title="vm.SagaTitle" :saga-guid="vm.SagaGuid" />
 
         <!-- Iterate through each saga update -->
         <SagaUpdateNode v-for="(update, index) in vm.SagaUpdates" :key="index" :update="update" :show-message-data="vm.ShowMessageData" />

src/Frontend/src/components/messages2/SagaDiagram/SagaDiagramParser.ts

@@ -44,7 +44,6 @@ export interface SagaUpdateViewModel {
 export interface SagaViewModel {
   SagaTitle: string;
   SagaGuid: string;
-  MessageIdUrl: string;
   ParticipatedInSaga: boolean;
   HasSagaData: boolean;
   ShowNoPluginActiveLegend: boolean;

src/Frontend/src/components/messages2/SagaDiagram/SagaHeader.vue

@@ -1,10 +1,7 @@
 <script setup lang="ts">
-import { RouterLink } from "vue-router";
-
 defineProps<{
   sagaTitle: string;
   sagaGuid: string;
-  messageIdUrl: string;
 }>();
 </script>
 
@@ -13,7 +10,6 @@ defineProps<{
     <div class="row row--center">
       <div class="cell cell--center">
         <div class="cell-inner cell-inner-center">
-          <RouterLink :to="messageIdUrl">← Back to Messages</RouterLink>
           <h1 aria-label="saga name" class="main-title">{{ sagaTitle }}</h1>
           <div>
             <b>guid</b> <span role="note" aria-label="saga guid">{{ sagaGuid }}</span>

src/Frontend/src/composables/deliveryDelayParser.ts

@@ -1,14 +1,24 @@
-export function parseDeliveryDelay(delay: string): { hours: number; minutes: number; seconds: number } {
-  const [hours, minutes, seconds] = delay.split(":").map(Number);
-  return { hours, minutes, seconds };
+export function parseDeliveryDelay(delay: string): { days: number; hours: number; minutes: number; seconds: number } {
+  // Split on period first to handle multi-digit days
+  const parts = delay.split(".");
+  let days = 0;
+  let timeComponent = delay;
+
+  if (parts.length > 1) {
+    days = parseInt(parts[0], 10);
+    timeComponent = parts[1];
+  }
+
+  const [hours, minutes, seconds] = timeComponent.split(":").map(Number);
+  return { days, hours, minutes, seconds };
 }
 
 function getFriendly(time: number, text: string): string {
   return time > 0 ? `${time}${text}` : "";
 }
 
 export function getTimeoutFriendly(delivery_delay: string): string {
-  const { hours, minutes, seconds } = parseDeliveryDelay(delivery_delay);
+  const { days, hours, minutes, seconds } = parseDeliveryDelay(delivery_delay);
 
-  return `${getFriendly(hours, "h")}${getFriendly(minutes, "m")}${getFriendly(seconds, "s")}`;
+  return `${getFriendly(days, "d")}${getFriendly(hours, "h")}${getFriendly(minutes, "m")}${getFriendly(seconds, "s")}`;
 }