📦 mlynch / ionic-react-routing-case

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
35import React from 'react';
import '@ionic/core/css/core.css';
import '@ionic/core/css/ionic.bundle.css';
import { IonPage, IonRouterOutlet, IonReactRouter, IonApp } from '@ionic/react';
import { Route, Redirect } from 'react-router';
import { BrowserRouter as Router } from 'react-router-dom';

import './App.css';
import AppStack from './pages/AppStack';
import { LoginPage } from './pages/Login';
import { SignupPage } from './pages/Signup';
import ResetPasswordPage from './pages/ResetPassword';

const App: React.FunctionComponent = () => {
  return (
    <Router>
      <IonApp>
        <IonReactRouter>
          <IonPage>
            <IonRouterOutlet>
              <Route path="/login" component={LoginPage} exact={true} />
              <Route path="/signup" component={SignupPage} exact={true} />
              <Route path="/reset-password" component={ResetPasswordPage} exact={true} />
              <Route exact path="/" render={() => <Redirect to="/signup" />} />
            </IonRouterOutlet>
            <Route path="/tabs" component={AppStack} />
          </IonPage>
        </IonReactRouter>
      </IonApp>
    </Router>
  );
};

export default App;