From 164f33142ad31b0f171794fc8ffdcfdf66bb1b72 Mon Sep 17 00:00:00 2001
From: MuslemRahimi <moslem_rahimi@hotmail.de>
Date: Sat, 8 Jun 2024 20:18:02 +0200
Subject: [PATCH] ui fixes

---
 src/lib/components/PriceAnalysis.svelte       |  9 ++++++++-
 src/lib/components/RevenueSegmentation.svelte | 19 +++++++++++--------
 src/lib/components/TrendAnalysis.svelte       | 18 ++++++++++--------
 src/lib/store.ts                              |  3 +++
 src/routes/stocks/[tickerID]/+page.svelte     |  8 ++++----
 5 files changed, 36 insertions(+), 21 deletions(-)

diff --git a/src/lib/components/PriceAnalysis.svelte b/src/lib/components/PriceAnalysis.svelte
index 216c934d..97718fbc 100644
--- a/src/lib/components/PriceAnalysis.svelte
+++ b/src/lib/components/PriceAnalysis.svelte
@@ -1,6 +1,6 @@
 
 <script lang ='ts'>
-  import { displayCompanyName, stockTicker, etfTicker, cryptoTicker, assetType, screenWidth, userRegion, getCache, setCache} from '$lib/store';
+  import { priceAnalysisComponent, displayCompanyName, stockTicker, etfTicker, cryptoTicker, assetType, screenWidth, userRegion, getCache, setCache} from '$lib/store';
   import InfoModal from '$lib/components/InfoModal.svelte';
   import { Chart } from 'svelte-echarts'
 
@@ -158,6 +158,13 @@ const getPriceAnalysis = async (ticker) => {
       // Cache the data for this specific tickerID with a specific name 'getPriceAnalysis'
       setCache(ticker, priceAnalysisDict, 'getPriceAnalysis');
     }
+
+  if(Object?.keys(priceAnalysisDict)?.length !== 0) {
+    $priceAnalysisComponent = true;
+  }
+  else {
+    $priceAnalysisComponent = false;
+  }
 };
 
 
diff --git a/src/lib/components/RevenueSegmentation.svelte b/src/lib/components/RevenueSegmentation.svelte
index c70ab078..1b2b2374 100644
--- a/src/lib/components/RevenueSegmentation.svelte
+++ b/src/lib/components/RevenueSegmentation.svelte
@@ -1,5 +1,5 @@
 <script lang='ts'>
-    import { stockTicker, screenWidth, userRegion, getCache, setCache} from '$lib/store';
+    import { revenueSegmentationComponent, stockTicker, screenWidth, userRegion, getCache, setCache} from '$lib/store';
     import { abbreviateNumber, formatString } from '$lib/utils';
     import Sankey from '$lib/components/Sankey.svelte';
     import { LayerCake, Svg } from 'layercake';
@@ -130,7 +130,15 @@
             
             geographicList = [...geographicList];
 
+    if(Object?.keys(data)?.length !== 0  && totalProductRevenue !== 0) {
+        $revenueSegmentationComponent = true;
     }
+    else {
+        $revenueSegmentationComponent = false;
+    }
+
+
+}
     
     
     
@@ -156,6 +164,7 @@ const getRevenueSegmentation = async (ticker) => {
       // Cache the data for this specific tickerID with a specific name 'getRevenueSegmentation'
       setCache(ticker, revenueSegmentation, 'getRevenueSegmentation');
     }
+
 };
     
         
