From 21ede347cbf60d5edd166ef92ea36a78a78aef52 Mon Sep 17 00:00:00 2001
From: Adela Almasan <88068998+adela-almasan@users.noreply.github.com>
Date: Mon, 27 Mar 2023 11:51:56 -0500
Subject: [PATCH] Canvas: Remove deleted connections from source (#65321)

---
 public/app/features/canvas/runtime/frame.tsx | 2 ++
 public/app/plugins/panel/canvas/utils.ts     | 9 +++++++++
 2 files changed, 11 insertions(+)

diff --git a/public/app/features/canvas/runtime/frame.tsx b/public/app/features/canvas/runtime/frame.tsx
index 2bb28b456d8..fd1cc9c8dfd 100644
--- a/public/app/features/canvas/runtime/frame.tsx
+++ b/public/app/features/canvas/runtime/frame.tsx
@@ -6,6 +6,7 @@ import { notFoundItem } from 'app/features/canvas/elements/notFound';
 import { DimensionContext } from 'app/features/dimensions';
 import { LayerActionID } from 'app/plugins/panel/canvas/types';
 
+import { updateConnectionsForSource } from '../../../plugins/panel/canvas/utils';
 import { CanvasElementItem } from '../element';
 import { HorizontalConstraint, Placement, VerticalConstraint } from '../types';
 
@@ -114,6 +115,7 @@ export class FrameState extends ElementState {
     switch (action) {
       case LayerActionID.Delete:
         this.elements = this.elements.filter((e) => e !== element);
+        updateConnectionsForSource(element, this.scene);
         this.scene.byName.delete(element.options.name);
         this.scene.save();
         this.reinitializeMoveable();
diff --git a/public/app/plugins/panel/canvas/utils.ts b/public/app/plugins/panel/canvas/utils.ts
index 1da2f120515..4422882e97f 100644
--- a/public/app/plugins/panel/canvas/utils.ts
+++ b/public/app/plugins/panel/canvas/utils.ts
@@ -161,3 +161,12 @@ export function getConnections(sceneByName: Map<string, ElementState>) {
 export function getConnectionsByTarget(element: ElementState, scene: Scene) {
   return getConnections(scene.byName).filter((connection) => connection.target === element);
 }
+
+export function updateConnectionsForSource(element: ElementState, scene: Scene) {
+  const targetConnections = getConnectionsByTarget(element, scene);
+  targetConnections.forEach((connection) => {
+    const sourceConnections = connection.source.options.connections?.splice(0) ?? [];
+    const connections = sourceConnections.filter((con) => con.targetName !== element.getName());
+    connection.source.onChange({ ...connection.source.options, connections });
+  });
+}