Merge pull request #1014 from tradingstrategy-ai/optimize-top-vaults

Top vaults performance optimization

Author: kenkunz

src/lib/top-vaults/DepositEventsCell.svelte

@@ -28,13 +28,15 @@
 	});
 </script>
 
-<div>
+<div class="deposit-events-cell">
 	<span>{number}</span>
-	<span class="unit">{unit}</span>
+	{#if unit}
+		<span class="unit">{unit}</span>
+	{/if}
 </div>
 
 <style>
-	div {
+	.deposit-events-cell {
 		display: inline-flex;
 		gap: 0.5ex;
 	}

src/lib/top-vaults/FeesCell.svelte

@@ -10,7 +10,7 @@
 	let { mgmt_fee, perf_fee }: Props = $props();
 </script>
 
-<div class="fees">
+<div class="fees-cell">
 	<Tooltip>
 		<div class="multiline" slot="trigger">
 			{#if !isNumber(mgmt_fee) && !isNumber(perf_fee)}
@@ -34,7 +34,7 @@
 </div>
 
 <style>
-	.fees {
+	.fees-cell {
 		display: contents;
 
 		:global(.popup) {

src/lib/top-vaults/MultiValCell.svelte

@@ -10,7 +10,7 @@
 	const riskClass = risk?.toLowerCase().replace(/ /g, '-') ?? 'unknown';
 </script>
 
-<span class={['risk', riskClass]}>
+<span class="risk-cell {riskClass}">
 	<Tooltip>
 		<svelte:fragment slot="trigger">
 			{risk ?? 'Unknown'}
@@ -23,7 +23,7 @@
 </span>
 
 <style>
-	.risk {
+	.risk-cell {
 		font: var(--f-ui-xs-medium);
 		letter-spacing: 0.02em;