File size: 2,273 Bytes
c8a88af
 
5c85958
 
 
 
 
 
 
 
 
 
 
 
c8a88af
 
 
 
e409b8e
 
 
 
 
9eab2cc
 
e409b8e
3a6d7d7
 
9eab2cc
 
 
3a6d7d7
9eab2cc
 
 
3a6d7d7
e409b8e
3a6d7d7
 
e409b8e
c8a88af
 
 
 
5c85958
 
 
 
 
8b0eec0
c8a88af
5c85958
 
 
9475bfa
5c85958
9475bfa
5c85958
 
 
8b0eec0
5c85958
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
import { useEffect } from 'react';
import { HashRouter, Routes, Route, useLocation } from 'react-router-dom';
import { ThemeProvider, CssBaseline } from '@mui/material';
import theme from './theme/theme';
import { AppsProvider } from './context/AppsContext';

import Home from './pages/Home';
import Download from './pages/Download';
import FAQ from './pages/FAQ';
import Apps from './pages/Apps';
import Buy from './pages/Buy';
import GettingStarted from './pages/GettingStarted';
import Build from './pages/Build';

function ScrollToTop() {
  const location = useLocation();

  useEffect(() => {
    // Check for scrollTo query parameter (used for anchor-like behavior with HashRouter)
    const params = new URLSearchParams(location.search);
    const scrollTo = params.get('scrollTo');
    
    if (scrollTo) {
      // Retry mechanism to wait for element to be rendered
      const scrollToElement = (retries = 0) => {
        const element = document.getElementById(scrollTo);
        if (element) {
          element.scrollIntoView({ behavior: 'smooth', block: 'center' });
        } else if (retries < 10) {
          // Retry up to 10 times with 100ms interval
          setTimeout(() => scrollToElement(retries + 1), 100);
        }
      };
      // Initial delay for page render
      setTimeout(() => scrollToElement(), 300);
    } else {
      // Otherwise scroll to top
      window.scrollTo({ top: 0, behavior: 'smooth' });
    }
  }, [location.pathname, location.search]);

  return null;
}

export default function App() {
  return (
    <ThemeProvider theme={theme}>
      <CssBaseline />
      <AppsProvider>
        <HashRouter>
          <ScrollToTop />
          <Routes>
            <Route path="/" element={<Home />} />
            <Route path="/getting-started" element={<GettingStarted />} />
            <Route path="https://huggingface.co/docs/reachy_mini/" element={<Build />} />
            <Route path="/download" element={<Download />} />
            <Route path="https://huggingface.co/docs/reachy_mini/troubleshooting" element={<FAQ />} />
            <Route path="/apps" element={<Apps />} />
            <Route path="/buy" element={<Buy />} />
          </Routes>
        </HashRouter>
      </AppsProvider>
    </ThemeProvider>
  );
}