@@ -312,13 +321,7 @@ $: {
                             </label>
                             {/if}
                             
-        
-        
-                            {:else} 
-                            <h2 class="mt-10 justify-center items-center text-3xl font-bold text-slate-700 mb-5 m-auto">
-                                No data available
-                                <svg class="w-10 sm:w-12 inline-block" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#334155" d="M18.68 12.32a4.49 4.49 0 0 0-6.36.01a4.49 4.49 0 0 0 0 6.36a4.508 4.508 0 0 0 5.57.63L21 22.39L22.39 21l-3.09-3.11c1.13-1.77.87-4.09-.62-5.57m-1.41 4.95c-.98.98-2.56.97-3.54 0c-.97-.98-.97-2.56.01-3.54c.97-.97 2.55-.97 3.53 0c.97.98.97 2.56 0 3.54M10.9 20.1a6.527 6.527 0 0 1-1.48-2.32C6.27 17.25 4 15.76 4 14v3c0 2.21 3.58 4 8 4c-.4-.26-.77-.56-1.1-.9M4 9v3c0 1.68 2.07 3.12 5 3.7v-.2c0-.93.2-1.85.58-2.69C6.34 12.3 4 10.79 4 9m8-6C7.58 3 4 4.79 4 7c0 2 3 3.68 6.85 4h.05c1.2-1.26 2.86-2 4.6-2c.91 0 1.81.19 2.64.56A3.215 3.215 0 0 0 20 7c0-2.21-3.58-4-8-4Z"/></svg>
-                            </h2>
+    
                             {/if}
 
                     {:else}
diff --git a/src/lib/components/TrendAnalysis.svelte b/src/lib/components/TrendAnalysis.svelte
index 288a62d3..74250554 100644
--- a/src/lib/components/TrendAnalysis.svelte
+++ b/src/lib/components/TrendAnalysis.svelte
@@ -1,6 +1,6 @@
 
 <script lang ='ts'>
-    import { displayCompanyName, stockTicker, etfTicker, cryptoTicker, assetType, userRegion, getCache, setCache} from '$lib/store';
+    import { displayCompanyName, trendAnalysisComponent, stockTicker, etfTicker, cryptoTicker, assetType, userRegion, getCache, setCache} from '$lib/store';
     import InfoModal from '$lib/components/InfoModal.svelte';
     //import Chart from '$lib/components/Chart.svelte';
     //import Lazy from 'svelte-lazy';
@@ -61,6 +61,14 @@ const getTrendAnalysis = async (ticker) => {
       // Cache the data for this specific tickerID with a specific name 'getTrendAnalysis'
       setCache(ticker, trendList, 'getTrendAnalysis');
     }
+
+    if(trendList?.length !== 0) {
+    $trendAnalysisComponent = true;
+    }
+    else {
+      $trendAnalysisComponent = false;
+    }
+
 };
 
 
