diff --git a/packages/modules/display_themes/cards/source/src/components/Dashboard/FlowCard.vue b/packages/modules/display_themes/cards/source/src/components/Dashboard/FlowCard.vue
index d4888d86fd..83448e2ea2 100644
--- a/packages/modules/display_themes/cards/source/src/components/Dashboard/FlowCard.vue
+++ b/packages/modules/display_themes/cards/source/src/components/Dashboard/FlowCard.vue
@@ -668,7 +668,7 @@ export default {
             >
               <defs>
                 <clipPath
-                  v-if="component.soc"
+                  v-if="component.soc !== undefined"
                   :id="`clip-soc-${component.id}`"
                 >
                   <rect
@@ -754,10 +754,10 @@ export default {
                   cx="0"
                   cy="0"
                   :r="svgSize.circleRadius"
-                  :class="{ soc: component.soc }"
+                  :class="{ soc: component.soc !== undefined }"
                 />
                 <circle
-                  v-if="component.soc"
+                  v-if="component.soc !== undefined"
                   cx="0"
                   cy="0"
                   :r="svgSize.circleRadius"
diff --git a/packages/modules/web_themes/koala/source/src/components/charts/energyFlowChart/EnergyFlowChart.vue b/packages/modules/web_themes/koala/source/src/components/charts/energyFlowChart/EnergyFlowChart.vue
index 2394790ab5..9325581cc5 100644
--- a/packages/modules/web_themes/koala/source/src/components/charts/energyFlowChart/EnergyFlowChart.vue
+++ b/packages/modules/web_themes/koala/source/src/components/charts/energyFlowChart/EnergyFlowChart.vue
@@ -676,7 +676,7 @@ const svgRectWidth = computed(
           @click="beginAnimation(`animate-label-${component.id}`)"
         >
           <defs>
-            <clipPath v-if="component.soc" :id="`clip-soc-${component.id}`">
+            <clipPath v-if="component.soc !== undefined" :id="`clip-soc-${component.id}`">
               <rect
                 :x="-svgSize.circleRadius - svgSize.strokeWidth"
                 :y="
@@ -768,10 +768,10 @@ const svgRectWidth = computed(
               cx="0"
               cy="0"
               :r="svgSize.circleRadius"
-              :class="{ soc: component.soc }"
+              :class="{ soc: component.soc !== undefined }"
             />
             <circle
-              v-if="component.soc"
+              v-if="component.soc !== undefined"
               cx="0"
               cy="0"
               :r="svgSize.circleRadius"