Merge pull request #252 from ditrit/bugfix/reverse_link

Bugfix: reverse link display

changelog.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html)
 
+## [Unreleased]
+
+### Fixed
+
+- Reverse link display management.
+
 ## [0.24.0] - 2024/06/12
 
 ### Added

src/draw/render/LinkRenderer.js

@@ -56,8 +56,11 @@ class LinkRenderer {
             y: link.endY,
           };
         } else {
-          sourceAnchor = this.getClosestAnchor(link.source, link.target);
-          targetAnchor = this.getClosestAnchor(link.target, link.source);
+          const source = link.isReverse ? link.target : link.source;
+          const target = link.isReverse ? link.source : link.target;
+
+          sourceAnchor = this.getClosestAnchor(source, target);
+          targetAnchor = this.getClosestAnchor(target, source);
         }
 
         return renderString(

src/models/ComponentLink.js

@@ -12,19 +12,23 @@ class ComponentLink extends FileInformation {
    * @param {string} [props.target] - Id of component can be the target of the link.
    * @param {string} [props.name] - Name of the link anchor, link to store where the link begin.
    * @param {ComponentLinkDefinition} [props.definition] - The definition of the link.
+   * @param {boolean} [props.isReverse] - Indicate if this link is a reverse link.
+   * The purpose of reversing a Link is to switch the start and the end of the link.
    */
   constructor(props = {
     source: null,
     target: null,
     name: null,
     definition: null,
+    isReverse: false,
   }) {
     super();
     const {
       source,
       target,
       name,
       definition,
+      isReverse,
     } = props;
 
     /**
@@ -53,6 +57,12 @@ class ComponentLink extends FileInformation {
      * @type {ComponentLinkDefinition}
      */
     this.definition = definition || null;
+    /**
+     * Indicate if this link is a reverse link.
+     * The purpose of reversing a Link is to switch the start and the end of the link.
+     * @type {boolean}
+     */
+    this.isReverse = !!isReverse;
   }
 }
 

src/models/DefaultData.js

@@ -300,6 +300,7 @@ class DefaultData {
           definition,
           source: component.id,
           target: value,
+          isReverse: attribute.definition.linkType === 'Reverse',
         })));
       });
     });

tests/unit/models/ComponentLink.spec.js

@@ -10,6 +10,7 @@ describe('Test class: ComponentLink', () => {
       expect(link.target).toBeNull();
       expect(link.name).toBeNull();
       expect(link.definition).toBeNull();
+      expect(link.isReverse).toEqual(false);
     });
 
     it('Check passing undefined variables to constructor', () => {
@@ -20,6 +21,7 @@ describe('Test class: ComponentLink', () => {
       expect(link.target).toBeNull();
       expect(link.name).toBeNull();
       expect(link.definition).toBeNull();
+      expect(link.isReverse).toEqual(false);
     });
 
     it('Check passing variable to constructor', () => {
@@ -28,13 +30,15 @@ describe('Test class: ComponentLink', () => {
         target: 'target',
         name: 'name',
         definition: {},
+        isReverse: true,
       });
 
       expect(link.__class).toEqual('Link');
       expect(link.source).toEqual('source');
       expect(link.target).toEqual('target');
       expect(link.name).toEqual('name');
       expect(link.definition).toBeDefined();
+      expect(link.isReverse).toEqual(true);
     });
   });
 });

tests/unit/models/DefaultData.spec.js

@@ -476,6 +476,7 @@ describe('Test class: DefaultData', () => {
           definition: pluginData.definitions.links[1],
           source: 'server2',
           target: 'server1',
+          isReverse: true,
         }),
         new ComponentLink({
           definition: pluginData.definitions.links[2],