From dd5004ed86367afcbba5e3fed3ef47d7d4e7ad85 Mon Sep 17 00:00:00 2001
From: MuslemRahimi <moslem_rahimi@hotmail.de>
Date: Mon, 17 Feb 2025 10:13:50 +0100
Subject: [PATCH] ui fixes

---
 .../options/hottest-contracts/+page.svelte    | 30 +++++++++++++------
 .../options/hottest-contracts/+page.svelte    | 30 +++++++++++++------
 2 files changed, 42 insertions(+), 18 deletions(-)

diff --git a/src/routes/etf/[tickerID]/options/hottest-contracts/+page.svelte b/src/routes/etf/[tickerID]/options/hottest-contracts/+page.svelte
index 66ea1f37..112ceaf2 100644
--- a/src/routes/etf/[tickerID]/options/hottest-contracts/+page.svelte
+++ b/src/routes/etf/[tickerID]/options/hottest-contracts/+page.svelte
@@ -551,7 +551,7 @@
 </script>
 
 <SEO
-  title={`${$displayCompanyName} (${$etfTicker}) - Explore the Hottest Options Contracts | Stocknear`}
+  title={`${$displayCompanyName} (${$etfTicker}) | Explore the Hottest Options Contracts`}
   description={`Analyze historical volume, open interest, and trends in option chains for ${$displayCompanyName} (${$etfTicker}). Discover actionable insights for trading decisions.`}
 />
 
@@ -630,12 +630,16 @@
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
                     >
-                      {item?.last}
+                      {item?.last ?? "n/a"}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
                     >
-                      {item?.low}-{item?.high}
+                      {#if item?.low && item?.high}
+                        {item?.low}-{item?.high}
+                      {:else}
+                        n/a
+                      {/if}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
@@ -654,14 +658,16 @@
                         <span class="text-[#00FC50]"
                           >+{item?.changeOI?.toLocaleString("en-US")}</span
                         >
-                      {:else}
+                      {:else if item?.changeOI < 0}
                         <span class="text-[#FF2F1F]"
                           >{item?.changeOI?.toLocaleString("en-US")}</span
                         >
+                      {:else}
+                        n/a
                       {/if}
                     </td>
                     <td class="text-sm sm:text-[1rem] text-end">
-                      {item?.iv}%
+                      {item?.iv ? item?.iv + "%" : "n/a"}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
@@ -744,12 +750,16 @@
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
                     >
-                      {item?.last}
+                      {item?.last ?? "n/a"}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
                     >
-                      {item?.low}-{item?.high}
+                      {#if item?.low && item?.high}
+                        {item?.low}-{item?.high}
+                      {:else}
+                        n/a
+                      {/if}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
@@ -768,14 +778,16 @@
                         <span class="text-[#00FC50]"
                           >+{item?.changeOI?.toLocaleString("en-US")}</span
                         >
-                      {:else}
+                      {:else if item?.changeOI < 0}
                         <span class="text-[#FF2F1F]"
                           >{item?.changeOI?.toLocaleString("en-US")}</span
                         >
+                      {:else}
+                        n/a
                       {/if}
                     </td>
                     <td class="text-sm sm:text-[1rem] text-end">
-                      {item?.iv}%
+                      {item?.iv ? item?.iv + "%" : "n/a"}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
diff --git a/src/routes/stocks/[tickerID]/options/hottest-contracts/+page.svelte b/src/routes/stocks/[tickerID]/options/hottest-contracts/+page.svelte
index d1b8bcf7..5627475e 100644
--- a/src/routes/stocks/[tickerID]/options/hottest-contracts/+page.svelte
+++ b/src/routes/stocks/[tickerID]/options/hottest-contracts/+page.svelte
@@ -551,7 +551,7 @@
 </script>
 
 <SEO
-  title={`${$displayCompanyName} (${$stockTicker}) - Explore the Hottest Options Contracts | Stocknear`}
+  title={`${$displayCompanyName} (${$stockTicker}) | Explore the Hottest Options Contracts`}
   description={`Analyze historical volume, open interest, and trends in option chains for ${$displayCompanyName} (${$stockTicker}). Discover actionable insights for trading decisions.`}
 />
 
@@ -630,12 +630,16 @@
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
                     >
-                      {item?.last}
+                      {item?.last ?? "n/a"}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
                     >
-                      {item?.low}-{item?.high}
+                      {#if item?.low && item?.high}
+                        {item?.low}-{item?.high}
+                      {:else}
+                        n/a
+                      {/if}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
@@ -654,14 +658,16 @@
                         <span class="text-[#00FC50]"
                           >+{item?.changeOI?.toLocaleString("en-US")}</span
                         >
-                      {:else}
+                      {:else if item?.changeOI < 0}
                         <span class="text-[#FF2F1F]"
                           >{item?.changeOI?.toLocaleString("en-US")}</span
                         >
+                      {:else}
+                        n/a
                       {/if}
                     </td>
                     <td class="text-sm sm:text-[1rem] text-end">
-                      {item?.iv}%
+                      {item?.iv ? item?.iv + "%" : "n/a"}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
@@ -744,12 +750,16 @@
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
                     >
-                      {item?.last}
+                      {item?.last ?? "n/a"}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
                     >
-                      {item?.low}-{item?.high}
+                      {#if item?.low && item?.high}
+                        {item?.low}-{item?.high}
+                      {:else}
+                        n/a
+                      {/if}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"
@@ -768,14 +778,16 @@
                         <span class="text-[#00FC50]"
                           >+{item?.changeOI?.toLocaleString("en-US")}</span
                         >
-                      {:else}
+                      {:else if item?.changeOI < 0}
                         <span class="text-[#FF2F1F]"
                           >{item?.changeOI?.toLocaleString("en-US")}</span
                         >
+                      {:else}
+                        n/a
                       {/if}
                     </td>
                     <td class="text-sm sm:text-[1rem] text-end">
-                      {item?.iv}%
+                      {item?.iv ? item?.iv + "%" : "n/a"}
                     </td>
                     <td
                       class="text-white text-sm sm:text-[1rem] text-end whitespace-nowrap"