Skip to content

Commit 2ac7595

Browse files
committed
update store internal name to be SagaDiagramStore
a a
1 parent 5a1dc38 commit 2ac7595

File tree

3 files changed

+75
-65
lines changed

3 files changed

+75
-65
lines changed

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

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ describe("Feature: Message not involved in Saga", () => {
3939
const componentDriver = rendercomponent({
4040
initialState: {
4141
MessageStore: messageStore,
42-
sagaHistory: undefined, // Lets pass undefined to simulate no saga data available
42+
SagaDiagramStore: undefined, // Lets pass undefined to simulate no saga data available
4343
},
4444
});
4545

@@ -64,7 +64,7 @@ describe("Feature: Detecting no Audited Saga Data Available", () => {
6464
const componentDriver = rendercomponent({
6565
initialState: {
6666
MessageStore: messageStore,
67-
sagaHistory: undefined, // Lets pass undefined to simulate no saga data available
67+
SagaDiagramStore: undefined, // Lets pass undefined to simulate no saga data available
6868
},
6969
});
7070

@@ -98,7 +98,7 @@ describe("Feature: Navigation and Contextual Information", () => {
9898
const componentDriver = rendercomponent({
9999
initialState: {
100100
MessageStore: messageStore,
101-
sagaHistory: { sagaHistory: sampleSagaHistory },
101+
SagaDiagramStore: { sagaHistory: sampleSagaHistory },
102102
},
103103
});
104104

@@ -121,7 +121,7 @@ describe("Feature: Navigation and Contextual Information", () => {
121121
const componentDriver = rendercomponent({
122122
initialState: {
123123
MessageStore: messageStore,
124-
sagaHistory: { sagaHistory: sampleSagaHistory },
124+
SagaDiagramStore: { sagaHistory: sampleSagaHistory },
125125
},
126126
});
127127

@@ -182,7 +182,7 @@ describe("Feature: 3 Visual Representation of Saga Timeline", () => {
182182
const componentDriver = rendercomponent({
183183
initialState: {
184184
MessageStore: messageStore,
185-
sagaHistory: { sagaHistory: sampleSagaHistory },
185+
SagaDiagramStore: { sagaHistory: sampleSagaHistory },
186186
},
187187
});
188188

@@ -248,7 +248,7 @@ describe("Feature: 3 Visual Representation of Saga Timeline", () => {
248248
const componentDriver = rendercomponent({
249249
initialState: {
250250
MessageStore: messageStore,
251-
sagaHistory: { sagaHistory: sampleSagaHistory },
251+
SagaDiagramStore: { sagaHistory: sampleSagaHistory },
252252
},
253253
});
254254

@@ -272,7 +272,7 @@ describe("Feature: 3 Visual Representation of Saga Timeline", () => {
272272
});
273273
});
274274

275-
function rendercomponent({ initialState = {} }: { initialState?: { MessageStore?: MessageStore; sagaHistory?: { sagaHistory: SagaHistory } } }): componentDSL {
275+
function rendercomponent({ initialState = {} }: { initialState?: { MessageStore?: MessageStore; SagaDiagramStore?: { sagaHistory: SagaHistory } } }): componentDSL {
276276
const router = makeRouter();
277277

278278
// Render with createTestingPinia

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

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup lang="ts">
2-
import { computed, onUnmounted } from "vue";
2+
import { computed, onUnmounted, watch } from "vue";
33
import routeLinks from "@/router/routeLinks";
44
import { useSagaDiagramStore } from "@/stores/SagaDiagramStore";
55
import { useMessageStore } from "@/stores/MessageStore";
@@ -20,6 +20,19 @@ const { showMessageData } = storeToRefs(sagaDiagramStore);
2020
2121
const messageStore = useMessageStore();
2222
23+
watch(
24+
() => messageStore.state.data.invoked_saga?.has_saga,
25+
(hasSaga) => {
26+
const saga = messageStore.state.data.invoked_saga;
27+
if (hasSaga && saga?.saga_id) {
28+
sagaDiagramStore.setSagaId(saga.saga_id);
29+
} else {
30+
sagaDiagramStore.clearSagaHistory();
31+
}
32+
},
33+
{ immediate: true }
34+
);
35+
2336
onUnmounted(() => {
2437
sagaDiagramStore.clearSagaHistory();
2538
});

src/Frontend/src/stores/SagaDiagramStore.ts

Lines changed: 54 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { ref, watch } from "vue";
33
import { SagaHistory, SagaMessage } from "@/resources/SagaHistory";
44
import { useFetchFromServiceControl } from "@/composables/serviceServiceControlUrls";
55
import Message from "@/resources/Message";
6-
import { useMessageStore } from "@/stores/MessageStore";
6+
77
const StandardKeys = ["$type", "Id", "Originator", "OriginalMessageId"];
88
export interface SagaMessageDataItem {
99
key: string;
@@ -13,7 +13,7 @@ export interface SagaMessageData {
1313
message_id: string;
1414
data: SagaMessageDataItem[];
1515
}
16-
export const useSagaDiagramStore = defineStore("sagaHistory", () => {
16+
export const useSagaDiagramStore = defineStore("SagaDiagramStore", () => {
1717
const sagaHistory = ref<SagaHistory | null>(null);
1818
const sagaId = ref<string | null>(null);
1919
const loading = ref(false);
@@ -23,63 +23,17 @@ export const useSagaDiagramStore = defineStore("sagaHistory", () => {
2323
const messagesData = ref<SagaMessageData[]>([]);
2424
const MessageBodyEndpoint = "messages/{0}/body";
2525

26-
const messageStore = useMessageStore();
26+
// Watch the sagaId and trigger fetches when it changes
27+
watch(sagaId, async (newSagaId) => {
28+
if (newSagaId) {
29+
await fetchSagaHistory(newSagaId);
2730

28-
//Watch for changes to messageStore.state.data.invoked_saga.has_saga
29-
watch(
30-
() => messageStore.state.data.invoked_saga.has_saga,
31-
async (newValue) => {
32-
if (newValue) {
33-
sagaId.value = messageStore.state.data.invoked_saga.saga_id || "";
34-
await fetchSagaHistory(sagaId.value);
35-
} else {
36-
clearSagaHistory();
31+
// If saga history was successfully fetched, fetch message data
32+
if (sagaHistory.value) {
33+
await fetchMessagesData(sagaHistory.value);
3734
}
38-
},
39-
{ immediate: true }
40-
);
41-
42-
// Watch for changes to showMessageData
43-
watch([showMessageData, sagaHistory], async ([show, history]) => {
44-
if (show && history) {
45-
// Get all messages from changes array - both initiating and outgoing
46-
const messagesToFetch = history.changes.flatMap((change) => {
47-
const messages: SagaMessage[] = [];
48-
49-
// Add initiating message if it exists and hasn't been fetched
50-
if (change.initiating_message && !fetchedMessages.value.has(change.initiating_message.message_id)) {
51-
messages.push(change.initiating_message);
52-
}
53-
54-
// Add all unfetched outgoing messages
55-
if (change.outgoing_messages) {
56-
messages.push(...change.outgoing_messages.filter((msg) => !fetchedMessages.value.has(msg.message_id)));
57-
}
58-
return messages;
59-
});
60-
61-
// Check if any messages need body_url
62-
const needsBodyUrl = messagesToFetch.every((msg) => !msg.body_url);
63-
if (needsBodyUrl && messagesToFetch.length > 0) {
64-
const auditMessages = await getAuditMessages(sagaId.value!);
65-
messagesToFetch.forEach((message) => {
66-
const auditMessage = auditMessages.find((x: Message) => x.message_id === message.message_id);
67-
if (auditMessage) {
68-
message.body_url = auditMessage.body_url;
69-
}
70-
});
71-
}
72-
73-
// Fetch data for each unfetched message in parallel and store results
74-
const fetchPromises = messagesToFetch.map(async (message) => {
75-
const data = await fetchSagaMessageData(message);
76-
fetchedMessages.value.add(message.message_id);
77-
return data;
78-
});
79-
80-
const newMessageData = await Promise.all(fetchPromises);
81-
// Add new message data to the existing array
82-
messagesData.value = [...messagesData.value, ...newMessageData];
35+
} else {
36+
clearSagaHistory();
8337
}
8438
});
8539

@@ -114,12 +68,14 @@ export const useSagaDiagramStore = defineStore("sagaHistory", () => {
11468
loading.value = false;
11569
}
11670
}
71+
11772
function createEmptyMessageData(message_id: string): SagaMessageData {
11873
return {
11974
message_id,
12075
data: [],
12176
};
12277
}
78+
12379
async function fetchSagaMessageData(message: SagaMessage): Promise<SagaMessageData> {
12480
const bodyUrl = (message.body_url ?? formatUrl(MessageBodyEndpoint, message.message_id)).replace(/^\//, "");
12581
loading.value = true;
@@ -244,6 +200,47 @@ export const useSagaDiagramStore = defineStore("sagaHistory", () => {
244200
showMessageData.value = !showMessageData.value;
245201
}
246202

203+
async function fetchMessagesData(history: SagaHistory) {
204+
// Get all messages from changes array - both initiating and outgoing
205+
const messagesToFetch = history.changes.flatMap((change) => {
206+
const messages: SagaMessage[] = [];
207+
208+
// Add initiating message if it exists and hasn't been fetched
209+
if (change.initiating_message && !fetchedMessages.value.has(change.initiating_message.message_id)) {
210+
messages.push(change.initiating_message);
211+
}
212+
213+
// Add all unfetched outgoing messages
214+
if (change.outgoing_messages) {
215+
messages.push(...change.outgoing_messages.filter((msg) => !fetchedMessages.value.has(msg.message_id)));
216+
}
217+
return messages;
218+
});
219+
220+
// Check if any messages need body_url
221+
const needsBodyUrl = messagesToFetch.every((msg) => !msg.body_url);
222+
if (needsBodyUrl && messagesToFetch.length > 0) {
223+
const auditMessages = await getAuditMessages(sagaId.value!);
224+
messagesToFetch.forEach((message) => {
225+
const auditMessage = auditMessages.find((x: Message) => x.message_id === message.message_id);
226+
if (auditMessage) {
227+
message.body_url = auditMessage.body_url;
228+
}
229+
});
230+
}
231+
232+
// Fetch data for each unfetched message in parallel and store results
233+
const fetchPromises = messagesToFetch.map(async (message) => {
234+
const data = await fetchSagaMessageData(message);
235+
fetchedMessages.value.add(message.message_id);
236+
return data;
237+
});
238+
239+
const newMessageData = await Promise.all(fetchPromises);
240+
// Add new message data to the existing array
241+
messagesData.value = [...messagesData.value, ...newMessageData];
242+
}
243+
247244
return {
248245
sagaHistory,
249246
sagaId,

0 commit comments

Comments
 (0)