ui fixes

src/lib/components/UpgradeToPro.svelte

@@ -70,11 +70,11 @@
                   ></path></svg
                 >
               </div>
-              Realtime Options Data
+              Realtime Options & Dark Pool Data
             </dt>
             <dd class="mt-2 text-base leading-7 text-white">
-              Instant access to live options data to spot opportunities and
-              trade with precision before the market moves.
+              Instant access to live options & dark pool data to spot
+              opportunities and trade with precision before the market moves.
             </dd>
           </div>
 

src/routes/hedge-funds/+page.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import cardBackground from "$lib/images/bg-hedge-funds.png";
+  import defaultAvatar from "$lib/images/hedge-fund-avatar.png";
 
   import { abbreviateNumber, formatString } from "$lib/utils";
   import { onMount } from "svelte";
@@ -7,8 +8,6 @@
 
   export let data;
 
-  let cloudFrontUrl = import.meta.env.VITE_IMAGE_URL;
-
   let rawData = data?.getAllHedgeFunds;
   let displayList = rawData?.slice(0, 20) ?? [];
   let filterQuery = "";
@@ -155,7 +154,7 @@
                           <img
                             style="clip-path: circle(50%);"
                             class="rounded-full w-16"
-                            src={`${cloudFrontUrl}/assets/hedge_funds/default-avatar.png`}
+                            src={defaultAvatar}
                             loading="lazy"
                           />
                         </div>

src/routes/hedge-funds/[slug]/+page.svelte

@@ -1,9 +1,11 @@
 <script lang="ts">
-  import { numberOfUnreadNotification } from "$lib/store";
   import { formatString, sectorNavigation, abbreviateNumber } from "$lib/utils";
   import Table from "$lib/components/Table/Table.svelte";
   import UpgradeToPro from "$lib/components/UpgradeToPro.svelte";
   import SEO from "$lib/components/SEO.svelte";
+  import cardBackground from "$lib/images/bg-hedge-funds.png";
+
+  import defaultAvatar from "$lib/images/hedge-fund-avatar.png";
 
   export let data;
 
@@ -71,19 +73,17 @@
               <div
                 class="flex space-x-3 border-b-[2px] border-below-title pb-3 lg:border-none lg:pb-0"
               >
-                <div class="flex-shrink-0">
-                  <svg
-                    class="h-16 w-16 sm:h-20 sm:w-20 text-gray-200"
-                    fill="currentColor"
-                    viewBox="0 0 24 24"
-                    style="max-width:100px"
-                    ><path
-                      fill-rule="evenodd"
-                      d="M18.685 19.097A9.723 9.723 0 0021.75 12c0-5.385-4.365-9.75-9.75-9.75S2.25 6.615 2.25 12a9.723 9.723 0 003.065 7.097A9.716 9.716 0 0012 21.75a9.716 9.716 0 006.685-2.653zm-12.54-1.285A7.486 7.486 0 0112 15a7.486 7.486 0 015.855 2.812A8.224 8.224 0 0112 20.25a8.224 8.224 0 01-5.855-2.438zM15.75 9a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0z"
-                      clip-rule="evenodd"
-                    ></path></svg
-                  >
+                <div
+                  class=" sm:-mt-3 shadow-lg rounded-full border border-slate-600 w-14 h-14 sm:w-20 sm:h-20 relative hedge-fund-striped bg-[#20202E] flex items-center justify-center"
+                >
+                  <img
+                    style="clip-path: circle(50%);"
+                    class="rounded-full w-10 sm:w-16"
+                    src={defaultAvatar}
+                    loading="lazy"
+                  />
                 </div>
+
                 <div class="mt-0 pt-0.5 text-left">
                   <h1 class="mb-0 text-2xl font-bold text-white">
                     {formatString(companyName)}
@@ -219,3 +219,15 @@
     </div>
   </div>
 </section>
+
+<style>
+  .hedge-fund-striped {
+    background-image: repeating-linear-gradient(
+      -45deg,
+      #a77120,
+      #a77120 10px,
+      #90621c 10px,
+      #90621c 20px
+    );
+  }
+</style>

src/routes/market-flow/sector-flow/+page.server.ts

@@ -12,14 +12,13 @@ export const load = async ({ locals }) => {
 
 let output = await response?.json();
  if (user?.tier !== "Pro") {
-    Object.keys(output.topPosNetPremium).forEach(ticker => {
-        output.topPosNetPremium[ticker] = output.topPosNetPremium[ticker].slice(0, 3);
-    });
-
-    Object.keys(output.topNegNetPremium).forEach(ticker => {
-        output.topNegNetPremium[ticker] = output.topNegNetPremium[ticker].slice(0, 3);
-    });
-}
+    for (const ticker in output.topPosNetPremium ?? {}) {
+      output.topPosNetPremium[ticker] = output.topPosNetPremium[ticker].slice(0, 3);
+    }
+    for (const ticker in output.topNegNetPremium ?? {}) {
+      output.topNegNetPremium[ticker] = output.topNegNetPremium[ticker].slice(0, 3);
+    }
+  }
 
     return output;
   };