removed spinner logic as we are passing fallback

Author: sushilparajuli

client/trading-dashboard/app/not-found.tsx

@@ -1,13 +1,10 @@
-// src/app/not-found.tsx (or your custom 404 file location)
 "use client";
-
 import { useEffect } from "react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { AlertTriangle, Home } from "lucide-react";
 
 const NotFound = () => {
-  // Correctly get the pathname using the usePathname hook
   const pathname = usePathname();
 
   // Log the error to the console for debugging purposes
@@ -24,7 +21,6 @@ const NotFound = () => {
           <AlertTriangle className="h-16 w-16 text-yellow-500" />
         </div>
 
-        {/* Gradient text effect for the 404 status code */}
         <h1 className="bg-gradient-to-r from-purple-500 to-pink-500 bg-clip-text text-8xl font-extrabold text-transparent">
           404
         </h1>

client/trading-dashboard/components/TickerGrid.tsx

@@ -2,7 +2,6 @@
 import TickerCard from "./TickerCard";
 import { Ticker } from "@/types";
 import { useQuery } from "@tanstack/react-query";
-import { notFound } from "next/navigation";
 import { API_BASE_URL, MOCK_TICKERS } from "@/constants";
 import { LoadingSpinner } from "./ui/LoadingSpinner";
 
@@ -19,20 +18,17 @@ async function getPosts(): Promise<Ticker[]> {
   return tickers;
 }
 const TickerGrid = () => {
-  const { data, isLoading, error } = useQuery<Ticker[], Error>({
+  const { data, error } = useQuery<Ticker[], Error>({
     queryKey: ["tickers"],
     queryFn: getPosts,
     refetchInterval: 1000,
     placeholderData: MOCK_TICKERS,
   });
 
-  if (isLoading)
-    return (
-      <div className="py-16 px-4">
-        <LoadingSpinner />
-      </div>
-    );
-  if (error) return null;
+  if (error) {
+    console.error("Error fetching tickers:", error);
+  }
+
   return (
     <section className="py-16 px-4 bg-background">
       <div className="container mx-auto max-w-7xl">
@@ -45,7 +41,10 @@ const TickerGrid = () => {
           </p>
         </div>
 
-        <div data-testid="ticker-grid" className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+        <div
+          data-testid="ticker-grid"
+          className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"
+        >
           {data &&
             data.length > 0 &&
             data?.map((ticker) => (

client/trading-dashboard/components/__tests__/TickerGrid.test.tsx

@@ -21,20 +21,6 @@ describe("TickerGrid", () => {
     jest.clearAllMocks();
   });
 
-  it("displays loading spinner initially", () => {
-    (global.fetch as jest.Mock).mockImplementation(
-      () => new Promise(() => {}) // Never resolves
-    );
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <TickerGrid />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByRole("status")).toBeInTheDocument();
-  });
-
   it("renders ticker cards when data is fetched successfully", async () => {
     const mockTickers = [
       {