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 1/3] 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>

From e7963c64e637a94cb8ae6e49b89da485865fd028 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Tue, 5 Jul 2022 10:50:09 +0100
Subject: [PATCH 2/3] Removed asterix from section header

---
 .../design/PropertiesPanel/ConditionalUISection.svelte       | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/packages/builder/src/components/design/PropertiesPanel/ConditionalUISection.svelte b/packages/builder/src/components/design/PropertiesPanel/ConditionalUISection.svelte
index e8ca916d1f..cc2880b149 100644
--- a/packages/builder/src/components/design/PropertiesPanel/ConditionalUISection.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/ConditionalUISection.svelte
@@ -35,10 +35,7 @@
   } set`
 </script>
 
-<DetailSummary
-  name={`Conditions${conditionCount ? " *" : ""}`}
-  collapsible={false}
->
+<DetailSummary name={"Conditions"} collapsible={false}>
   <div class="conditionCount">{conditionText}</div>
   <div>
     <ActionButton on:click={openDrawer}>Configure conditions</ActionButton>

From 1b9e486bc58ae1802bba9cf0c69f937112cfb3fe Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Wed, 13 Jul 2022 14:33:30 +0100
Subject: [PATCH 3/3] Minor update to reduce spacing in component condition
 count

---
 .../_components/settings/ConditionalUISection.svelte             | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ConditionalUISection.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ConditionalUISection.svelte
index b29cc472d9..fca81f7652 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ConditionalUISection.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ConditionalUISection.svelte
@@ -52,5 +52,6 @@
 <style>
   .conditionCount {
     font-weight: 600;
+    margin-top: -5px;
   }
 </style>