diff --git a/src/lib/images/default_avatar.png b/src/lib/images/default_avatar.png
new file mode 100644
index 00000000..26f4d5ed
Binary files /dev/null and b/src/lib/images/default_avatar.png differ
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 86d750e0..4e27c0bc 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,25 +1,41 @@
-<script lang='ts'>
+<svelte:options immutable={true} />
+
+<script lang="ts">
   import "../app.css";
   import "../app.pcss";
-  
-  import { Toaster } from 'svelte-french-toast';
-  import {getImageURL } from '$lib/utils';
 
-  import NProgress from 'nprogress';
-  import 'nprogress/nprogress.css';
+  import { Toaster } from "svelte-french-toast";
+  import { getImageURL } from "$lib/utils";
 
-  import { page } from '$app/stores';
-  import Footer from '$lib/components/Footer.svelte';
-  import Searchbar from '$lib/components/Searchbar.svelte';
-  import NotificationBell from '$lib/components/NotificationBell.svelte';
+  import NProgress from "nprogress";
+  import "nprogress/nprogress.css";
+
+  import { page } from "$app/stores";
+  import Footer from "$lib/components/Footer.svelte";
+  import Searchbar from "$lib/components/Searchbar.svelte";
+  import NotificationBell from "$lib/components/NotificationBell.svelte";
+  import defaultAvatar from "$lib/images/default_avatar.png";
   import { goto } from "$app/navigation";
   //import PullToRefresh from '$lib/components/PullToRefresh.svelte';
 
   //import DiscountBanner from '$lib/components/DiscountBanner.svelte';
-  
-  import { beforeNavigate, afterNavigate } from '$app/navigation';
-  import { onMount, onDestroy } from 'svelte';
-  import { clearCache, showCookieConsent,  newAvatar, screenWidth, stockTicker, etfTicker, loginData, numberOfUnreadNotification, cachedPosts, currentPagePosition, clientSideCache, twitchStatus } from '$lib/store';
+
+  import { beforeNavigate, afterNavigate } from "$app/navigation";
+  import { onMount, onDestroy } from "svelte";
+  import {
+    clearCache,
+    showCookieConsent,
+    newAvatar,
+    screenWidth,
+    stockTicker,
+    etfTicker,
+    loginData,
+    numberOfUnreadNotification,
+    cachedPosts,
+    currentPagePosition,
+    clientSideCache,
+    twitchStatus,
+  } from "$lib/store";
 
   import { Button } from "$lib/components/shadcn/button/index.ts";
   import * as Card from "$lib/components/shadcn/card/index.ts";
@@ -28,7 +44,6 @@
   import * as Sheet from "$lib/components/shadcn/sheet/index.ts";
   import * as Accordion from "$lib/components/shadcn/accordion/index.js";
 
-
   import Home from "lucide-svelte/icons/house";
   import Menu from "lucide-svelte/icons/menu";
   import Stock from "lucide-svelte/icons/chart-candlestick";
@@ -40,42 +55,39 @@
   import Newspaper from "lucide-svelte/icons/newspaper";
   import MessageCircle from "lucide-svelte/icons/message-circle";
   import AudioLine from "lucide-svelte/icons/audio-lines";
-  import Gem from 'lucide-svelte/icons/gem';
+  import Gem from "lucide-svelte/icons/gem";
 
   export let data;
 
   let cloudFrontUrl = import.meta.env.VITE_IMAGE_URL;
 
+  //const trialLeftDays = Math?.floor(addDays(data, 7, ''));
 
-//const trialLeftDays = Math?.floor(addDays(data, 7, ''));
-
-
-async function pushNotification() {
-  Notification?.requestPermission()?.then(perm => {
-    if (perm === 'granted') {
-      new Notification('Stocknear', {
-        body: 'this is more text',
-      })
-    }
-  })
-}
-
+  async function pushNotification() {
+    Notification?.requestPermission()?.then((perm) => {
+      if (perm === "granted") {
+        new Notification("Stocknear", {
+          body: "this is more text",
+        });
+      }
+    });
+  }
 
   //Check Service Worker (SW)
