import "./app.css";
import { gsap } from "gsap";
import { Route, Router } from "@solidjs/router";
import { FileRoutes } from "@solidjs/start/router";
import Footer from "./components/footer";
import ChatbotLoader from "./components/chatbot/chat";
import LanguageProvider from "./components/translation/langProvider";

import { ErrorBoundary, Suspense, onMount } from "solid-js";
import { MetaProvider } from "@solidjs/meta";

const LoadingSpinner = () => {
  return (
    <div class="flex justify-center items-center min-h-screen w-full text-xl font-bold text-white">
      <span class="loader"></span>
    </div>
  );
};

export default function App() {
  const handleRefresh = () => window.location.reload();
  return (
    <LanguageProvider>
      <ErrorBoundary
        fallback={(err) => {
          if (err.message === "Unknown error") {
            handleRefresh();
          }
        }}
      >
        <Router
          root={(props) => (
            <MetaProvider>
              <div id="main">
                <Suspense>
                  {props.children}
                </Suspense>
                <Footer />
              </div>
            </MetaProvider>
          )}
        >
          <Route path="/blog/:id" component={BlogSlug} />
          <Route path="/faq" component={Faq} />
          <Route path="/refunds" component={Refund} />
          <FileRoutes />
        </Router>
      </ErrorBoundary>
    </LanguageProvider>
  );
}

import "./app.css";
import { gsap } from "gsap";
import { Route, Router } from "@solidjs/router";
import { FileRoutes } from "@solidjs/start/router";
import Footer from "./components/footer";
import ChatbotLoader from "./components/chatbot/chat";
import LanguageProvider from "./components/translation/langProvider";

import { ErrorBoundary, Suspense, onMount } from "solid-js";
import { MetaProvider } from "@solidjs/meta";

const LoadingSpinner = () => {
  return (
    <div class="flex justify-center items-center min-h-screen w-full text-xl font-bold text-white">
      <span class="loader"></span>
    </div>
  );
};

export default function App() {
  const handleRefresh = () => window.location.reload();
  return (
    <LanguageProvider>
      <ErrorBoundary
        fallback={(err) => {
          if (err.message === "Unknown error") {
            handleRefresh();
          }
        }}
      >
        <Router
          root={(props) => (
            <MetaProvider>
              <div id="main">
                <Suspense>
                  {props.children}
                </Suspense>
                <Footer />
              </div>
            </MetaProvider>
          )}
        >
          <Route path="/blog/:id" component={BlogSlug} />
          <Route path="/faq" component={Faq} />
          <Route path="/refunds" component={Refund} />
          <FileRoutes />
        </Router>
      </ErrorBoundary>
    </LanguageProvider>
  );
}