Added control for no data case

If the number of items is less than 4 (for example in case of 2), no data is displayed on the metric cards (even if there are versions).
This control has been added to the metric cards on the distribution.

Author: pnrgenc

frontend/express/public/core/platform/templates/platform.html

@@ -46,7 +46,7 @@ <h4>{{i18n('platforms.platforms-for')}}</h4>
             </vue-scroll>
         </div>
 		<h5 class="bu-pb-4"> {{i18n('platforms.version-distribution')}} </h5>
-		<div v-if="platformVersions.length < 4 && !isLoading" class="technology-analytics-wrapper__versions-empty-card">
+		<div v-if="platformVersions.length === 0 && !isLoading" class="technology-analytics-wrapper__versions-empty-card">
 			<div class="text-medium">{{i18n('common.table.no-data')}}</div>
 		</div>
         <div v-else class="technology-analytics-wrapper__versions" v-loading="isLoading">
@@ -60,6 +60,9 @@ <h5 class="bu-pb-4"> {{i18n('platforms.version-distribution')}} </h5>
 							:scroll-ops="breakdownScrollOps" 
 							v-for="(item, idx) in platformVersions">
 						</cly-metric-breakdown>
+                        <div v-if="platformItems.length < 4 && !isLoading" class="technology-analytics-wrapper__empty-card">
+                            <div class="text-medium">{{i18n('common.table.no-data')}}</div>
+                        </div>
 					</cly-metric-cards>
             </vue-scroll>
         </div>

plugins/browser/frontend/public/templates/browser.html

@@ -47,7 +47,7 @@ <h4>{{i18n('browser.browser-for')}}</h4>
             </vue-scroll>
         </div>
 		<h5 class="bu-pb-4"> {{i18n('browser.version-distribution')}} </h5>
-		<div v-if="browserVersions.length < 4 && !isLoading" class="technology-analytics-wrapper-browser__versions-empty-card">
+		<div v-if="browserVersions.length === 0 && !isLoading" class="technology-analytics-wrapper-browser__versions-empty-card">
 			<div class="text-medium">{{i18n('common.table.no-data')}}</div>
 		</div>
         <div v-else v-loading="isLoading" class="technology-analytics-wrapper-browser__versions">
@@ -61,6 +61,9 @@ <h5 class="bu-pb-4"> {{i18n('browser.version-distribution')}} </h5>
 							:scroll-ops="breakdownScrollOps" 
 							v-for="(item, idx) in browserVersions">
 						</cly-metric-breakdown>
+						<div v-if="browserItems.length < 4 && !isLoading" class="technology-analytics-wrapper-browser__empty-card">
+							<div class="text-medium">{{i18n('common.table.no-data')}}</div>
+						</div>
 					</cly-metric-cards>
             </vue-scroll>
         </div>

plugins/density/frontend/public/templates/density.html

@@ -40,7 +40,7 @@ <h4>{{i18n('density.densities-for')}}</h4>
                             <span class="text-medium">{{item.percentText}}</span>
                         </template>
                     </cly-metric-card>
-					<div v-if="densityItems.length < 4 && !isLoading" class="technology-density-wrapper__empty-card">
+					<div v-if="densityItems.length === 0 && !isLoading" class="technology-density-wrapper__empty-card">
 						<div class="text-medium">{{i18n('common.table.no-data')}}</div>
 					</div>
                 </cly-metric-cards>
@@ -61,6 +61,9 @@ <h5 class="bu-pb-4"> {{i18n('density.distribution')}} </h5>
 							:scroll-ops="breakdownScrollOps" 
 							v-for="(item, idx) in densityVersions">
 						</cly-metric-breakdown>
+						<div v-if="densityItems.length < 4 && !isLoading" class="technology-density-wrapper__empty-card">
+                            <div class="text-medium">{{i18n('common.table.no-data')}}</div>
+                        </div>
 					</cly-metric-cards>
             </vue-scroll>
         </div>