Function App

website/src/App.tsx:20–57

()

const queryClient = new QueryClient();

const App: React.FC = () => {
  // ✅ Initialize AOS once on mount
  useEffect(() => {
    AOS.init({
      duration: 800, // Animation duration (ms)
      easing: "ease-in-out", // Smooth transition
      once: true, // Run animation only once
      mirror: false, // Do not animate when scrolling back up
    });
  }, []);

  return (
    <BrowserRouter future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>
      <QueryClientProvider client={queryClient}>
        <ThemeProvider
          attribute="class"
          defaultTheme="dark"
          enableSystem
          disableTransitionOnChange
        >
          <TooltipProvider>
            <Toaster />
            <Sonner />
            <Navbar />
            <Routes>
              <Route path="/" element={<Index />} />
              <Route path="/explore" element={<Explore />} />
              {/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */}
              <Route path="*" element={<NotFound />} />
            </Routes>
            {/* Move to Top button */}
            <MoveToTop />
          </TooltipProvider>
        </ThemeProvider>
      </QueryClientProvider>
    </BrowserRouter>
  );
};

export default App;