import { IonRouterOutlet, IonTabs } from '@ionic/react';

import { Route, Redirect } from 'react-router';

// import Tab1 from './AppPages/Tab1';
// import Tab2 from './AppPages/Tab2';

import './theme/variables.scss';
import Home from './pages/Home';
import ViewCharacter from './pages/ViewCharacter';
import Info from './pages/Info';

function DemoReactMarvelApp() {
  return (
    <IonTabs className="demo-react-marvel-app">
      <IonRouterOutlet>
        <Route exact path="/demo-react-marvel-app/home">
          <Home />
        </Route>
        <Route exact path="/demo-react-marvel-app/character/:id">
          <ViewCharacter />
        </Route>
        <Route exact path="/demo-react-marvel-app/info">
          <Info />
        </Route>

        <Redirect exact path="/demo-react-marvel-app" to="/demo-react-marvel-app/home" />
      </IonRouterOutlet>
    </IonTabs>
  );
}

export default DemoReactMarvelApp;