Removing the internal BrowserRouter

client/src/Components/Event/Create/index.js

@@ -71,7 +71,7 @@ class Create extends React.Component {
     return (
       <Mutation mutation={hostedEventsCalls.EVENTS_CREATEEVENT}
         update={(store, { data }) => {
-          this.props.history.push(`/edit/${data.events_CreateEvent.id}`);
+          this.props.history.push(`/events/edit/${data.events_CreateEvent.id}`);
         }
         }
       >

client/src/Components/HostedEvents/Event.js

@@ -50,7 +50,7 @@ class Event extends React.Component {
                   color='primary'
                   size='small'
                   component={Link}
-                  to={`/edit/${id}`}
+                  to={`/events/edit/${id}`}
                 >
                   Edit
                 </Button>
@@ -60,7 +60,7 @@ class Event extends React.Component {
                   color='primary'
                   size='small'
                   component={Link}
-                  to={`/show/${id}`}
+                  to={`/events/show/${id}`}
                 >
                   Show
                 </Button>

client/src/Components/Search/Event.js

@@ -50,7 +50,7 @@ class Event extends React.Component {
                   color='primary'
                   size='small'
                   component={Link}
-                  to={`/show/${id}`}
+                  to={`/events/show/${id}`}
                 >
                   Show
                 </Button>

client/src/Components/TopBar/data.js

@@ -7,16 +7,16 @@ import {
 
 const data = [
   {
-    title: 'Look for an event', to: '/', icon: Search, text: '',
+    title: 'Look for an event', to: '/events/', icon: Search, text: '',
   },
   {
-    title: 'Events you are enrolled in', to: '/my', icon: GamepadRounded, text: '',
+    title: 'Events you are enrolled in', to: '/events/my', icon: GamepadRounded, text: '',
   },
   {
-    title: 'Your hosted competition', to: '/host', icon: AccessibilityNew, text: '',
+    title: 'Your hosted competition', to: '/events/host', icon: AccessibilityNew, text: '',
   },
   {
-    title: 'Host a new competition', to: '/create', icon: LibraryAdd, text: '',
+    title: 'Host a new competition', to: '/events/create', icon: LibraryAdd, text: '',
   },
 ];
 

client/src/index.js

@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { Route, BrowserRouter, Switch } from 'react-router-dom';
+import { Route, Switch } from 'react-router-dom';
 
 import { MuiPickersUtilsProvider } from 'material-ui-pickers';
 import LuxonUtils from 'material-ui-pickers/utils/luxon-utils';
@@ -39,19 +39,15 @@ class App extends Component {
     }
     return (
       <MuiPickersUtilsProvider utils={LuxonUtils}>
-        <BrowserRouter basename={this.props.match.path}>
-          <div>
-            {loggedIn}
-            <Switch>
-              <Route exact path='/' component={Search} />
-              <Route path='/my' component={Events} />
-              <Route path='/create' component={CreateEvent} />
-              <Route path='/edit/:slug' component={EditEvent} />
-              <Route path='/show/:slug' component={EditEvent} />
-              <Route path='/host' component={HostedEvents} />
-            </Switch>
-          </div>
-        </BrowserRouter>
+        {loggedIn}
+        <Switch>
+          <Route exact path='/events/' component={Search} />
+          <Route path='/events/my' component={Events} />
+          <Route path='/events/create' component={CreateEvent} />
+          <Route path='/events/edit/:slug' component={EditEvent} />
+          <Route path='/events/show/:slug' component={EditEvent} />
+          <Route path='/events/host' component={HostedEvents} />
+        </Switch>
       </MuiPickersUtilsProvider>
     );
   }