ui fix

src/routes/etf/[tickerID]/options/dex/+page.svelte

@@ -426,7 +426,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/etf/[tickerID]/options/dex/expiry/+page.svelte

@@ -326,7 +326,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/etf/[tickerID]/options/dex/strike/+page.svelte

@@ -319,7 +319,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/etf/[tickerID]/options/gex/+page.svelte

@@ -426,7 +426,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/etf/[tickerID]/options/gex/expiry/+page.svelte

@@ -330,7 +330,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/etf/[tickerID]/options/gex/strike/+page.svelte

@@ -319,7 +319,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/stocks/[tickerID]/options/dex/+page.svelte

@@ -426,7 +426,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/stocks/[tickerID]/options/dex/expiry/+page.svelte

@@ -330,7 +330,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/stocks/[tickerID]/options/dex/strike/+page.svelte

@@ -319,7 +319,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/stocks/[tickerID]/options/gex/+page.server.ts

@@ -17,7 +17,7 @@ export const load = async ({ locals, params }) => {
       },
       body: JSON.stringify(postData),
     });
-  const output = await response.json();
+ const output = await response.json();
 
     return output;
   }; 

src/routes/stocks/[tickerID]/options/gex/+page.svelte

@@ -426,7 +426,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/stocks/[tickerID]/options/gex/expiry/+page.svelte

@@ -330,7 +330,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===

src/routes/stocks/[tickerID]/options/gex/strike/+page.svelte

@@ -319,7 +319,7 @@
                 <TableHeader {columns} {sortOrders} {sortData} />
               </thead>
               <tbody>
-                {#each displayList as item, index}
+                {#each data?.user?.tier === "Pro" ? displayList : displayList?.slice(0, 3) as item, index}
                   <tr
                     class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800 {index +
                       1 ===