From 4808789acaa0d0421f450c0581e239c3b74eca9b Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Tue, 5 Jul 2022 09:05:23 +0100
Subject: [PATCH] Added condition count to the component settings panel

---
 .../PropertiesPanel/ConditionalUISection.svelte    | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/builder/src/components/design/PropertiesPanel/ConditionalUISection.svelte b/packages/builder/src/components/design/PropertiesPanel/ConditionalUISection.svelte
index b0863dce83..e8ca916d1f 100644
--- a/packages/builder/src/components/design/PropertiesPanel/ConditionalUISection.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/ConditionalUISection.svelte
@@ -28,12 +28,18 @@
     }
     drawer.hide()
   }
+
+  $: conditionCount = componentInstance?._conditions?.length
+  $: conditionText = `${conditionCount || "No"} condition${
+    conditionCount !== 1 ? "s" : ""
+  } set`
 </script>
 
 <DetailSummary
-  name={`Conditions${componentInstance?._conditions ? " *" : ""}`}
+  name={`Conditions${conditionCount ? " *" : ""}`}
   collapsible={false}
 >
+  <div class="conditionCount">{conditionText}</div>
   <div>
     <ActionButton on:click={openDrawer}>Configure conditions</ActionButton>
   </div>
@@ -45,3 +51,9 @@
   <Button cta slot="buttons" on:click={() => save()}>Save</Button>
   <ConditionalUIDrawer slot="body" bind:conditions={tempValue} {bindings} />
 </Drawer>
+
+<style>
+  .conditionCount {
+    font-weight: 600;
+  }
+</style>