@@ -210,13 +218,7 @@ $: {
           
             
     
-            
-              
-            {:else}
-            <h2 class="mt-10 mb-5 flex justify-center items-center text-3xl font-bold text-slate-700 m-auto">
-                No data available
-                <svg class="w-10 sm:w-12 inline-block" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#334155" d="M18.68 12.32a4.49 4.49 0 0 0-6.36.01a4.49 4.49 0 0 0 0 6.36a4.508 4.508 0 0 0 5.57.63L21 22.39L22.39 21l-3.09-3.11c1.13-1.77.87-4.09-.62-5.57m-1.41 4.95c-.98.98-2.56.97-3.54 0c-.97-.98-.97-2.56.01-3.54c.97-.97 2.55-.97 3.53 0c.97.98.97 2.56 0 3.54M10.9 20.1a6.527 6.527 0 0 1-1.48-2.32C6.27 17.25 4 15.76 4 14v3c0 2.21 3.58 4 8 4c-.4-.26-.77-.56-1.1-.9M4 9v3c0 1.68 2.07 3.12 5 3.7v-.2c0-.93.2-1.85.58-2.69C6.34 12.3 4 10.79 4 9m8-6C7.58 3 4 4.79 4 7c0 2 3 3.68 6.85 4h.05c1.2-1.26 2.86-2 4.6-2c.91 0 1.81.19 2.64.56A3.215 3.215 0 0 0 20 7c0-2.21-3.58-4-8-4Z"/></svg>
-            </h2>
+    
             
             {/if}
 
diff --git a/src/lib/store.ts b/src/lib/store.ts
index f8fd5700..d398c99a 100644
--- a/src/lib/store.ts
+++ b/src/lib/store.ts
@@ -59,6 +59,9 @@ export const replyCommentClicked = writable(({}));
 export const editCommentClicked = writable(({}));
 
 export const fundamentalAnalysisComponent = writable(<boolean>(false));
+export const priceAnalysisComponent = writable(<boolean>(false));
+export const revenueSegmentationComponent = writable(<boolean>(false));
+export const trendAnalysisComponent = writable(<boolean>(false));
 
 
 export const strategyId = writable(<string> (""));
diff --git a/src/routes/stocks/[tickerID]/+page.svelte b/src/routes/stocks/[tickerID]/+page.svelte
index 1de5d19c..392132d9 100644
--- a/src/routes/stocks/[tickerID]/+page.svelte
+++ b/src/routes/stocks/[tickerID]/+page.svelte
@@ -3,7 +3,7 @@
   import {AreaSeries, Chart, PriceLine, CandlestickSeries} from 'svelte-lightweight-charts';
   
   import { TrackingModeExitMode } from 'lightweight-charts';
-  import {screenWidth, displayCompanyName, numberOfUnreadNotification, globalForm, fundamentalAnalysisComponent,  userRegion, isCrosshairMoveActive, realtimePrice, priceIncrease, currentPortfolioPrice, currentPrice, clientSideCache, stockTicker, isOpen, isBeforeMarketOpen, isWeekend} from '$lib/store';
+  import {screenWidth, displayCompanyName, numberOfUnreadNotification, globalForm, trendAnalysisComponent,  revenueSegmentationComponent, priceAnalysisComponent, fundamentalAnalysisComponent,  userRegion, isCrosshairMoveActive, realtimePrice, priceIncrease, currentPortfolioPrice, currentPrice, clientSideCache, stockTicker, isOpen, isBeforeMarketOpen, isWeekend} from '$lib/store';
   import { onDestroy, onMount } from 'svelte';
   import StockKeyInformation from '$lib/components/StockKeyInformation.svelte';
   import BullBearSay from '$lib/components/BullBearSay.svelte';
@@ -1194,7 +1194,7 @@ function changeChartType() {
 
 
                                 <Lazy>
-                                  <div class="w-full mt-10 sm:mt-5 m-auto sm:pl-6 sm:pb-6 sm:pt-6">
+                                  <div class="w-full mt-10 sm:mt-5 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {!$priceAnalysisComponent ? 'hidden' : ''}">
                                   {#await import('$lib/components/PriceAnalysis.svelte') then {default: Comp}}
                                     <svelte:component this={Comp} data={data} />
                                   {/await}
@@ -1202,7 +1202,7 @@ function changeChartType() {
                                 </Lazy>
 
                                 <Lazy>
-                                  <div class="w-full mt-10 sm:mt-5 m-auto sm:pl-6 sm:pb-6 sm:pt-6">
+                                  <div class="w-full mt-10 sm:mt-5 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {!$trendAnalysisComponent ? 'hidden' : ''}">
                                   {#await import('$lib/components/TrendAnalysis.svelte') then {default: Comp}}
                                     <svelte:component this={Comp} data={data} />
                                   {/await}
@@ -1260,7 +1260,7 @@ function changeChartType() {
 
                                  <!--Start RevenueSegmentation-->
                                   <Lazy>
-                                    <div class="w-full pt-10 sm:pl-6 sm:pb-6 sm:pt-6 m-auto">
+                                    <div class="w-full pt-10 sm:pl-6 sm:pb-6 sm:pt-6 m-auto {!$revenueSegmentationComponent ? 'hidden' : ''}">
                                     {#await import('$lib/components/RevenueSegmentation.svelte') then {default: Comp}}
                                       <svelte:component this={Comp} />
                                     {/await}