From b0e9d23cf3ad7318db14347dd596256fba97ec0b Mon Sep 17 00:00:00 2001
From: MuslemRahimi <moslem_rahimi@hotmail.de>
Date: Sun, 29 Dec 2024 23:40:54 +0100
Subject: [PATCH] ui fix

---
 src/routes/pricing/+page.svelte               | 44 +++++++++++++++++++
 .../stocks/[tickerID]/dark-pool/+page.svelte  | 15 ++++---
 2 files changed, 54 insertions(+), 5 deletions(-)

diff --git a/src/routes/pricing/+page.svelte b/src/routes/pricing/+page.svelte
index 0f9c23f5..8944ab2f 100644
--- a/src/routes/pricing/+page.svelte
+++ b/src/routes/pricing/+page.svelte
@@ -810,6 +810,50 @@
                       >
                     </td>
                   </tr>
+                  <tr class="border-t first:border-t-2 border-gray-800">
+                    <td
+                      class="text-sm sm:text-base font-medium text-white pr-2 py-4"
+                    >
+                      <div class="flex items-center justify-between max-w-xs">
+                        <div>Unusual Dark Pool Activity</div>
+                      </div>
+                    </td>
+                    <td class="text-sm px-2 py-4 text-center font-medium">
+                      <svg
+                        class="flex-shrink-0 w-4 h-4 inline-flex"
+                        xmlns="http://www.w3.org/2000/svg"
+                        viewBox="0 0 36 36"
+                        ><path
+                          fill="#dd2e44"
+                          d="M21.533 18.002L33.768 5.768a2.5 2.5 0 0 0-3.535-3.535L17.998 14.467L5.764 2.233a2.498 2.498 0 0 0-3.535 0a2.498 2.498 0 0 0 0 3.535l12.234 12.234L2.201 30.265a2.498 2.498 0 0 0 1.768 4.267c.64 0 1.28-.244 1.768-.732l12.262-12.263l12.234 12.234a2.493 2.493 0 0 0 1.768.732a2.5 2.5 0 0 0 1.768-4.267z"
+                        /></svg
+                      >
+                    </td>
+                    <td class="text-sm px-2 py-4 text-center font-medium">
+                      <svg
+                        class="flex-shrink-0 w-5 h-5 inline-flex"
+                        xmlns="http://www.w3.org/2000/svg"
+                        viewBox="0 0 48 48"
+                        ><mask id="ipSSuccess0"
+                          ><g
+                            fill="none"
+                            stroke-linecap="round"
+                            stroke-linejoin="round"
+                            stroke-width="4"
+                            ><path
+                              fill="#fff"
+                              stroke="#fff"
+                              d="m24 4l5.253 3.832l6.503-.012l1.997 6.188l5.268 3.812L41 24l2.021 6.18l-5.268 3.812l-1.997 6.188l-6.503-.012L24 44l-5.253-3.832l-6.503.012l-1.997-6.188l-5.268-3.812L7 24l-2.021-6.18l5.268-3.812l1.997-6.188l6.503.012L24 4Z"
+                            /><path stroke="#09090B" d="m17 24l5 5l10-10" /></g
+                          ></mask
+                        ><path
+                          fill="#00FC50"
+                          d="M0 0h48v48H0z"
+                          mask="url(#ipSSuccess0)"
+                        /></svg
+                      >
+                    </td>
+                  </tr>
                   <!-- Row -->
                   <tr class="border-t first:border-t-2 border-gray-800">
                     <td
diff --git a/src/routes/stocks/[tickerID]/dark-pool/+page.svelte b/src/routes/stocks/[tickerID]/dark-pool/+page.svelte
index 0bd07231..7d706f54 100644
--- a/src/routes/stocks/[tickerID]/dark-pool/+page.svelte
+++ b/src/routes/stocks/[tickerID]/dark-pool/+page.svelte
@@ -9,6 +9,7 @@
   import InfoModal from "$lib/components/InfoModal.svelte";
   import Infobox from "$lib/components/Infobox.svelte";
   import HottestTrades from "$lib/components/DarkPool/HottestTrades.svelte";
+  import UpgradeToPro from "$lib/components/UpgradeToPro.svelte";
   import { onMount } from "svelte";
 
   export let data;
@@ -95,11 +96,15 @@
               metrics={data?.getPriceLevel?.metrics}
             />
           {/if}
-          {#if hottestTrades?.length > 0}
-            <HottestTrades rawData={hottestTrades} />
-          {/if}
-          {#if historicalDarkPool?.length > 0}
-            <HistoricalVolume rawData={historicalDarkPool} />
+          {#if data?.user?.tier === "Pro"}
+            {#if hottestTrades?.length > 0}
+              <HottestTrades rawData={hottestTrades} />
+            {/if}
+            {#if historicalDarkPool?.length > 0}
+              <HistoricalVolume rawData={historicalDarkPool} />
+            {/if}
+          {:else}
+            <UpgradeToPro {data} />
           {/if}
         {:else}
           <div class="flex justify-center items-center h-80">