handle events in SequenceDiagram

Author: PhilBastian

src/Frontend/src/components/messages/SequenceDiagram/HandlersComponent.vue

@@ -48,6 +48,7 @@ const handlerItems = computed(() => {
 
     return {
       id: handler.id,
+      endpointName: handler.endpoint.name,
       incomingId: handler.route?.name,
       left: (endpoint?.centre ?? 0) - Handler_Width / 2,
       right: (endpoint?.centre ?? 0) + Handler_Width / 2,
@@ -63,7 +64,7 @@ const handlerItems = computed(() => {
   });
 
   store.setMaxHeight(nextY);
-  store.setHandlerLocations(result.map((handler) => ({ id: handler.id, left: handler.left, right: handler.right, y: handler.y, height: handler.height })));
+  store.setHandlerLocations(result.map((handler) => ({ id: handler.id, endpointName: handler.endpointName, left: handler.left, right: handler.right, y: handler.y, height: handler.height })));
 
   return result;
 });

src/Frontend/src/components/messages/SequenceDiagram/RoutesComponent.vue

@@ -17,15 +17,15 @@ const arrows = computed(() =>
     if (!route.name) return;
     const fromHandler = route.fromRoutedMessage?.fromHandler;
     if (!fromHandler) return;
-    const fromHandlerLocation = handlerLocations.value.find((hl) => hl.id === fromHandler.id);
+    const fromHandlerLocation = handlerLocations.value.find((hl) => hl.id === fromHandler.id && hl.endpointName === fromHandler.endpoint.name);
     if (!fromHandlerLocation) return;
-    const toHandlerLocation = handlerLocations.value.find((hl) => hl.id === route.fromRoutedMessage?.toHandler?.id);
+    const toHandlerLocation = handlerLocations.value.find((hl) => hl.id === route.fromRoutedMessage?.toHandler?.id && hl.endpointName === route.fromRoutedMessage?.receiving.name);
     if (!toHandlerLocation) return;
 
     const messageTypeElement = messageTypeRefs.value[index];
     const messageTypeElementBounds = messageTypeElement?.getBBox();
     //TODO: is messageId enough to uniquely identify?
-    const arrowIndex = fromHandler.outMessages.findIndex((out) => route.fromRoutedMessage?.messageId === out.messageId) + 1;
+    const arrowIndex = fromHandler.outMessages.findIndex((out) => route.fromRoutedMessage?.messageId === out.messageId && route.fromRoutedMessage?.receiving.name === out.receiving.name) + 1;
     const y = fromHandlerLocation.y + (fromHandlerLocation.height / (fromHandler.outMessages.length + 1)) * arrowIndex; //TODO work out the reason - 15 is applied in WPF;
 
     const toHandlerCentre = toHandlerLocation.left + (toHandlerLocation.right - toHandlerLocation.left) / 2;

src/Frontend/src/resources/SequenceDiagram/RoutedMessage.ts

@@ -66,7 +66,7 @@ class MessageProcessingRouteItem implements MessageProcessingRoute {
     this.processingHandler = processingHandler;
 
     if (routedMessage && this.processingHandler) {
-      this.name = `${processingHandler?.name}(${routedMessage.messageId})`;
+      this.name = `${processingHandler?.name}(${routedMessage.messageId}###${routedMessage.receiving.name}})`;
     }
 
     if (routedMessage) routedMessage.route = this;

src/Frontend/src/stores/SequenceDiagramStore.ts

@@ -15,6 +15,7 @@ export interface EndpointCentrePoint {
 
 export interface HandlerLocation {
   id: string;
+  endpointName: string;
   left: number;
   right: number;
   y: number;