App.svelte

<!-- App.svelte -->
<script>
    import { Router, Route, Link } from 'svelte-routing';
    import { currentPage } from './stores';
    import Page1 from './Page1.svelte'; // Import Page1 component
    import InteractivePage from './InteractivePage.svelte'; // Import InteractivePage component
  
    const pages = [
      { path: '/page1', component: Page1 },
      { path: '/page2', component: InteractivePage }
    ];
  
    function goToPage(path) {
      currentPage.set(path);
    }
  </script>
  
  <Router>
    {#each pages as { path, component }, index}
      <Route path={path} let:params>
        <svelte:component this={component} />
      </Route>
    {/each}
  </Router>
  
  <footer>
    {#each pages as { path }, index}
      <Link href={path} on:click={() => goToPage(path)}>
        {index + 1}
      </Link>
    {/each}
  </footer>