-async function detectSWUpdate() {
+  async function detectSWUpdate() {
     const registration = await navigator.serviceWorker.ready;
 
-    registration.addEventListener('updatefound', () => {
+    registration.addEventListener("updatefound", () => {
       const newSW = registration.installing;
-      newSW?.addEventListener('statechange', () => {
-        if(newSW.state === 'installed') {
-          if(confirm('New Update available! Reload to update?')) {
-            newSW.postMessage({'type': 'SKIP_WAITING'});
+      newSW?.addEventListener("statechange", () => {
+        if (newSW.state === "installed") {
+          if (confirm("New Update available! Reload to update?")) {
+            newSW.postMessage({ type: "SKIP_WAITING" });
             window.location.reload();
           }
         }
-      })
-    })
+      });
+    });
   }
 
   let hideHeader = false;
@@ -85,535 +97,738 @@ async function detectSWUpdate() {
   $: {
     const currentPath = $page.url.pathname;
 
-    if (currentPath.startsWith('/etf/etf-providers') || currentPath.startsWith('/etf/new-launches')) {
+    if (
+      currentPath.startsWith("/etf/etf-providers") ||
+      currentPath.startsWith("/etf/new-launches")
+    ) {
       hideHeader = false; // Show the header for "/etf/etf-providers"
-    } else if (currentPath.startsWith('/etf/')) {
+    } else if (currentPath.startsWith("/etf/")) {
       hideHeader = true; // Hide the header for other routes under "/etf/"
-    }  else if (currentPath.startsWith('/crypto/')) {
+    } else if (currentPath.startsWith("/crypto/")) {
       hideHeader = true; // Hide the header for other routes under "/etf/"
     } else {
       // Specify conditions for other routes where you want to hide the header
-      hideHeader = currentPath.startsWith('/community/post') || currentPath.startsWith('/stocks/');
+      hideHeader =
+        currentPath.startsWith("/community/post") ||
+        currentPath.startsWith("/stocks/");
     }
   }
 
-  $: hideFooter = $page.url.pathname.startsWith('/dark-pool-flow') || $page.url.pathname.startsWith('/options-flow') ||   $page.url.pathname.startsWith('/options-zero-dte') || $page.url.pathname.startsWith('/login') || $page.url.pathname.startsWith('/register') || $page.url.pathname.startsWith('/etf') || $page.url.pathname.startsWith('/stock-splits-calendar') || $page.url.pathname.startsWith('/dividends-calendar') || $page.url.pathname.startsWith('/earnings-calendar') || $page.url.pathname.startsWith('/market-mover') || $page.url.pathname.startsWith('/market-news') || $page.url.pathname.startsWith('/portfolio') || $page.url.pathname.startsWith('/hedge-funds') || $page.url.pathname.startsWith('/watchlist') || $page.url.pathname.startsWith('/stocks') || $page.url.pathname.startsWith('/community') || $page.url.pathname.startsWith('/stock-screener') || $page.url.pathname.startsWith('/price-alert');
+  $: hideFooter =
+    $page.url.pathname.startsWith("/dark-pool-flow") ||
+    $page.url.pathname.startsWith("/options-flow") ||
+    $page.url.pathname.startsWith("/options-zero-dte") ||
+    $page.url.pathname.startsWith("/login") ||
+    $page.url.pathname.startsWith("/register") ||
+    $page.url.pathname.startsWith("/etf") ||
+    $page.url.pathname.startsWith("/stock-splits-calendar") ||
+    $page.url.pathname.startsWith("/dividends-calendar") ||
+    $page.url.pathname.startsWith("/earnings-calendar") ||
+    $page.url.pathname.startsWith("/market-mover") ||
+    $page.url.pathname.startsWith("/market-news") ||
+    $page.url.pathname.startsWith("/portfolio") ||
+    $page.url.pathname.startsWith("/hedge-funds") ||
+    $page.url.pathname.startsWith("/watchlist") ||
+    $page.url.pathname.startsWith("/stocks") ||
+    $page.url.pathname.startsWith("/community") ||
+    $page.url.pathname.startsWith("/stock-screener") ||
+    $page.url.pathname.startsWith("/price-alert");
 
   //$: hideSidebar = $page.url.pathname.startsWith('/contact') || $page.url.pathname.startsWith('/imprint') || $page.url.pathname.startsWith('/privacy-policy') || $page.url.pathname.startsWith('/terms-of-use') || $page.url.pathname.startsWith('/about') || $page.url.pathname.startsWith('/community/create-post') || $page.url.pathname.startsWith('/login') || $page.url.pathname.startsWith('/register')
 
- 
   let hasUnreadElement = false;
   let notificationList = [];
 
-
-//Define web workers:
-let syncWorker: Worker | undefined = undefined;
-// Handling messages from the worker
-const handleMessage = (event) => {
+  //Define web workers:
+  let syncWorker: Worker | undefined = undefined;
+  // Handling messages from the worker
+  const handleMessage = (event) => {
     const output = event.data?.output;
-    notificationList = output?.notificationList
+    notificationList = output?.notificationList;
     hasUnreadElement = output?.hasUnreadElement;
     //const unreadNotificationList = output?.unreadNotificationList;
     $numberOfUnreadNotification = output?.numberOfUnreadNotification;
     //pushNotification()
+  };
 
-};
-
-/*
+  /*
 const handleTwitchMessage = (event) => {
     const output = event.data?.output;
    $twitchStatus = output?.twitchStatus;
 };
 */
 
+  const loadWorker = async () => {
+    if ("serviceWorker" in navigator) {
+      const SyncWorker = await import("$lib/workers/notificationWorker?worker");
+      syncWorker = new SyncWorker.default();
+      syncWorker.postMessage({ message: { userId: data?.user?.id } });
+      syncWorker.onmessage = handleMessage;
+    } else {
+      // Fallback logic here
+      await fallbackWorker();
+    }
+  };
 
-const loadWorker = async () => {
+  async function fallbackWorker() {
+    // Implement fallback logic here, e.g., using timers or other techniques
+    console.log("Fallback worker activated");
 
-  if ('serviceWorker' in navigator) {
-  const SyncWorker = await import('$lib/workers/notificationWorker?worker');
-  syncWorker = new SyncWorker.default();
-  syncWorker.postMessage({ message: {'userId': data?.user?.id }});
-  syncWorker.onmessage = handleMessage;
-  } else {
-    // Fallback logic here
-    await fallbackWorker();
-  }
-  
-
-};
-
-async function fallbackWorker() {
-  // Implement fallback logic here, e.g., using timers or other techniques
-  console.log('Fallback worker activated');
-
-  const postData = {'userId': data?.user?.id};
-    const response = await fetch('/api/get-notifications', {
-        method: 'POST',
-        headers: {
-        "Content-Type": "application/json"
-        },
-        body: JSON.stringify(postData)
+    const postData = { userId: data?.user?.id };
+    const response = await fetch("/api/get-notifications", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify(postData),
     });
 
-    notificationList  = (await response.json())?.items;
+    notificationList = (await response.json())?.items;
     hasUnreadElement = notificationList?.length !== 0 ? true : false;
-    $numberOfUnreadNotification = notificationList?.length
-
-}
-
-
-
-let Cookie;
-$showCookieConsent = typeof data?.cookieConsent !== 'undefined' ? false : true;
-
-onMount(async () => {
-  //await fallbackWorker();
-  await loadWorker();
-  //await pushNotification()
-    
-  if($showCookieConsent === true) {
-      Cookie = (await import("$lib/components/Cookie.svelte")).default;
+    $numberOfUnreadNotification = notificationList?.length;
   }
 
-  //Clear all the cache every 20 min
-  const interval = setInterval(() => {
-      clearCache();
-    }, 20 * 60 * 1000);
+  let Cookie;
+  $showCookieConsent =
+    typeof data?.cookieConsent !== "undefined" ? false : true;
+
+  onMount(async () => {
+    //await fallbackWorker();
+    await loadWorker();
+    //await pushNotification()
+
+    if ($showCookieConsent === true) {
+      Cookie = (await import("$lib/components/Cookie.svelte")).default;
+    }
+
+    //Clear all the cache every 20 min
+    const interval = setInterval(
+      () => {
+        clearCache();
+      },
+      20 * 60 * 1000,
+    );
 
     return () => clearInterval(interval);
-    
-})
+  });
 
-onDestroy( () => {
-  clearCache()
-})
+  onDestroy(() => {
+    clearCache();
+  });
 
-beforeNavigate(async () => {
-      NProgress.start();
-   });
+  beforeNavigate(async () => {
+    NProgress.start();
+  });
 
-afterNavigate(async () => {
-      NProgress.done();
-   });
+  afterNavigate(async () => {
+    NProgress.done();
+  });
 
-
-//Delete cached Posts when going to other directories
-$: {
-  if( $page.url.pathname === '/community' || $page.url.pathname.startsWith('/community/post') )
-  {
+  //Delete cached Posts when going to other directories
+  $: {
+    if (
+      $page.url.pathname === "/community" ||
+      $page.url.pathname.startsWith("/community/post")
+    ) {
+    } else {
+      $cachedPosts = [];
+      $currentPagePosition = 0;
+    }
   }
-  else {
-    $cachedPosts = [];
-    $currentPagePosition = 0;
+
+  $: {
+    if ($page.url.pathname) {
+      $loginData = data?.user;
+      //data.currentPath = $page.url.pathname
+    }
   }
-}
 
+  let innerWidth;
 
-$: {
-  if($page.url.pathname)
-  {
-    $loginData = data?.user;
-    //data.currentPath = $page.url.pathname
-  }
-}
-
-
-let innerWidth;
-
-
-
-
-$: {
+  $: {
     if ($stockTicker && !$clientSideCache[$stockTicker]) {
       $clientSideCache[$stockTicker] = {};
     }
-}
+  }
 
-$: {
+  $: {
     if ($etfTicker && !$clientSideCache[$etfTicker]) {
       $clientSideCache[$etfTicker] = {};
     }
-}
-
-$: {
-  if($newAvatar?.length !== 0)
-  {
-    data.user.avatar = $newAvatar;
-    $newAvatar = '';
   }
-}
 
-
-$: {
-  if(innerWidth)
-  {
-    $screenWidth = innerWidth
+  $: {
+    if ($newAvatar?.length !== 0) {
+      data.user.avatar = $newAvatar;
+      $newAvatar = "";
+    }
   }
-}
-
 
+  $: {
+    if (innerWidth) {
+      $screenWidth = innerWidth;
+    }
+  }
 </script>
 
-<svelte:window bind:innerWidth/>
-
-<svelte:options immutable = {true} />
-
+<svelte:window bind:innerWidth />
 
 <div class="app {$page?.url?.pathname === '/' ? 'bg-[#000]' : ''}">
-
-
-
-
-
-<div class="flex min-h-screen w-full flex-col bg-[#09090B]">
-
-  <div class="w-full ">
-    <div class="w-full navbar sticky {$screenWidth < 640 && hideHeader ? 'invisible -mt-20' : ''} top-0 z-40 bg-[#09090B] border-b border-gray-800 flex h-14 items-center gap-4 px-4 sm:h-auto sm:px-6">
-        
-          <Sheet.Root >
-            <Sheet.Trigger asChild let:builder>
-              <Button builders={[builder]} size="icon" class="bg-[#09090B] text-white sm:hover:bg-[#27272A] border-none">
-                <Menu class="h-5.5 w-5.5 sm:w-7 sm:h-7" />
-                <span class="sr-only">Toggle Menu</span>
-              </Button>
-            </Sheet.Trigger>
-            <Sheet.Content side="left" class="max-w-screen w-full sm:max-w-xs bg-[#141417] overflow-y-auto text-white">
-              <nav class=" grid gap-6 text-lg font-medium bg-[#141417]">
-                <a
-                href="/"
-                class="flex items-center gap-4 px-0.5 text-white"
-              >
-              <img class="avatar w-9 sm:w-10 rounded-full" src={cloudFrontUrl+"/assets/stocknear_logo.png"} />
+  <div class="flex min-h-screen w-full flex-col bg-[#09090B]">
+    <div class="w-full">
+      <div
+        class="w-full navbar sticky {$screenWidth < 640 && hideHeader
+          ? 'invisible -mt-20'
+          : ''} top-0 z-40 bg-[#09090B] border-b border-gray-800 flex h-14 items-center gap-4 px-4 sm:h-auto sm:px-6"
+      >
+        <Sheet.Root>
+          <Sheet.Trigger asChild let:builder>
+            <Button
+              builders={[builder]}
+              size="icon"
+              class="bg-[#09090B] text-white sm:hover:bg-[#27272A] border-none"
+            >
+              <Menu class="h-5.5 w-5.5 sm:w-7 sm:h-7" />
+              <span class="sr-only">Toggle Menu</span>
+            </Button>
+          </Sheet.Trigger>
+          <Sheet.Content
+            side="left"
+            class="max-w-screen w-full sm:max-w-xs bg-[#141417] overflow-y-auto text-white"
+          >
+            <nav class=" grid gap-6 text-lg font-medium bg-[#141417]">
+              <a href="/" class="flex items-center gap-4 px-0.5 text-white">
+                <img
+                  class="avatar w-9 sm:w-10 rounded-full"
+                  src={cloudFrontUrl + "/assets/stocknear_logo.png"}
+                />
                 Stocknear
               </a>
-    
+
               <Sheet.Close asChild let:builder>
-                <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417] -ml-4 mr-auto">
-                  <a href="/" class="w-full flex flex-row items-center mr-auto mt-5 ">
-                    <div class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8">
-                      <Home class="h-5.5 w-5.5" />  
+                <Button
+                  builders={[builder]}
+                  type="submit"
+                  class="w-full bg-[#141417] hover:bg-[#141417] -ml-4 mr-auto"
+                >
+                  <a
+                    href="/"
+                    class="w-full flex flex-row items-center mr-auto mt-5"
+                  >
+                    <div
+                      class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
+                    >
+                      <Home class="h-5.5 w-5.5" />
                     </div>
                     <span class="ml-3 text-white text-[1rem]">Home</span>
                   </a>
                 </Button>
               </Sheet.Close>
-              
-              
-              <div class="flex flex-row items-center w-full">
-    
-                <Accordion.Root class="w-full">
-      
-                  <Accordion.Item value="item-1">
-      
-                    <Accordion.Trigger class="">
-                      <Stock class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                      <span class="text-white ml-1 mr-auto">Stocks</span>
-                    </Accordion.Trigger>
-                    <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-                      <Sheet.Close asChild let:builder>
-                        <div class="flex flex-col items-start">
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/analysts" class="text-start w-full text-[1rem] text-white ml-4 mt-2">Top Analyst</a>
-                          </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/analysts/top-stocks" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Top Analyst Stocks</a>
-                          </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/most-shorted-stocks" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Top Shorted Stocks</a>
-                          </Button>
-                          
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/industry" class="text-start w-full text-[1rem] text-white ml-4 mt-4">By Industry</a>
-                          </Button>
-                          
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/stock-screener" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Stock Screener</a>
-                          </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/market-mover" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Market Mover</a>
-                          </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/heatmaps" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Heatmaps</a>
-                          </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/list" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Stock Lists</a>
-                          </Button>
-                        </div>
-    
-                      </Sheet.Close>
-                      
-                    </Accordion.Content
-                    >
-                  </Accordion.Item>
-                </Accordion.Root>
-                        
-              </div>
-    
-              <div class="flex flex-row items-center w-full">
-    
-                <Accordion.Root class="w-full">
-      
-                  <Accordion.Item value="item-1">
-      
-                    <Accordion.Trigger class="">
-                      <Layers class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                      <span class="text-white ml-1 mr-auto">ETFs</span>
-                    </Accordion.Trigger>
-                    <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-    
-                      <Sheet.Close asChild let:builder>
-                        <div class="flex flex-col items-start">
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/etf/new-launches" class="text-start w-full text-[1rem] text-white ml-4 mt-2">New Launches</a>
-                          </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/etf/etf-providers" class="text-start w-full text-[1rem] text-white ml-4 mt-4">ETF Providers</a>
-                          </Button>
-                        </div>
-    
-                      </Sheet.Close>
-    
-                      
-                    </Accordion.Content
-                    >
-                  </Accordion.Item>
-                </Accordion.Root>
-                        
-              </div>
-    
-              <div class="flex flex-row items-center w-full">
-    
-                <Accordion.Root class="w-full">
-      
-                  <Accordion.Item value="item-1">
-      
-                    <Accordion.Trigger class="">
-                      <Calendar class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                      <span class="text-white ml-1 mr-auto">Calendar</span>
-                    </Accordion.Trigger>
-                    <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-    
-                      <Sheet.Close asChild let:builder>
-                        <div class="flex flex-col items-start">
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/dividends-calendar" class="text-start w-full text-[1rem] text-white ml-4 mt-2">Dividends Calendar</a>
-                          </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/earnings-calendar" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Earnings Calendar</a>
-                          </Button>
-                          <!--
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/fda-calendar" class="text-start w-full text-[1rem] text-white ml-4 mt-4">FDA Calendar</a>
-                          </Button>
-                          -->
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/ipos/2024" class="text-start w-full text-[1rem] text-white ml-4 mt-4">IPO Calendar</a>
-                          </Button>
-                          <!--
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/fda-calendar" class="text-start w-full text-[1rem] text-white ml-4 mt-4">FDA Calendar</a>
-                          </Button>
-                          -->
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/economic-calendar" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Economic Calendar</a>
-                          </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/stock-splits-calendar" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Stock Splits Calendar</a>
-                          </Button>
-                        </div>
-    
-                      </Sheet.Close>
-    
-                      
-                    </Accordion.Content
-                    >
-                  </Accordion.Item>
-                </Accordion.Root>
-                        
-              </div>
-    
 
               <div class="flex flex-row items-center w-full">
-    
                 <Accordion.Root class="w-full">
-      
                   <Accordion.Item value="item-1">
-      
                     <Accordion.Trigger class="">
-                      <HandShake class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                      <span class="text-white ml-1 mr-auto">Congress</span>
+                      <Stock class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                      <span class="text-white ml-1 mr-auto">Stocks</span>
                     </Accordion.Trigger>
-                    <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-    
+                    <Accordion.Content
+                      class="border-l border-gray-500 ml-2 mt-5"
+                    >
                       <Sheet.Close asChild let:builder>
                         <div class="flex flex-col items-start">
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/politicians/flow-data" class="text-start w-full text-[1rem] text-white ml-4 mt-2">Congress Flow</a>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/analysts"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-2"
+                              >Top Analyst</a
+                            >
                           </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/politicians" class="text-start w-full text-[1rem] text-white ml-4 mt-4">All Politicians</a>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/analysts/top-stocks"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Top Analyst Stocks</a
+                            >
+                          </Button>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/most-shorted-stocks"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Top Shorted Stocks</a
+                            >
+                          </Button>
+
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/industry"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >By Industry</a
+                            >
+                          </Button>
+
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/stock-screener"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Stock Screener</a
+                            >
+                          </Button>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/market-mover"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Market Mover</a
+                            >
+                          </Button>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/heatmaps"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Heatmaps</a
+                            >
+                          </Button>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/list"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Stock Lists</a
+                            >
                           </Button>
                         </div>
-    
                       </Sheet.Close>
-    
-                      
-                    </Accordion.Content
-                    >
+                    </Accordion.Content>
                   </Accordion.Item>
                 </Accordion.Root>
-                        
               </div>
-    
+
               <div class="flex flex-row items-center w-full">
-    
                 <Accordion.Root class="w-full">
-      
                   <Accordion.Item value="item-1">
-      
                     <Accordion.Trigger class="">
-                      <AudioLine class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                      <span class="text-white ml-1 mr-auto">Tracker Datasets</span>
+                      <Layers class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                      <span class="text-white ml-1 mr-auto">ETFs</span>
                     </Accordion.Trigger>
-                    <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-    
+                    <Accordion.Content
+                      class="border-l border-gray-500 ml-2 mt-5"
+                    >
                       <Sheet.Close asChild let:builder>
                         <div class="flex flex-col items-start">
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/etf/new-launches"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-2"
+                              >New Launches</a
+                            >
+                          </Button>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/etf/etf-providers"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >ETF Providers</a
+                            >
+                          </Button>
+                        </div>
+                      </Sheet.Close>
+                    </Accordion.Content>
+                  </Accordion.Item>
+                </Accordion.Root>
+              </div>
+
+              <div class="flex flex-row items-center w-full">
+                <Accordion.Root class="w-full">
+                  <Accordion.Item value="item-1">
+                    <Accordion.Trigger class="">
+                      <Calendar class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                      <span class="text-white ml-1 mr-auto">Calendar</span>
+                    </Accordion.Trigger>
+                    <Accordion.Content
+                      class="border-l border-gray-500 ml-2 mt-5"
+                    >
+                      <Sheet.Close asChild let:builder>
+                        <div class="flex flex-col items-start">
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/dividends-calendar"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-2"
+                              >Dividends Calendar</a
+                            >
+                          </Button>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/earnings-calendar"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Earnings Calendar</a
+                            >
+                          </Button>
+                          <!--
                           <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/cramer-tracker" class="text-start w-full text-[1rem] text-white ml-4 mt-2">Jim Cramer Tracker</a>
+                            <a href="/fda-calendar" class="text-start w-full text-[1rem] text-white ml-4 mt-4">FDA Calendar</a>
+                          </Button>
+                          -->
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/ipos/2024"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >IPO Calendar</a
+                            >
+                          </Button>
+                          <!--
+                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
+                            <a href="/fda-calendar" class="text-start w-full text-[1rem] text-white ml-4 mt-4">FDA Calendar</a>
+                          </Button>
+                          -->
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/economic-calendar"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Economic Calendar</a
+                            >
+                          </Button>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/stock-splits-calendar"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Stock Splits Calendar</a
+                            >
+                          </Button>
+                        </div>
+                      </Sheet.Close>
+                    </Accordion.Content>
+                  </Accordion.Item>
+                </Accordion.Root>
+              </div>
+
+              <div class="flex flex-row items-center w-full">
+                <Accordion.Root class="w-full">
+                  <Accordion.Item value="item-1">
+                    <Accordion.Trigger class="">
+                      <HandShake class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                      <span class="text-white ml-1 mr-auto">Congress</span>
+                    </Accordion.Trigger>
+                    <Accordion.Content
+                      class="border-l border-gray-500 ml-2 mt-5"
+                    >
+                      <Sheet.Close asChild let:builder>
+                        <div class="flex flex-col items-start">
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/politicians/flow-data"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-2"
+                              >Congress Flow</a
+                            >
+                          </Button>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/politicians"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >All Politicians</a
+                            >
+                          </Button>
+                        </div>
+                      </Sheet.Close>
+                    </Accordion.Content>
+                  </Accordion.Item>
+                </Accordion.Root>
+              </div>
+
+              <div class="flex flex-row items-center w-full">
+                <Accordion.Root class="w-full">
+                  <Accordion.Item value="item-1">
+                    <Accordion.Trigger class="">
+                      <AudioLine class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                      <span class="text-white ml-1 mr-auto"
+                        >Tracker Datasets</span
+                      >
+                    </Accordion.Trigger>
+                    <Accordion.Content
+                      class="border-l border-gray-500 ml-2 mt-5"
+                    >
+                      <Sheet.Close asChild let:builder>
+                        <div class="flex flex-col items-start">
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/cramer-tracker"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-2"
+                              >Jim Cramer Tracker</a
+                            >
                           </Button>
                           <!--
                           <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
                             <a href="/most-retail-volume" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Retail Trader Tracker</a>
                           </Button>
                           -->
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/reddit-tracker" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Reddit Tracker</a>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/reddit-tracker"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Reddit Tracker</a
+                            >
                           </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/corporate-lobbying-tracker" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Lobbying Tracker</a>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/corporate-lobbying-tracker"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Lobbying Tracker</a
+                            >
                           </Button>
-                          <Button builders={[builder]} type="submit" class="w-full bg-[#141417] hover:bg-[#141417]">
-                            <a href="/sentiment-tracker" class="text-start w-full text-[1rem] text-white ml-4 mt-4">Sentiment Tracker</a>
+                          <Button
+                            builders={[builder]}
+                            type="submit"
+                            class="w-full bg-[#141417] hover:bg-[#141417]"
+                          >
+                            <a
+                              href="/sentiment-tracker"
+                              class="text-start w-full text-[1rem] text-white ml-4 mt-4"
+                              >Sentiment Tracker</a
+                            >
                           </Button>
                         </div>
-    
                       </Sheet.Close>
-    
-                      
-                    </Accordion.Content
-                    >
+                    </Accordion.Content>
                   </Accordion.Item>
                 </Accordion.Root>
-                        
               </div>
-    
-              
-    
-             <Sheet.Close asChild let:builder>
-              <Button builders={[builder]} type="submit" class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full">
-                <a href="/options-flow" class="flex flex-row items-center w-full -mt-2"> 
-                      <div class="flex flex-row items-center mr-auto">
-                        <div class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8">
-                           <Option class="h-5.5 w-5.5"/>  
-                        </div>
-                        <span class="ml-3 text-white text-[1rem]">Options Flow</span>
-                      </div>
-                </a>
-              </Button>
-            </Sheet.Close>  
-              
-            <Sheet.Close asChild let:builder>
-              <Button builders={[builder]} type="submit" class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full">
-                <a href="/hedge-funds" class="flex flex-row items-center w-full -mt-2"> 
-                      <div class="flex flex-row items-center mr-auto">
-                        <div class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8">
-                          <Boxes class="h-5.5 w-5.5" />  
-                        </div>
-                        <span class="ml-3 text-white text-[1rem]">Hedge Funds</span>
-                      </div>
-                </a>
-              </Button>
-            </Sheet.Close>  
-    
-            <Sheet.Close asChild let:builder>
-              <Button builders={[builder]} type="submit" class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full">
-                <a href="/market-news" class="flex flex-row items-center w-full -mt-2"> 
-                      <div class="flex flex-row items-center mr-auto">
-                        <div class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8">
-                          <Newspaper class="h-5.5 w-5.5" />  
-                        </div>
-                        <span class="ml-3 text-white text-[1rem]">News</span>
-                      </div>
-                </a>
-              </Button>
-            </Sheet.Close>  
-            
-            <Sheet.Close asChild let:builder>
-              <Button builders={[builder]} type="submit" class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full">
-                <a href="/community" class="flex flex-row items-center w-full -mt-2"> 
-                      <div class="flex flex-row items-center mr-auto">
-                        <div class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8">
-                          <MessageCircle class="h-5.5 w-5.5" />  
-                        </div>
-                        <span class="ml-3 text-white text-[1rem]">Community</span>
-                      </div>
-                </a>
-              </Button>
-            </Sheet.Close>
 
-            <Sheet.Close asChild let:builder>
-              <Button builders={[builder]} type="submit" class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full">
-                <a href="/pricing" class="flex flex-row items-center w-full -mt-2"> 
-                      <div class="flex flex-row items-center mr-auto">
-                        <div class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8">
-                          <Gem class="h-5.5 w-5.5" />  
-                        </div>
-                        <span class="ml-3 text-white text-[1rem]">Pricing</span>
-                      </div>
-                </a>
-              </Button>
-            </Sheet.Close>
-    
-    
-              </nav>
-    
-              {#if !data?.user || data?.user?.tier === 'Free' || data?.user?.freeTrial === true}
-              <div class="pt-10 w-full mb-5 m-auto sticky">
-                <Card.Root
+              <Sheet.Close asChild let:builder>
+                <Button
+                  builders={[builder]}
+                  type="submit"
+                  class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full"
                 >
+                  <a
+                    href="/options-flow"
+                    class="flex flex-row items-center w-full -mt-2"
+                  >
+                    <div class="flex flex-row items-center mr-auto">
+                      <div
+                        class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
+                      >
+                        <Option class="h-5.5 w-5.5" />
+                      </div>
+                      <span class="ml-3 text-white text-[1rem]"
+                        >Options Flow</span
+                      >
+                    </div>
+                  </a>
+                </Button>
+              </Sheet.Close>
+
+              <Sheet.Close asChild let:builder>
+                <Button
+                  builders={[builder]}
+                  type="submit"
+                  class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full"
+                >
+                  <a
+                    href="/hedge-funds"
+                    class="flex flex-row items-center w-full -mt-2"
+                  >
+                    <div class="flex flex-row items-center mr-auto">
+                      <div
+                        class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
+                      >
+                        <Boxes class="h-5.5 w-5.5" />
+                      </div>
+                      <span class="ml-3 text-white text-[1rem]"
+                        >Hedge Funds</span
+                      >
+                    </div>
+                  </a>
+                </Button>
+              </Sheet.Close>
+
+              <Sheet.Close asChild let:builder>
+                <Button
+                  builders={[builder]}
+                  type="submit"
+                  class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full"
+                >
+                  <a
+                    href="/market-news"
+                    class="flex flex-row items-center w-full -mt-2"
+                  >
+                    <div class="flex flex-row items-center mr-auto">
+                      <div
+                        class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
+                      >
+                        <Newspaper class="h-5.5 w-5.5" />
+                      </div>
+                      <span class="ml-3 text-white text-[1rem]">News</span>
+                    </div>
+                  </a>
+                </Button>
+              </Sheet.Close>
+
+              <Sheet.Close asChild let:builder>
+                <Button
+                  builders={[builder]}
+                  type="submit"
+                  class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full"
+                >
+                  <a
+                    href="/community"
+                    class="flex flex-row items-center w-full -mt-2"
+                  >
+                    <div class="flex flex-row items-center mr-auto">
+                      <div
+                        class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
+                      >
+                        <MessageCircle class="h-5.5 w-5.5" />
+                      </div>
+                      <span class="ml-3 text-white text-[1rem]">Community</span>
+                    </div>
+                  </a>
+                </Button>
+              </Sheet.Close>
+
+              <Sheet.Close asChild let:builder>
+                <Button
+                  builders={[builder]}
+                  type="submit"
+                  class="bg-[#141417] hover:bg-[#141417] -ml-4 w-full"
+                >
+                  <a
+                    href="/pricing"
+                    class="flex flex-row items-center w-full -mt-2"
+                  >
+                    <div class="flex flex-row items-center mr-auto">
+                      <div
+                        class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
+                      >
+                        <Gem class="h-5.5 w-5.5" />
+                      </div>
+                      <span class="ml-3 text-white text-[1rem]">Pricing</span>
+                    </div>
+                  </a>
+                </Button>
+              </Sheet.Close>
+            </nav>
+
+            {#if !data?.user || data?.user?.tier === "Free" || data?.user?.freeTrial === true}
+              <div class="pt-10 w-full mb-5 m-auto sticky">
+                <Card.Root>
                   <Card.Header class="p-4">
                     <Card.Title>Upgrade to Pro</Card.Title>
                     <Card.Description>
-                      {#if !data?.user || data?.user?.tier !== 'Pro' || data?.user?.freeTrial === true}
-                       Get unlimit access to all features
+                      {#if !data?.user || data?.user?.tier !== "Pro" || data?.user?.freeTrial === true}
+                        Get unlimit access to all features
                       {/if}
                     </Card.Description>
                   </Card.Header>
                   <Card.Content class="p-4 pt-0">
                     <Sheet.Close asChild let:builder>
-                      <Button on:click={() => goto('/pricing')} builders={[builder]} type="submit" size="sm" class="w-full bg-white hover:bg-white/80">
-                        <span class="flex flex-row items-center text-black font-semibold text-center">
+                      <Button
+                        on:click={() => goto("/pricing")}
+                        builders={[builder]}
+                        type="submit"
+                        size="sm"
+                        class="w-full bg-white hover:bg-white/80"
+                      >
+                        <span
+                          class="flex flex-row items-center text-black font-semibold text-center"
+                        >
                           Become Pro
                         </span>
                       </Button>
-                  </Sheet.Close>
+                    </Sheet.Close>
                   </Card.Content>
                 </Card.Root>
               </div>
-              {/if}
-    
-            </Sheet.Content>
-          </Sheet.Root>
-          
-          <a href="/" class="-ml-2 flex flex-shrink-0">
-            <img class="avatar w-9 3xl:w-10 rounded-full" src={cloudFrontUrl+"/assets/stocknear_logo.png"} />
-            <span class="text-white font-semibold ml-2 text-lg">Stocknear</span>
-          </a>
-    
-          
-          <div class="relative ml-auto">
-            <!--
+            {/if}
+          </Sheet.Content>
+        </Sheet.Root>
+
+        <a href="/" class="-ml-2 flex flex-shrink-0">
+          <img
+            class="avatar w-9 3xl:w-10 rounded-full"
+            src={cloudFrontUrl + "/assets/stocknear_logo.png"}
+          />
+          <span class="text-white font-semibold ml-2 text-lg">Stocknear</span>
+        </a>
+
+        <div class="relative ml-auto">
+          <!--
             <Search class="absolute left-2.5 top-2.5 h-4 w-4 text-white" />
             <Input
               type="search"
@@ -622,17 +837,13 @@ $: {
               autocomplete="off"
               />
             -->
-            <Searchbar/>
-    
-            <NotificationBell 
-              data={data}
-              hasUnreadElement={hasUnreadElement}
-            />
-    
-          </div>
-    
-          {#if data?.user}
-          <DropdownMenu.Root >
+          <Searchbar />
+
+          <NotificationBell {data} {hasUnreadElement} />
+        </div>
+
+        {#if data?.user}
+          <DropdownMenu.Root>
             <DropdownMenu.Trigger asChild let:builder>
               <Button
                 size="icon"
@@ -640,9 +851,13 @@ $: {
                 builders={[builder]}
               >
                 <img
-                src={data?.user?.avatar
-                  ? getImageURL(data?.user.collectionId, data?.user.id, data?.user.avatar)
-                  : `https://avatar.vercel.sh/${data?.user?.username}`}
+                  src={data?.user?.avatar
+                    ? getImageURL(
+                        data?.user.collectionId,
+                        data?.user.id,
+                        data?.user.avatar,
+                      )
+                    : defaultAvatar}
                   width={36}
                   height={36}
                   alt="Avatar"
@@ -652,298 +867,366 @@ $: {
             </DropdownMenu.Trigger>
             <DropdownMenu.Content align="end">
               <DropdownMenu.Item class="sm:hover:bg-[#27272A]">
-                <a href="/community/profile">
-                  My Account
-                </a>
+                <a href="/community/profile"> My Account </a>
               </DropdownMenu.Item>
               <DropdownMenu.Separator />
               <DropdownMenu.Item class="sm:hover:bg-[#27272A]">
-                <a href="/watchlist/stocks">
-                  Watchlist
-                </a>
+                <a href="/watchlist/stocks"> Watchlist </a>
               </DropdownMenu.Item>
               <DropdownMenu.Item class="sm:hover:bg-[#27272A]">
-                <a href="/price-alert">
-                 Price Alert
-                </a>
+                <a href="/price-alert"> Price Alert </a>
               </DropdownMenu.Item>
               <DropdownMenu.Separator />
               <DropdownMenu.Item class="sm:hover:bg-[#27272A]">
                 <form class="cursor-pointer" action="/logout" method="POST">
                   <button type="submit" class="w-full text-start">
-                      <span class="text-start">Logout</span>
+                    <span class="text-start">Logout</span>
                   </button>
                 </form>
               </DropdownMenu.Item>
             </DropdownMenu.Content>
           </DropdownMenu.Root>
-          {:else}
-          <a href="/login" class="inline-flex items-center justify-center rounded-lg bg-purple-600 px-4 py-2 text-sm font-semibold text-white  shadow-sm transition-all duration-150 hover:bg-purple-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-600">
+        {:else}
+          <a
+            href="/login"
+            class="inline-flex items-center justify-center rounded-lg bg-purple-600 px-4 py-2 text-sm font-semibold text-white shadow-sm transition-all duration-150 hover:bg-purple-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-600"
+          >
             Login
           </a>
-          {/if}
-    
-       
-    </div>
-    <div>
-      <div class="flex w-full">
-        <div class="hidden 3xl:block 3xl:w-1/6">
-          <aside class="fixed overflow-y-scroll scroller overflow-hidden inset-y-0 left-0 z-50 3xl:flex w-72 flex-col 3xl:border-r 3xl:border-gray-800 bg-[#141417]">
-            <nav class="flex flex-col items-center mr-auto gap-y-4 3xl:py-5 w-full">
-              <a
-                href="/"
-                class="-ml-3 mb-5 flex justify-end items-center h-9 w-9 shrink-0 gap-2 rounded-full text-lg font-semibold text-primary-foreground md:h-10 md:w-10 md:text-base"
+        {/if}
+      </div>
+      <div>
+        <div class="flex w-full">
+          <div class="hidden 3xl:block 3xl:w-1/6">
+            <aside
+              class="fixed overflow-y-scroll scroller overflow-hidden inset-y-0 left-0 z-50 3xl:flex w-72 flex-col 3xl:border-r 3xl:border-gray-800 bg-[#141417]"
+            >
+              <nav
+                class="flex flex-col items-center mr-auto gap-y-4 3xl:py-5 w-full"
               >
-              <img class="avatar w-9 3xl:w-12 rounded-full" src={cloudFrontUrl+"/assets/stocknear_logo.png"} />
-                <span class="text-white text-xl">Stocknear</span>
-              </a>
-              
-              <a href="/" class="flex flex-row items-center ml-9 w-full">
-                <div class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8">
-                  <Home class="h-5.5 w-5.5" />  
-                </div>
-                <span class="ml-3 text-white">Home</span>
+                <a
+                  href="/"
+                  class="-ml-3 mb-5 flex justify-end items-center h-9 w-9 shrink-0 gap-2 rounded-full text-lg font-semibold text-primary-foreground md:h-10 md:w-10 md:text-base"
+                >
+                  <img
+                    class="avatar w-9 3xl:w-12 rounded-full"
+                    src={cloudFrontUrl + "/assets/stocknear_logo.png"}
+                  />
+                  <span class="text-white text-xl">Stocknear</span>
                 </a>
-        
-        
-                <div class="flex flex-row items-center ml-9 w-full mt-3">
-        
-                  <Accordion.Root class="w-full">
-        
-                    <Accordion.Item value="item-1">
-        
-                      <Accordion.Trigger class="text-white ">
-                        <Stock class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                        <span class="text-white ml-1 mr-auto">Stocks</span>
-                      </Accordion.Trigger>
-                      <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-                        <div class="flex flex-col items-start">
-                          <a href="/analysts" class="text-[1rem] text-white ml-4 mt-4">Top Analyst</a>
-                          <a href="/analysts/top-stocks" class="text-[1rem] text-white ml-4 mt-4">Top Analyst Stocks</a>
-                          <a href="/most-shorted-stocks" class="text-[1rem] text-white ml-4 mt-4">Top Shorted Stocks</a>
-                          <a href="/industry" class="text-[1rem] text-white ml-4 mt-4">By Industry</a>
-                          <a href="/stock-screener" class="text-[1rem] text-white ml-4 mt-4">Stock Screener</a>
-                          <a href="/market-mover" class="text-[1rem] text-white ml-4 mt-4">Market Mover</a>
-                          <a href="/heatmaps" class="text-[1rem] text-white ml-4 mt-4">Heatmaps</a>
-                          <a href="/list" class="text-[1rem] text-white ml-4 mt-4">Stock Lists</a>
-        
-                        </div>
-                        
-                      </Accordion.Content
-                      >
-                    </Accordion.Item>
-                  </Accordion.Root>
-                          
-                </div>
-               
-                <div class="flex flex-row items-center ml-9 w-full mt-3">
-        
-                  <Accordion.Root class="w-full">
-        
-                    <Accordion.Item value="item-1">
-        
-                      <Accordion.Trigger class="">
-                        <Layers class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                        <span class="text-white ml-1 mr-auto">ETFs</span>
-                      </Accordion.Trigger>
-                      <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-                        <div class="flex flex-col items-start">
-                          <a href="/etf/new-launches" class="text-[1rem] text-white ml-4 mt-4">New Launches</a>
-                          <a href="/etf/etf-providers" class="text-[1rem] text-white ml-4 mt-4">ETF Providers</a>
-                        </div>
-                        
-                      </Accordion.Content
-                      >
-                    </Accordion.Item>
-                  </Accordion.Root>
-                          
-                </div>
-        
-                <div class="flex flex-row items-center ml-9 w-full mt-3">
-        
-                  <Accordion.Root class="w-full">
-        
-                    <Accordion.Item value="item-1">
-        
-                      <Accordion.Trigger class="">
-                        <Calendar class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                        <span class="text-white ml-1 mr-auto">Calendar</span>
-                      </Accordion.Trigger>
-                      <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-                        <div class="flex flex-col items-start">
-                          <a href="/dividends-calendar" class="text-[1rem] text-white ml-4 mt-4">Dividends Calendar</a>
-                          <a href="/earnings-calendar" class="text-[1rem] text-white ml-4 mt-4">Earnings Calendar</a>
-                          <!--<a href="/fda-calendar" class="text-[1rem] text-white ml-4 mt-4">FDA Calendar</a>-->
-                          <a href="/ipos/2024" class="text-[1rem] text-white ml-4 mt-4">IPO Calendar</a>
-                          <a href="/economic-calendar" class="text-[1rem] text-white ml-4 mt-4">Economic Calendar</a>
-                          <a href="/stock-splits-calendar" class="text-[1rem] text-white ml-4 mt-4">Stock Splits Calendar</a>
-                        </div>
-                        
-                      </Accordion.Content
-                      >
-                    </Accordion.Item>
-                  </Accordion.Root>
-                          
-                </div>
-        
-        
-                <div class="flex flex-row items-center ml-9 w-full mt-3">
-        
-                  <Accordion.Root class="w-full">
-        
-                    <Accordion.Item value="item-1">
-        
-                      <Accordion.Trigger class="">
-                        <HandShake class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                        <span class="text-white ml-1 mr-auto">Congress</span>
-                      </Accordion.Trigger>
-                      
-                      <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-                        <div class="flex flex-col items-start">
-                          <div class="flex flex-col items-start">
-                            <a href="/politicians/flow-data" class="text-[1rem] text-white ml-4 mt-4">Congress Flow</a>
-                            <a href="/politicians" class="text-[1rem] text-white ml-4 mt-4">All Politicians</a>
-                          </div>
-                        </div>
-                        
-                      </Accordion.Content
-                      >
-                    </Accordion.Item>
-                  </Accordion.Root>
-                          
-                </div>
-        
-                <div class="flex flex-row items-center ml-9 w-full mt-3">
-        
-                  <Accordion.Root class="w-full">
-        
-                    <Accordion.Item value="item-1">
-        
-                      <Accordion.Trigger class="">
-                        <AudioLine class="h-5.5 w-5.5 mr-3 text-white ml-1"/>  
-                        <span class="text-white ml-1 mr-auto">Tracker Datasets</span>
-                      </Accordion.Trigger>
-                      <Accordion.Content class="border-l border-gray-500 ml-2 mt-5">
-                        <div class="flex flex-col items-start">
-                          <a href="/cramer-tracker" class="text-[1rem] text-white ml-4 mt-4">Jim Cramer Tracker</a>
-                          <!--<a href="/most-retail-volume" class="text-[1rem] text-white ml-4 mt-4">Retail Trader Tracker</a>-->
-                          <a href="/reddit-tracker" class="text-[1rem] text-white ml-4 mt-4">Reddit Tracker</a>
-                          <a href="/corporate-lobbying-tracker" class="text-[1rem] text-white ml-4 mt-4">Lobbying Tracker</a>
-                          <a href="/sentiment-tracker" class="text-[1rem] text-white ml-4 mt-4">Sentiment Tracker</a>
-                        </div>
-                        
-                      </Accordion.Content
-                      >
-                    </Accordion.Item>
-                  </Accordion.Root>
-                          
-                </div>
-        
-                <a href="/options-flow" class="flex flex-row items-center ml-9 w-full mt-3">
+
+                <a href="/" class="flex flex-row items-center ml-9 w-full">
                   <div
                     class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
                   >
-                    <Option class="h-5.5 w-5.5"/>  
-                    
+                    <Home class="h-5.5 w-5.5" />
+                  </div>
+                  <span class="ml-3 text-white">Home</span>
+                </a>
+
+                <div class="flex flex-row items-center ml-9 w-full mt-3">
+                  <Accordion.Root class="w-full">
+                    <Accordion.Item value="item-1">
+                      <Accordion.Trigger class="text-white ">
+                        <Stock class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                        <span class="text-white ml-1 mr-auto">Stocks</span>
+                      </Accordion.Trigger>
+                      <Accordion.Content
+                        class="border-l border-gray-500 ml-2 mt-5"
+                      >
+                        <div class="flex flex-col items-start">
+                          <a
+                            href="/analysts"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Top Analyst</a
+                          >
+                          <a
+                            href="/analysts/top-stocks"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Top Analyst Stocks</a
+                          >
+                          <a
+                            href="/most-shorted-stocks"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Top Shorted Stocks</a
+                          >
+                          <a
+                            href="/industry"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >By Industry</a
+                          >
+                          <a
+                            href="/stock-screener"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Stock Screener</a
+                          >
+                          <a
+                            href="/market-mover"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Market Mover</a
+                          >
+                          <a
+                            href="/heatmaps"
+                            class="text-[1rem] text-white ml-4 mt-4">Heatmaps</a
+                          >
+                          <a
+                            href="/list"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Stock Lists</a
+                          >
+                        </div>
+                      </Accordion.Content>
+                    </Accordion.Item>
+                  </Accordion.Root>
+                </div>
+
+                <div class="flex flex-row items-center ml-9 w-full mt-3">
+                  <Accordion.Root class="w-full">
+                    <Accordion.Item value="item-1">
+                      <Accordion.Trigger class="">
+                        <Layers class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                        <span class="text-white ml-1 mr-auto">ETFs</span>
+                      </Accordion.Trigger>
+                      <Accordion.Content
+                        class="border-l border-gray-500 ml-2 mt-5"
+                      >
+                        <div class="flex flex-col items-start">
+                          <a
+                            href="/etf/new-launches"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >New Launches</a
+                          >
+                          <a
+                            href="/etf/etf-providers"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >ETF Providers</a
+                          >
+                        </div>
+                      </Accordion.Content>
+                    </Accordion.Item>
+                  </Accordion.Root>
+                </div>
+
+                <div class="flex flex-row items-center ml-9 w-full mt-3">
+                  <Accordion.Root class="w-full">
+                    <Accordion.Item value="item-1">
+                      <Accordion.Trigger class="">
+                        <Calendar class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                        <span class="text-white ml-1 mr-auto">Calendar</span>
+                      </Accordion.Trigger>
+                      <Accordion.Content
+                        class="border-l border-gray-500 ml-2 mt-5"
+                      >
+                        <div class="flex flex-col items-start">
+                          <a
+                            href="/dividends-calendar"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Dividends Calendar</a
+                          >
+                          <a
+                            href="/earnings-calendar"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Earnings Calendar</a
+                          >
+                          <!--<a href="/fda-calendar" class="text-[1rem] text-white ml-4 mt-4">FDA Calendar</a>-->
+                          <a
+                            href="/ipos/2024"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >IPO Calendar</a
+                          >
+                          <a
+                            href="/economic-calendar"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Economic Calendar</a
+                          >
+                          <a
+                            href="/stock-splits-calendar"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Stock Splits Calendar</a
+                          >
+                        </div>
+                      </Accordion.Content>
+                    </Accordion.Item>
+                  </Accordion.Root>
+                </div>
+
+                <div class="flex flex-row items-center ml-9 w-full mt-3">
+                  <Accordion.Root class="w-full">
+                    <Accordion.Item value="item-1">
+                      <Accordion.Trigger class="">
+                        <HandShake class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                        <span class="text-white ml-1 mr-auto">Congress</span>
+                      </Accordion.Trigger>
+
+                      <Accordion.Content
+                        class="border-l border-gray-500 ml-2 mt-5"
+                      >
+                        <div class="flex flex-col items-start">
+                          <div class="flex flex-col items-start">
+                            <a
+                              href="/politicians/flow-data"
+                              class="text-[1rem] text-white ml-4 mt-4"
+                              >Congress Flow</a
+                            >
+                            <a
+                              href="/politicians"
+                              class="text-[1rem] text-white ml-4 mt-4"
+                              >All Politicians</a
+                            >
+                          </div>
+                        </div>
+                      </Accordion.Content>
+                    </Accordion.Item>
+                  </Accordion.Root>
+                </div>
+
+                <div class="flex flex-row items-center ml-9 w-full mt-3">
+                  <Accordion.Root class="w-full">
+                    <Accordion.Item value="item-1">
+                      <Accordion.Trigger class="">
+                        <AudioLine class="h-5.5 w-5.5 mr-3 text-white ml-1" />
+                        <span class="text-white ml-1 mr-auto"
+                          >Tracker Datasets</span
+                        >
+                      </Accordion.Trigger>
+                      <Accordion.Content
+                        class="border-l border-gray-500 ml-2 mt-5"
+                      >
+                        <div class="flex flex-col items-start">
+                          <a
+                            href="/cramer-tracker"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Jim Cramer Tracker</a
+                          >
+                          <!--<a href="/most-retail-volume" class="text-[1rem] text-white ml-4 mt-4">Retail Trader Tracker</a>-->
+                          <a
+                            href="/reddit-tracker"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Reddit Tracker</a
+                          >
+                          <a
+                            href="/corporate-lobbying-tracker"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Lobbying Tracker</a
+                          >
+                          <a
+                            href="/sentiment-tracker"
+                            class="text-[1rem] text-white ml-4 mt-4"
+                            >Sentiment Tracker</a
+                          >
+                        </div>
+                      </Accordion.Content>
+                    </Accordion.Item>
+                  </Accordion.Root>
+                </div>
+
+                <a
+                  href="/options-flow"
+                  class="flex flex-row items-center ml-9 w-full mt-3"
+                >
+                  <div
+                    class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
+                  >
+                    <Option class="h-5.5 w-5.5" />
                   </div>
                   <span class="ml-3 text-white">Options Flow</span>
                 </a>
-        
-                <a href="/hedge-funds" class="flex flex-row items-center ml-9 w-full mt-3">
+
+                <a
+                  href="/hedge-funds"
+                  class="flex flex-row items-center ml-9 w-full mt-3"
+                >
                   <div
                     class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
                   >
                     <Boxes class="h-5.5 w-5.5" />
-                    
                   </div>
                   <span class="ml-3 text-white">Hedge Funds</span>
                 </a>
-        
-                <a href="/market-news" class="flex flex-row items-center ml-9 w-full mt-3">
+
+                <a
+                  href="/market-news"
+                  class="flex flex-row items-center ml-9 w-full mt-3"
+                >
                   <div
                     class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
                   >
                     <Newspaper class="h-5.5 w-5.5" />
-                    
                   </div>
                   <span class="ml-3 text-white">News</span>
                 </a>
-        
-                <a href="/community" class="flex flex-row items-center ml-9 w-full mt-3">
+
+                <a
+                  href="/community"
+                  class="flex flex-row items-center ml-9 w-full mt-3"
+                >
                   <div
                     class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
                   >
                     <MessageCircle class="h-5.5 w-5.5" />
-                    
                   </div>
                   <span class="ml-3 text-white">Community</span>
                 </a>
 
-                <a href="/pricing" class="flex flex-row items-center ml-9 w-full mt-3">
+                <a
+                  href="/pricing"
+                  class="flex flex-row items-center ml-9 w-full mt-3"
+                >
                   <div
                     class="flex h-9 w-9 items-center justify-center rounded-lg text-white transition-colors hover:text-white md:h-8 md:w-8"
                   >
                     <Gem class="h-5.5 w-5.5" />
-                    
                   </div>
                   <span class="ml-3 text-white">Pricing</span>
                 </a>
-                    
-            </nav>
-            {#if !data?.user || data?.user?.tier === 'Free' || data?.user?.freeTrial === true}
-            <div class="mt-auto p-4 ">
-              <Card.Root
-                data-x-chunk-name="dashboard-02-chunk-0"
-                data-x-chunk-description="A card with a call to action"
-              >
-                <Card.Header class="p-2 pt-0 md:p-4">
-                  <Card.Title>Upgrade to Pro</Card.Title>
-                  <Card.Description>
-                    Get unlimit access to all features
-                  </Card.Description>
-                </Card.Header>
-                <Card.Content class="p-2 pt-0 md:p-4 md:pt-0">
-                  <a href="/pricing" class="flex justify-center items-center text-center rounded-lg text-sm py-2 m-auto text-center w-full bg-white text-black font-semibold hover:bg-white/80">
-                    Become Pro
-                  </a>
-                </Card.Content>
-              </Card.Root>
-            </div>
-            {/if}
-        
-          </aside>
+              </nav>
+              {#if !data?.user || data?.user?.tier === "Free" || data?.user?.freeTrial === true}
+                <div class="mt-auto p-4">
+                  <Card.Root
+                    data-x-chunk-name="dashboard-02-chunk-0"
+                    data-x-chunk-description="A card with a call to action"
+                  >
+                    <Card.Header class="p-2 pt-0 md:p-4">
+                      <Card.Title>Upgrade to Pro</Card.Title>
+                      <Card.Description>
+                        Get unlimit access to all features
+                      </Card.Description>
+                    </Card.Header>
+                    <Card.Content class="p-2 pt-0 md:p-4 md:pt-0">
+                      <a
+                        href="/pricing"
+                        class="flex justify-center items-center text-center rounded-lg text-sm py-2 m-auto text-center w-full bg-white text-black font-semibold hover:bg-white/80"
+                      >
+                        Become Pro
+                      </a>
+                    </Card.Content>
+                  </Card.Root>
+                </div>
+              {/if}
+            </aside>
+          </div>
+          <div class="w-full 3xl:w-5/6">
+            <main class="w-full overflow-y-auto bg-[#09090B] sm:p-4">
+              <slot />
+              <Toaster class="bg-[#1A1A27] text-white text-medium" />
+              {#if Cookie && $showCookieConsent === true}
+                <Cookie />
+              {/if}
+            </main>
+          </div>
         </div>
-        <div class="w-full 3xl:w-5/6">
-          <main class="w-full overflow-y-auto bg-[#09090B] sm:p-4">
-            <slot />
-            <Toaster class="bg-[#1A1A27] text-white text-medium"/>
-            {#if Cookie && $showCookieConsent === true}
-            <Cookie />
-            {/if}
-          </main>
-        </div>
-
+      </div>
+      <div>
+        {#if !hideFooter}
+          <Footer />
+        {/if}
       </div>
     </div>
-    <div>
-      {#if !hideFooter}
-      <Footer/>
-      {/if}
-    </div>
   </div>
-
 </div>
 
-</div>
-
-
-
 <style global lang="scss">
-
-.scroller {
+  .scroller {
     scrollbar-width: thin;
   }
-  
-
 </style>
-
diff --git a/src/routes/community/profile/+page.svelte b/src/routes/community/profile/+page.svelte
index b9c6b10c..35225fcc 100644
--- a/src/routes/community/profile/+page.svelte
+++ b/src/routes/community/profile/+page.svelte
@@ -8,6 +8,7 @@
   import { onMount, onDestroy } from 'svelte';
   import {getImageURL, addDays } from '$lib/utils';
   import {newAvatar, numberOfUnreadNotification, postIdDeleted } from '$lib/store';
+  import defaultAvatar from "$lib/images/default_avatar.png";
 
   import toast from 'svelte-french-toast';
 	import InfiniteLoading from '$lib/components/InfiniteLoading.svelte';
@@ -523,8 +524,8 @@ onDestroy(async () => {
                   hidden
                   on:change={showPreview}
                 />
-                <label for="avatar" class="avatar w-20 h-20 sm:w-24 sm:h-24 rounded-full hover:cursor-pointer">
-                  <label for="avatar" class="absolute z-10 -bottom-0.5 -right-0.5 hover:cursor-pointer">
+                <label for="avatar" class="avatar w-20 h-20 sm:w-24 sm:h-24 rounded-full sm:hover:cursor-pointer">
+                  <label for="avatar" class="absolute z-10 -bottom-0.5 -right-0.5 sm:hover:cursor-pointer">
                     <span class="btn btn-circle btn-sm btn-secondary">
                       <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 sm:w-6 sm:h-6" viewBox="0 0 24 24"><path fill="white" d="m14.06 9l.94.94L5.92 19H5v-.92L14.06 9m3.6-6c-.25 0-.51.1-.7.29l-1.83 1.83l3.75 3.75l1.83-1.83c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.2-.2-.45-.29-.71-.29m-3.6 3.19L3 17.25V21h3.75L17.81 9.94l-3.75-3.75Z"/></svg>
                     </span>
@@ -532,7 +533,7 @@ onDestroy(async () => {
                     <img style="clip-path: circle(50%);" class="w-24 bg-slate-300 border border-slate-400 rounded-full inline-block "
                     src={data?.user?.avatar
                         ? getImageURL(data?.user?.collectionId, data?.user?.id, data?.user?.avatar)
-                        : `https://avatar.vercel.sh/${data?.user?.username}`} 
+                        : defaultAvatar} 
                         alt="User avatar"
                         id="avatar-preview"
                       />
diff --git a/src/routes/community/user/[userId]/+page.svelte b/src/routes/community/user/[userId]/+page.svelte
index 4e35b626..8299d67a 100644
--- a/src/routes/community/user/[userId]/+page.svelte
+++ b/src/routes/community/user/[userId]/+page.svelte
@@ -1,417 +1,474 @@
-<script lang='ts'>
-    
-  import PostSection from '$lib/components/PostSection.svelte';
-  import SkeletonLoading from '$lib/components/SkeletonLoading.svelte';
+<script lang="ts">
+  import PostSection from "$lib/components/PostSection.svelte";
+  import SkeletonLoading from "$lib/components/SkeletonLoading.svelte";
 
+  import { onMount } from "svelte";
+  import { getImageURL } from "$lib/utils";
+  import { numberOfUnreadNotification } from "$lib/store";
+  import defaultAvatar from "$lib/images/default_avatar.png";
 
-  import { onMount} from 'svelte';
-  import {getImageURL } from '$lib/utils';
-  import {numberOfUnreadNotification } from '$lib/store';
-
-	import InfiniteLoading from '$lib/components/InfiniteLoading.svelte';
-
+  import InfiniteLoading from "$lib/components/InfiniteLoading.svelte";
 
   export let data;
   export let form;
-  
 
-  let userData = data?.getUserData
+  let userData = data?.getUserData;
 
-let userStats = data?.getUserStats ?? {'numberOfPosts': 0, 'numberOfComments': 0}
+  let userStats = data?.getUserStats ?? {
+    numberOfPosts: 0,
+    numberOfComments: 0,
+  };
 
   let moderators;
-  let showTab = 'post'
+  let showTab = "post";
   let isLoaded = false;
 
-
   let posts: any[] = [];
 
+  let currentPage = 1;
+  let postLoading = false;
+  let seenPostId = [];
 
+  let noPostMore = false;
 
-let currentPage = 1;
-let postLoading = false;
-let seenPostId = [];
+  async function infiniteHandler({ detail: { loaded, complete } }) {
+    // console.log("Page position:", window.pageYOffset);
+    seenPostId = posts.map((obj) => obj.id);
 
+    if (!postLoading && !noPostMore) {
+      postLoading = true;
 
-let noPostMore = false;
-
-
-
-async function infiniteHandler({ detail: { loaded, complete } }) 
-{
-
-  // console.log("Page position:", window.pageYOffset);
-  seenPostId = posts.map(obj => obj.id);
-
-  if (!postLoading && !noPostMore) {
-    postLoading = true;
-
-    const newPosts = await getPost();
-    if (newPosts.length === 0) {
-      noPostMore = true;
-      complete();
-    } else {
-      // Remove new posts with duplicate IDs
-      const filteredNewPosts = newPosts.filter((newPost) => !posts.find((post) => post.id === newPost.id));
-      posts = [...posts, ...filteredNewPosts];
-      currentPage++;
-      loaded();
+      const newPosts = await getPost();
+      if (newPosts.length === 0) {
+        noPostMore = true;
+        complete();
+      } else {
+        // Remove new posts with duplicate IDs
+        const filteredNewPosts = newPosts.filter(
+          (newPost) => !posts.find((post) => post.id === newPost.id),
+        );
+        posts = [...posts, ...filteredNewPosts];
+        currentPage++;
+        loaded();
+      }
+      postLoading = false;
     }
-    postLoading = false;
   }
 
-}
-
-
-  
-function isModerator(moderators) {
-    return moderators?.some(moderator => data?.userId === moderator?.expand?.user?.id);
+  function isModerator(moderators) {
+    return moderators?.some(
+      (moderator) => data?.userId === moderator?.expand?.user?.id,
+    );
   }
-  
 
+  async function getPost() {
+    const postData = {
+      startPage: currentPage,
+      seenPostId: seenPostId.length === 0 ? [] : seenPostId,
+      userId: data?.userId,
+      path: "get-post",
+    };
 
+    // Make the POST request to the endpoint
+    const response = await fetch("/api/fastify-post-data", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify(postData),
+    });
 
-async function getPost() {
+    const output = await response.json();
 
+    return output?.items;
+  }
 
-  const postData = {
-    startPage: currentPage,
-    seenPostId: seenPostId.length === 0 ? [] : seenPostId,
-    userId: data?.userId,
-    path: 'get-post'
-  };
+  let loading = true;
+  let LoginPopup;
 
-  // Make the POST request to the endpoint
-  const response = await fetch('/api/fastify-post-data', {
-    method: 'POST',
-    headers: {
-      "Content-Type": "application/json"
-    },
-    body: JSON.stringify(postData),
+  onMount(async () => {
+    window.scrollTo(0, 0);
+
+    [posts] = await Promise?.all([getPost()]);
+
+    if (!data?.userData) {
+      LoginPopup = (await import("$lib/components/LoginPopup.svelte")).default;
+    }
+
+    loading = false;
+    isLoaded = true;
   });
-
-
-  const output = await response.json();
-
-
-  return output?.items
-}
-
- let loading = true;
- let LoginPopup;
-
-onMount(async () => {
-
-  window.scrollTo(0, 0);
-
-  [posts] = await Promise?.all([
-      getPost(),
-    ]);
-
-    if(!data?.userData)
-  {
-    LoginPopup = (await import('$lib/components/LoginPopup.svelte')).default;
-  }
-
-  loading = false;
-  isLoaded = true;
-
-});
-
-
-
-
 </script>
-  
-
 
 <svelte:head>
-  <title> {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ''} {userData?.username} · stocknear</title>
+  <title>
+    {$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ""}
+    {userData?.username} · stocknear</title
+  >
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width" />
 
-  <meta name="description" content="Explore {userData?.username}'s latest posts, comments, and notebooks on stocknear. Discover new insights and connect with other users in the stocknear community.">
+  <meta
+    name="description"
+    content="Explore {userData?.username}'s latest posts, comments, and notebooks on stocknear. Discover new insights and connect with other users in the stocknear community."
+  />
   <!-- Other meta tags -->
-  <meta property="og:title" content="{userData?.username} · stocknear"/>
-  <meta property="og:description" content="Explore {userData?.username}'s latest posts, comments, and notebooks on stocknear. Discover new insights and connect with other users in the stocknear community.">
-  <meta property="og:type" content="website"/>
+  <meta property="og:title" content="{userData?.username} · stocknear" />
+  <meta
+    property="og:description"
+    content="Explore {userData?.username}'s latest posts, comments, and notebooks on stocknear. Discover new insights and connect with other users in the stocknear community."
+  />
+  <meta property="og:type" content="website" />
   <!-- Add more Open Graph meta tags as needed -->
 
   <!-- Twitter specific meta tags -->
-  <meta name="twitter:card" content="summary_large_image"/>
-  <meta name="twitter:title" content="{userData?.username} · stocknear"/>
-  <meta name="twitter:description" content="Explore {userData?.username}'s latest posts, comments, and notebooks on stocknear. Discover new insights and connect with other users in the stocknear community.">
+  <meta name="twitter:card" content="summary_large_image" />
+  <meta name="twitter:title" content="{userData?.username} · stocknear" />
+  <meta
+    name="twitter:description"
+    content="Explore {userData?.username}'s latest posts, comments, and notebooks on stocknear. Discover new insights and connect with other users in the stocknear community."
+  />
   <!-- Add more Twitter meta tags as needed -->
 </svelte:head>
 
-
-
 <section>
- 
-
-
-
-
-
-  <body class="bg-[#09090B] max-w-3xl sm:max-w-screen-2xl overflow-hidden mt-10 sm:mt-5">
-
+  <body
+    class="bg-[#09090B] max-w-3xl sm:max-w-screen-2xl overflow-hidden mt-10 sm:mt-5"
+  >
     <!-- Page wrapper -->
     <div class="flex flex-col min-h-screen overflow-hidden">
-  
-     
-        <main class="grow">
-          
-  
-           
-            <!-- Page content -->
-            <section>
-                <div class="w-full max-w-7xl m-auto sm:px-20 ml-auto ">
-  
-  
-              <div class="w-full flex flex-row">
+      <main class="grow">
+        <!-- Page content -->
+        <section>
+          <div class="w-full max-w-7xl m-auto sm:px-20 ml-auto">
+            <div class="w-full flex flex-row">
               <!--Start Profile Pic-->
-              <div class="flex items-center justify-start mb-5 w-screen sm:w-full bg-[#141417] h-48 sm:rounded-xl border border-gray-700 sm:hover:border-gray-600">
-                  <label class="ml-5 avatar w-20 h-20 sm:w-24 sm:h-24 rounded-full hover:cursor-pointer">
-                      <img style="clip-path: circle(50%);" class="w-24 bg-slate-300 border border-slate-400 rounded-full inline-block "
-                      src={userData?.avatar
-                          ? getImageURL(userData?.collectionId, userData?.id, userData?.avatar)
-                          : `https://avatar.vercel.sh/${userData?.username}`} 
-                          alt="User avatar"
-                          id="avatar-preview"
-                        />
-                     
-            
-                  </label>
-                    <button id="submit-btn" class="hidden" type="submit"></button>
-                    
-                  <div class="mt-5 ml-5 p-2">
-                      <p class="text-sm sm:text-xl text-gray-200 font-semibold">
-                          @{userData?.username}
-                         
-                          {#if isLoaded}
-                          {#if isModerator(moderators)}
-                            <svg class="inline-block w-5 h-5 -ml-0.5 mr-0.5 mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="#75d377" d="M256 32C174 69.06 121.38 86.46 32 96c0 77.59 5.27 133.36 25.29 184.51a348.86 348.86 0 0 0 71.43 112.41c49.6 52.66 104.17 80.4 127.28 87.08c23.11-6.68 77.68-34.42 127.28-87.08a348.86 348.86 0 0 0 71.43-112.41C474.73 229.36 480 173.59 480 96c-89.38-9.54-142-26.94-224-64Z"/></svg>
-                          {/if}
-                          {/if}
-                      
-                          
-                      </p>
-                      <span class="text-sm text-gray-200">
-                        Joined on {new Date(userData?.created ?? null)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })}
-                      </span>
-                  </div>
-                
-                
+              <div
+                class="flex items-center justify-start mb-5 w-screen sm:w-full bg-[#141417] h-48 sm:rounded-xl border border-gray-700 sm:hover:border-gray-600"
+              >
+                <label
+                  class="ml-5 avatar w-20 h-20 sm:w-24 sm:h-24 rounded-full"
+                >
+                  <img
+                    style="clip-path: circle(50%);"
+                    class="w-24 bg-slate-300 border border-slate-400 rounded-full inline-block"
+                    src={userData?.avatar
+                      ? getImageURL(
+                          userData?.collectionId,
+                          userData?.id,
+                          userData?.avatar,
+                        )
+                      : defaultAvatar}
+                    alt="User avatar"
+                    id="avatar-preview"
+                  />
+                </label>
+                <button id="submit-btn" class="hidden" type="submit"></button>
+
+                <div class="mt-5 ml-5 p-2">
+                  <p class="text-sm sm:text-xl text-gray-200 font-semibold">
+                    @{userData?.username}
+
+                    {#if isLoaded}
+                      {#if isModerator(moderators)}
+                        <svg
+                          class="inline-block w-5 h-5 -ml-0.5 mr-0.5 mb-0.5"
+                          xmlns="http://www.w3.org/2000/svg"
+                          viewBox="0 0 512 512"
+                          ><path
+                            fill="#75d377"
+                            d="M256 32C174 69.06 121.38 86.46 32 96c0 77.59 5.27 133.36 25.29 184.51a348.86 348.86 0 0 0 71.43 112.41c49.6 52.66 104.17 80.4 127.28 87.08c23.11-6.68 77.68-34.42 127.28-87.08a348.86 348.86 0 0 0 71.43-112.41C474.73 229.36 480 173.59 480 96c-89.38-9.54-142-26.94-224-64Z"
+                          /></svg
+                        >
+                      {/if}
+                    {/if}
+                  </p>
+                  <span class="text-sm text-gray-200">
+                    Joined on {new Date(
+                      userData?.created ?? null,
+                    )?.toLocaleString("en-US", {
+                      month: "short",
+                      day: "numeric",
+                      year: "numeric",
+                      daySuffix: "2-digit",
+                    })}
+                  </span>
+                </div>
               </div>
-  
-                        <!-- Sidebar -->
-                        <aside class="hidden lg:inline-block h-sh lg:w-1/3 lg:pr-2 xl:pr-0">
-                          <div class="lg:pl-5 z-20 h-full">
-                        
-                                <!-- Sidebar content -->
-            
-                                  <!--Start User Profile -->
-                                  <div class="space-y-6 ml-4">  
-                                  <div class="rounded-xl bg-[#141417] h-48 w-full border border-gray-700 font-mono">
-                                    <!--Start Header-->
-                                    <div class="ml-2 w-full p-3">
-                                        <span class="text-white text-lg font-medium ml-0.5">User Profile</span>
-                                    </div>
-                                    <hr class="border-b border-gray-700"/>
-                                    <!--End Header-->
-                                    <!--Start Content-->
-                                    <div class="w-full p-2">
-            
-                                      <table class="font-semibold table table-compact bg-[#141417] text-start flex justify-start items-center w-full px-3 m-auto">
-                                        <tbody class="bg-[#141417]">
-                                          <!-- row 1 -->
-                                          <tr class="text-gray-300">
-                                            <td class="bg-[#141417] border-b border-[#27272A]">Karma: {userData?.karma}</td>
-                                            <td class="bg-[#27272A border-b border-[#27272A]">Posts: {userStats?.numberOfPosts}</td>
-                                          </tr>
-                                          <!-- row 2 -->
-                                          <tr class="text-gray-300">
-                                            <td class="bg-[#141417]">Comments: {userStats?.numberOfComments}</td>
-                                            <td class="bg-[#141417]"></td>
-                                          </tr>
-                                        </tbody>
-                                      </table>
-                                  </div>
-                                <!--End User Profile -->
-            
-                                {#if userData?.tier === 'Pro'}
-                                <!--Start Badge-->
-                                  <div class="rounded-xl bg-[#141417] h-48 w-full border border-gray-700 mt-14">
-                                    <!--Start Header-->
-                                    <div class="ml-2 w-full p-3">
-                                        <span class="text-white text-lg font-medium ml-0.5 ">Badge</span>
-                                    </div>
-                                    <hr class="border-b border-gray-700"/>
-                                    <!--End Header-->
-                                    <!--Start Content-->
-                                    <div class="w-full p-2 flex flex-col items-start">
-                                      <div class="ml-2 mt-3 rounded-full border border-gray-500 w-16 h-16 relative bg-[#20202E] flex items-center justify-center">
-                                        <svg style="clip-path: circle(50%);" class="rounded-full w-10" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="#F9784E" d="M273.857 21.904c-24.193.012-51.198 5.552-81.1 17.467c143.7 12.608 150.35 129.263 84.032 132.814c-85.27 4.565-53.232-57.217-133.34-103.03C200.445 201.48 94.44 190.33 21.054 59.23c12.805 85.755 24.28 116.942 78.26 153.596C261.996 323.294 94.618 347.8 36.82 245.53c14.568 93.454 68.364 132.803 131.707 139.93c-42.753 24.49-99.452 32.49-143.01 25.556c51.025 42.317 131.606 40.94 193.515 8.576c-37.137 36.123-97.446 70.644-116.803 74.728H276.36C517 405.563 530.305 232.45 454.827 124.492c-2.433 26.21-10.08 49.507-25.545 70.23c-18.48-102.394-69.02-172.86-155.426-172.818zm2.82 184.666l141.384 52.155c.286-3.207.86-6.495 1.747-9.807c5.62-20.973 21.605-34.913 35.705-31.135s20.973 23.842 15.353 44.815c-5.62 20.974-21.603 34.914-35.703 31.136a18 18 0 0 1-2.113-.72l-60.58 49.394l70.637 19.584l-140.023 84.71l65.848-68.866l-31.32-7.006l-150.335 122.58l158.06-196.89l-137.39-41.137l137.006 5.654l-68.275-54.467z"/></svg>
-                                      </div>
-                                      <span class="ml-7 mt-2 text-white font-mono font-medium">Pro</span>
-                                    </div>
-                                    <!--End Content-->
-                                  </div>
-                                <!--End Badge-->
-                                {/if}
-            
-                                <div class="flex flex-col items-start {userData?.tier === 'Pro' ? 'mt-3' : 'mt-12'} ml-2 font-sans">
-                                  <div class="flex flex-row gap-x-3">
-                                    <a href="/about" class="text-sm text-gray-400 hover:text-gray-300 hover:underline">
-                                      About
-                                    </a>
-                                    <a href="/terms-of-use" class="text-sm text-gray-400 hover:text-gray-300 hover:underline">
-                                      Terms
-                                    </a>
-                                    <a href="/privacy-policy" class="text-sm text-gray-400 hover:text-gray-300 hover:underline">
-                                      Privacy
-                                    </a>
-                                    <a href="/contact" class="text-sm text-gray-400 hover:text-gray-300 hover:underline">
-                                      Contact
-                                    </a>
-                                    <a href="/imprint" class="text-sm text-gray-400 hover:text-gray-300 hover:underline">
-                                      Imprint
-                                    </a>
-                            
-                                  </div>
-            
-                                  <span class="text-sm text-gray-400  mt-1.5">
-                                    © 2024 stocknear
-                                  </span>
-            
-                                </div>
-                                
-            
-                                </div>
-                            </div>
-                        </aside>
-  
-    
-          </div>
-      
-                <!--End Profile Pic-->
-  
-                
-  
-                <div class=" w-full " >
-                  <ul class="w-full  font-medium flex flex-row items-center bg-[#09090B] space-x-5 rtl:space-x-reverse py-2">
-                    <li class="cursor-pointer flex flex-col items-center">
-                      <label class="cursor-pointer px-3 text-sm sm:text-[0.9rem] font-medium text-gray-400 sm:hover:text-white {showTab === 'post' ? 'text-white ' : 'bg-[#09090B]'}" >
-                        Posts
-                      </label>
-                      <div class="{showTab === 'post' ? 'bg-[#75D377]' : 'bg-[#09090B]'} mt-1 h-[3px] rounded-full w-[2.6rem]" />
-                    </li>
-                  </ul>
-                </div>
-            
-  
-                    <div class="md:flex md:justify-between">
-                        <!-- Main content -->
-  
-                        
-                        <div class="md:grow  pb-12 md:pb-20">
-                            <div class="md:pr-6 lg:pr-10 mt-6">
-                              {#if showTab === 'post'}
-                                  
-                                <div class="{!loading? 'hidden' : ''}">
-                                  {#each Array(5) as _}
-                                    <SkeletonLoading />
-                                  {/each}
-                                </div>
-                                {#if posts?.length === 0}
-                                <div class="flex flex-col justify-center items-center ">
-                                  <p class="text-center text-gray-400 text-md sm:text-xl mt-10">You didn't post anything yet</p>
-                                  <p class="text-center text-gray-400 text-md sm:text-xl mt-3">Contribute to the community and make your first post</p> 
-                                </div>
-                                {:else}
-                                {#each posts as post, index} 
-                                    <div class="flex items-start w-full">
-                                    <div class="w-full m-auto ">
-                                        <PostSection
-                                          data={data}
-                                          posts= {post}
-                                          moderators={moderators}
-                                          />
-                                    </div>
-                                    
-                                  </div>
-  
-                          
-                                {/each}
-                                <InfiniteLoading on:infinite={infiniteHandler} />
-  
-                                {/if}
 
-                            {/if}
+              <!-- Sidebar -->
+              <aside
+                class="hidden lg:inline-block h-sh lg:w-1/3 lg:pr-2 xl:pr-0"
+              >
+                <div class="lg:pl-5 z-20 h-full">
+                  <!-- Sidebar content -->
+
+                  <!--Start User Profile -->
+                  <div class="space-y-6 ml-4">
+                    <div
+                      class="rounded-xl bg-[#141417] h-48 w-full border border-gray-700 font-mono"
+                    >
+                      <!--Start Header-->
+                      <div class="ml-2 w-full p-3">
+                        <span class="text-white text-lg font-medium ml-0.5"
+                          >User Profile</span
+                        >
+                      </div>
+                      <hr class="border-b border-gray-700" />
+                      <!--End Header-->
+                      <!--Start Content-->
+                      <div class="w-full p-2">
+                        <table
+                          class="font-semibold table table-compact bg-[#141417] text-start flex justify-start items-center w-full px-3 m-auto"
+                        >
+                          <tbody class="bg-[#141417]">
+                            <!-- row 1 -->
+                            <tr class="text-gray-300">
+                              <td class="bg-[#141417] border-b border-[#27272A]"
+                                >Karma: {userData?.karma}</td
+                              >
+                              <td class="bg-[#27272A border-b border-[#27272A]"
+                                >Posts: {userStats?.numberOfPosts}</td
+                              >
+                            </tr>
+                            <!-- row 2 -->
+                            <tr class="text-gray-300">
+                              <td class="bg-[#141417]"
+                                >Comments: {userStats?.numberOfComments}</td
+                              >
+                              <td class="bg-[#141417]"></td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </div>
+                      <!--End User Profile -->
+
+                      {#if userData?.tier === "Pro"}
+                        <!--Start Badge-->
+                        <div
+                          class="rounded-xl bg-[#141417] h-48 w-full border border-gray-700 mt-14"
+                        >
+                          <!--Start Header-->
+                          <div class="ml-2 w-full p-3">
+                            <span class="text-white text-lg font-medium ml-0.5"
+                              >Badge</span
+                            >
+                          </div>
+                          <hr class="border-b border-gray-700" />
+                          <!--End Header-->
+                          <!--Start Content-->
+                          <div class="w-full p-2 flex flex-col items-start">
+                            <div
+                              class="ml-2 mt-3 rounded-full border border-gray-500 w-16 h-16 relative bg-[#20202E] flex items-center justify-center"
+                            >
+                              <svg
+                                style="clip-path: circle(50%);"
+                                class="rounded-full w-10"
+                                xmlns="http://www.w3.org/2000/svg"
+                                viewBox="0 0 512 512"
+                                ><path
+                                  fill="#F9784E"
+                                  d="M273.857 21.904c-24.193.012-51.198 5.552-81.1 17.467c143.7 12.608 150.35 129.263 84.032 132.814c-85.27 4.565-53.232-57.217-133.34-103.03C200.445 201.48 94.44 190.33 21.054 59.23c12.805 85.755 24.28 116.942 78.26 153.596C261.996 323.294 94.618 347.8 36.82 245.53c14.568 93.454 68.364 132.803 131.707 139.93c-42.753 24.49-99.452 32.49-143.01 25.556c51.025 42.317 131.606 40.94 193.515 8.576c-37.137 36.123-97.446 70.644-116.803 74.728H276.36C517 405.563 530.305 232.45 454.827 124.492c-2.433 26.21-10.08 49.507-25.545 70.23c-18.48-102.394-69.02-172.86-155.426-172.818zm2.82 184.666l141.384 52.155c.286-3.207.86-6.495 1.747-9.807c5.62-20.973 21.605-34.913 35.705-31.135s20.973 23.842 15.353 44.815c-5.62 20.974-21.603 34.914-35.703 31.136a18 18 0 0 1-2.113-.72l-60.58 49.394l70.637 19.584l-140.023 84.71l65.848-68.866l-31.32-7.006l-150.335 122.58l158.06-196.89l-137.39-41.137l137.006 5.654l-68.275-54.467z"
+                                /></svg
+                              >
                             </div>
+                            <span
+                              class="ml-7 mt-2 text-white font-mono font-medium"
+                              >Pro</span
+                            >
+                          </div>
+                          <!--End Content-->
                         </div>
-  
-  
-                    <!-- Sidebar -->
-                    <aside class="hidden {showTab === 'post' ? 'lg:inline-block' : 'hidden'} h-sh w-[300px] pt-[1.5rem]">
-                      <div class="lg:pl-5 z-20 h-full invisible">
-                    
-                            <!-- Sidebar content -->
-  
-                              <!--Start User Profile -->
-                              <div class="space-y-6">  
-                              <div class="shadow-lg rounded-md bg-[#09090B] h-auto w-full md:w-80 border border-gray-700">
-                                <!--Start Header-->
-                                <div class="bg-[#09090B] w-full p-3 ">
-                                  <svg style="clip-path: circle(50%);" class="flex-shrink-0 w-10 h-10 inline-block" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><g fill="white"><path d="M32 20a8 8 0 1 1-16 0a8 8 0 0 1 16 0"/><path fill-rule="evenodd" d="M23.184 43.984C12.517 43.556 4 34.772 4 24C4 12.954 12.954 4 24 4s20 8.954 20 20s-8.954 20-20 20h-.274q-.272 0-.542-.016M11.166 36.62a3.028 3.028 0 0 1 2.523-4.005c7.796-.863 12.874-.785 20.632.018a2.99 2.99 0 0 1 2.498 4.002A17.94 17.94 0 0 0 42 24c0-9.941-8.059-18-18-18S6 14.059 6 24c0 4.916 1.971 9.373 5.166 12.621" clip-rule="evenodd"/></g></svg>
-                                    <span class="text-white text-md ml-0.5 ">User Profile</span>
-                                </div>
-                                <!--End Header-->
-                                <!--Start Content-->
-                                <div class="w-full p-2 flex-1 flex flex-wrap">
-  
-                                  <table class="table table-compact bg-[#09090B] text-start flex justify-start items-center w-full px-3 m-auto">
-                                    <tbody class="bg-[#09090B]">
-                                      <!-- row 1 -->
-                                      <tr class="text-gray-300">
-                                        <td class="bg-[#09090B] border-b border-[#27272A]">Karma: {userData?.karma}</td>
-                                        <td class="bg-[#27272A border-b border-[#27272A]">Posts: {userStats?.numberOfPosts}</td>
-                                      </tr>
-                                      <!-- row 2 -->
-                                      <tr class="text-gray-300">
-                                        <td class="bg-[#09090B]">Comments: {userStats?.numberOfComments}</td>
-                                        <td class="bg-[#09090B]"></td>
-                                      </tr>
-                                    </tbody>
-                                  </table>
-                              </div>
-                            <!--End User Profile -->
-                            
-  
-                            </div>
+                        <!--End Badge-->
+                      {/if}
+
+                      <div
+                        class="flex flex-col items-start {userData?.tier ===
+                        'Pro'
+                          ? 'mt-3'
+                          : 'mt-12'} ml-2 font-sans"
+                      >
+                        <div class="flex flex-row gap-x-3">
+                          <a
+                            href="/about"
+                            class="text-sm text-gray-400 hover:text-gray-300 hover:underline"
+                          >
+                            About
+                          </a>
+                          <a
+                            href="/terms-of-use"
+                            class="text-sm text-gray-400 hover:text-gray-300 hover:underline"
+                          >
+                            Terms
+                          </a>
+                          <a
+                            href="/privacy-policy"
+                            class="text-sm text-gray-400 hover:text-gray-300 hover:underline"
+                          >
+                            Privacy
+                          </a>
+                          <a
+                            href="/contact"
+                            class="text-sm text-gray-400 hover:text-gray-300 hover:underline"
+                          >
+                            Contact
+                          </a>
+                          <a
+                            href="/imprint"
+                            class="text-sm text-gray-400 hover:text-gray-300 hover:underline"
+                          >
+                            Imprint
+                          </a>
                         </div>
-                    </aside>
-  
-                                              
+
+                        <span class="text-sm text-gray-400 mt-1.5">
+                          © 2024 stocknear
+                        </span>
+                      </div>
                     </div>
-  
+                  </div>
                 </div>
-            </section>
-  
-        </main>
-  
-       
-    </div>
-  
-  
-  
-  </body>
-  
+              </aside>
+            </div>
 
+            <!--End Profile Pic-->
+
+            <div class=" w-full">
+              <ul
+                class="w-full font-medium flex flex-row items-center bg-[#09090B] space-x-5 rtl:space-x-reverse py-2"
+              >
+                <li class="cursor-pointer flex flex-col items-center">
+                  <label
+                    class="cursor-pointer px-3 text-sm sm:text-[0.9rem] font-medium text-gray-400 sm:hover:text-white {showTab ===
+                    'post'
+                      ? 'text-white '
+                      : 'bg-[#09090B]'}"
+                  >
+                    Posts
+                  </label>
+                  <div
+                    class="{showTab === 'post'
+                      ? 'bg-[#75D377]'
+                      : 'bg-[#09090B]'} mt-1 h-[3px] rounded-full w-[2.6rem]"
+                  />
+                </li>
+              </ul>
+            </div>
+
+            <div class="md:flex md:justify-between">
+              <!-- Main content -->
+
+              <div class="md:grow pb-12 md:pb-20">
+                <div class="md:pr-6 lg:pr-10 mt-6">
+                  {#if showTab === "post"}
+                    <div class={!loading ? "hidden" : ""}>
+                      {#each Array(5) as _}
+                        <SkeletonLoading />
+                      {/each}
+                    </div>
+                    {#if posts?.length === 0}
+                      <div class="flex flex-col justify-center items-center">
+                        <p
+                          class="text-center text-gray-400 text-md sm:text-xl mt-10"
+                        >
+                          You didn't post anything yet
+                        </p>
+                        <p
+                          class="text-center text-gray-400 text-md sm:text-xl mt-3"
+                        >
+                          Contribute to the community and make your first post
+                        </p>
+                      </div>
+                    {:else}
+                      {#each posts as post, index}
+                        <div class="flex items-start w-full">
+                          <div class="w-full m-auto">
+                            <PostSection {data} posts={post} {moderators} />
+                          </div>
+                        </div>
+                      {/each}
+                      <InfiniteLoading on:infinite={infiniteHandler} />
+                    {/if}
+                  {/if}
+                </div>
+              </div>
+
+              <!-- Sidebar -->
+              <aside
+                class="hidden {showTab === 'post'
+                  ? 'lg:inline-block'
+                  : 'hidden'} h-sh w-[300px] pt-[1.5rem]"
+              >
+                <div class="lg:pl-5 z-20 h-full invisible">
+                  <!-- Sidebar content -->
+
+                  <!--Start User Profile -->
+                  <div class="space-y-6">
+                    <div
+                      class="shadow-lg rounded-md bg-[#09090B] h-auto w-full md:w-80 border border-gray-700"
+                    >
+                      <!--Start Header-->
+                      <div class="bg-[#09090B] w-full p-3">
+                        <svg
+                          style="clip-path: circle(50%);"
+                          class="flex-shrink-0 w-10 h-10 inline-block"
+                          xmlns="http://www.w3.org/2000/svg"
+                          viewBox="0 0 48 48"
+                          ><g fill="white"
+                            ><path
+                              d="M32 20a8 8 0 1 1-16 0a8 8 0 0 1 16 0"
+                            /><path
+                              fill-rule="evenodd"
+                              d="M23.184 43.984C12.517 43.556 4 34.772 4 24C4 12.954 12.954 4 24 4s20 8.954 20 20s-8.954 20-20 20h-.274q-.272 0-.542-.016M11.166 36.62a3.028 3.028 0 0 1 2.523-4.005c7.796-.863 12.874-.785 20.632.018a2.99 2.99 0 0 1 2.498 4.002A17.94 17.94 0 0 0 42 24c0-9.941-8.059-18-18-18S6 14.059 6 24c0 4.916 1.971 9.373 5.166 12.621"
+                              clip-rule="evenodd"
+                            /></g
+                          ></svg
+                        >
+                        <span class="text-white text-md ml-0.5"
+                          >User Profile</span
+                        >
+                      </div>
+                      <!--End Header-->
+                      <!--Start Content-->
+                      <div class="w-full p-2 flex-1 flex flex-wrap">
+                        <table
+                          class="table table-compact bg-[#09090B] text-start flex justify-start items-center w-full px-3 m-auto"
+                        >
+                          <tbody class="bg-[#09090B]">
+                            <!-- row 1 -->
+                            <tr class="text-gray-300">
+                              <td class="bg-[#09090B] border-b border-[#27272A]"
+                                >Karma: {userData?.karma}</td
+                              >
+                              <td class="bg-[#27272A border-b border-[#27272A]"
+                                >Posts: {userStats?.numberOfPosts}</td
+                              >
+                            </tr>
+                            <!-- row 2 -->
+                            <tr class="text-gray-300">
+                              <td class="bg-[#09090B]"
+                                >Comments: {userStats?.numberOfComments}</td
+                              >
+                              <td class="bg-[#09090B]"></td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </div>
+                      <!--End User Profile -->
+                    </div>
+                  </div>
+                </div>
+              </aside>
+            </div>
+          </div>
+        </section>
+      </main>
+    </div>
+  </body>
 </section>
 
 <!--Start Login Modal-->
 {#if LoginPopup}
-   <LoginPopup form={form}/>    
+  <LoginPopup {form} />
 {/if}
-<!--End Login Modal-->
\ No newline at end of file
+<!--End Login Modal-->