From ad5c246dfe8baf14830c65e894f907145c937eba Mon Sep 17 00:00:00 2001
From: Suraj Shetty <surajshetty3416@gmail.com>
Date: Thu, 18 Jan 2024 13:13:34 +0530
Subject: [PATCH] fix: Selection on undo

---
 frontend/src/components/BuilderBlock.vue  | 46 ++++++++++++-----------
 frontend/src/components/BuilderCanvas.vue |  2 +-
 2 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/frontend/src/components/BuilderBlock.vue b/frontend/src/components/BuilderBlock.vue
index 873dd44c..3810a5ef 100644
--- a/frontend/src/components/BuilderBlock.vue
+++ b/frontend/src/components/BuilderBlock.vue
@@ -252,28 +252,30 @@ const showBlock = computed(() => {
 	return data;
 });
 
-watch(
-	() => store.hoveredBlock,
-	(newValue, oldValue) => {
-		if (newValue === props.block.blockId) {
-			isHovered.value = true;
-		} else if (oldValue === props.block.blockId) {
-			isHovered.value = false;
+if (!props.preview) {
+	watch(
+		() => store.hoveredBlock,
+		(newValue, oldValue) => {
+			if (newValue === props.block.blockId) {
+				isHovered.value = true;
+			} else if (oldValue === props.block.blockId) {
+				isHovered.value = false;
+			}
 		}
-	}
-);
-
-watch(
-	() => store.activeCanvas?.selectedBlockIds,
-	() => {
-		if (store.activeCanvas?.isSelected(props.block)) {
-			isSelected.value = true;
-		} else {
-			isSelected.value = false;
+	);
+	watch(
+		() => store.activeCanvas?.selectedBlockIds,
+		() => {
+			if (store.activeCanvas?.isSelected(props.block)) {
+				isSelected.value = true;
+			} else {
+				isSelected.value = false;
+			}
+		},
+		{
+			deep: true,
+			immediate: true,
 		}
-	},
-	{
-		deep: true,
-	}
-);
+	);
+}
 </script>
diff --git a/frontend/src/components/BuilderCanvas.vue b/frontend/src/components/BuilderCanvas.vue
index b37bbc50..8a546162 100644
--- a/frontend/src/components/BuilderCanvas.vue
+++ b/frontend/src/components/BuilderCanvas.vue
@@ -472,7 +472,7 @@ const setRootBlock = (newBlock: Block, resetCanvas = false) => {
 
 const selectedBlockIds = ref([]) as Ref<string[]>;
 const selectedBlocks = computed(() => {
-	return selectedBlockIds.value.map((id) => findBlock(id));
+	return selectedBlockIds.value.map((id) => findBlock(id)).filter((b) => b) as Block[];
 }) as Ref<Block[]>;
 
 const isSelected = (block: Block) => {