From e83aa75a922d6bd6ec6d612960f3452b7d9c927f Mon Sep 17 00:00:00 2001
From: Jette Petzold <jep@informatik.uni-kiel.de>
Date: Thu, 28 Nov 2024 17:01:14 +0100
Subject: [PATCH 1/2] fixing elk bug by setting size for ports and rendering
 them

---
 .../src-language-server/stpa/diagram/diagram-elements.ts   | 1 +
 extension/src-webview/css/diagram.css                      | 4 ++++
 extension/src-webview/stpa/stpa-views.tsx                  | 3 ++-
 extension/src-webview/views-rendering.tsx                  | 7 +++++++
 4 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/extension/src-language-server/stpa/diagram/diagram-elements.ts b/extension/src-language-server/stpa/diagram/diagram-elements.ts
index cf8d7922..d81e3510 100644
--- a/extension/src-language-server/stpa/diagram/diagram-elements.ts
+++ b/extension/src-language-server/stpa/diagram/diagram-elements.ts
@@ -77,6 +77,7 @@ export function createPort(id: string, side: PortSide, assocEdge?: { node1: stri
         type: PORT_TYPE,
         id: id,
         side: side,
+        size: {width: 1, height: 1},
         associatedEdge: assocEdge,
     };
 }
diff --git a/extension/src-webview/css/diagram.css b/extension/src-webview/css/diagram.css
index ab4f78df..06e8fac6 100644
--- a/extension/src-webview/css/diagram.css
+++ b/extension/src-webview/css/diagram.css
@@ -27,6 +27,10 @@
     font-weight: bold;
 }
 
+.pasta-hidden {
+    opacity: 0;
+}
+
 /* sprotty and black/white colors */
 .vscode-high-contrast .print-node {
     fill: black;
diff --git a/extension/src-webview/stpa/stpa-views.tsx b/extension/src-webview/stpa/stpa-views.tsx
index f069406b..f3bb51b3 100644
--- a/extension/src-webview/stpa/stpa-views.tsx
+++ b/extension/src-webview/stpa/stpa-views.tsx
@@ -260,7 +260,8 @@ export class STPAGraphView extends SGraphView {
 @injectable()
 export class PortView implements IView {
     render(model: SPort, context: RenderingContext): VNode {
-        return <g />;
+        const port = <g>{renderPort(model.position.x, model.position.y, model.size.width, model.size.height)}</g>;
+        return <g class-pasta-hidden>{port}</g>;
     }
 }
 
diff --git a/extension/src-webview/views-rendering.tsx b/extension/src-webview/views-rendering.tsx
index 12003c89..7eafedd6 100644
--- a/extension/src-webview/views-rendering.tsx
+++ b/extension/src-webview/views-rendering.tsx
@@ -63,6 +63,13 @@ export function renderRectangle(node: SNode): VNode {
     />;
 }
 
+export function renderPort(x:number, y: number, width: number, height: number): VNode {
+    return <rect
+        x={x} y={y}
+        width={Math.max(width, 0)} height={Math.max(height, 0)}
+    />;
+}
+
 /**
  * Creates rectangle borders for {@code node} at the top and bottom.
  * @param node The node that should be represented by a rectangle.

From 08c461e4e22c966f75164576905d4878d3d11af1 Mon Sep 17 00:00:00 2001
From: Jette Petzold <jep@informatik.uni-kiel.de>
Date: Thu, 19 Dec 2024 14:59:57 +0100
Subject: [PATCH 2/2] fixed problem with new sprotty version

---
 extension/src-webview/stpa/stpa-views.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/extension/src-webview/stpa/stpa-views.tsx b/extension/src-webview/stpa/stpa-views.tsx
index 0034c569..105d24ab 100644
--- a/extension/src-webview/stpa/stpa-views.tsx
+++ b/extension/src-webview/stpa/stpa-views.tsx
@@ -23,7 +23,7 @@ import { Point, toDegrees } from "sprotty-protocol";
 import { DISymbol } from '../di.symbols';
 import { ColorStyleOption, DifferentFormsOption, RenderOptionsRegistry } from '../options/render-options-registry';
 import { SendModelRendererAction } from '../snippets/actions';
-import { renderDiamond, renderHexagon, renderMirroredTriangle, renderOval, renderPentagon, renderRectangle, renderRoundedRectangle, renderTrapez, renderTriangle } from '../views-rendering';
+import { renderDiamond, renderHexagon, renderMirroredTriangle, renderOval, renderPentagon, renderPort, renderRectangle, renderRoundedRectangle, renderTrapez, renderTriangle } from '../views-rendering';
 import { collectAllChildren } from './helper-methods';
 import { CSEdge, CSNode, CS_EDGE_TYPE, CS_INTERMEDIATE_EDGE_TYPE, CS_NODE_TYPE, EdgeType, STPAAspect, STPAEdge, STPANode, STPA_EDGE_TYPE, STPA_INTERMEDIATE_EDGE_TYPE } from './stpa-model';
 
@@ -260,7 +260,7 @@ export class STPAGraphView extends SGraphView {
 
 @injectable()
 export class PortView implements IView {
-    render(model: SPort, context: RenderingContext): VNode {
+    render(model: SPortImpl, context: RenderingContext): VNode {
         const port = <g>{renderPort(model.position.x, model.position.y, model.size.width, model.size.height)}</g>;
         return <g class-pasta-hidden>{port}</g>;
     }