Put react-components into logical folders according to the page they're used on

src/App.js

@@ -1,26 +0,0 @@
-import React from 'react'
-import {
-  BrowserRouter,
-  Switch,
-  Route
-} from 'react-router-dom'
-
-import Header from 'components/Header'
-import { About, Thread, Subreddit } from 'pages'
-
-export default () => (
-  <BrowserRouter basename={__dirname}>
-    <React.Fragment>
-      <Header />
-      <div className='main'>
-        <Switch>
-          <Route exact path='/' component={Subreddit} />
-          <Route path='/about' component={About} />
-          <Route path='/r/:subreddit/comments/:threadID/:junk/:commentID' component={Thread} />
-          <Route path='/r/:subreddit/comments/:threadID' component={Thread} />
-          <Route path='/r/:subreddit' component={Subreddit} />
-        </Switch>
-      </div>
-    </React.Fragment>
-  </BrowserRouter>
-)

src/index.js

@@ -2,12 +2,31 @@ import 'babel-polyfill'
 import React from 'react'
 import ReactDOM from 'react-dom'
 import { Provider } from 'react-redux'
-import { store } from 'state'
-import App from 'App'
+import { BrowserRouter, Switch, Route } from 'react-router-dom'
+
+import { store } from './state'
+
+import Header from './pages/common/Header'
+import About from './pages/about'
+import Subreddit from './pages/subreddit'
+import Thread from './pages/thread'
 
 ReactDOM.render(
   <Provider store={store}>
-    <App />
+    <BrowserRouter basename={__dirname}>
+      <React.Fragment>
+        <Header />
+        <div className='main'>
+          <Switch>
+            <Route exact path='/' component={Subreddit} />
+            <Route path='/about' component={About} />
+            <Route path='/r/:subreddit/comments/:threadID/:junk/:commentID' component={Thread} />
+            <Route path='/r/:subreddit/comments/:threadID' component={Thread} />
+            <Route path='/r/:subreddit' component={Subreddit} />
+          </Switch>
+        </div>
+      </React.Fragment>
+    </BrowserRouter>
   </Provider>,
   document.getElementById('app')
 )

src/pages/common/Header.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import { Link } from 'react-router-dom'
-import StatusBox from 'containers/StatusBox'
+import StatusBox from './StatusBox'
 
 export default () => (
   <header>

src/pages/index.js

@@ -1,3 +0,0 @@
-export { default as About } from './About'
-export { default as Subreddit } from './Subreddit'
-export { default as Thread } from './Thread'

src/pages/subreddit/index.js

@@ -2,7 +2,7 @@ import React from 'react'
 import { Link } from 'react-router-dom'
 import { getRemovedThreadIDs } from 'api/removeddit'
 import { getThreads } from 'api/reddit'
-import Post from 'components/Post'
+import Post from '../common/Post'
 
 const getSubredditForAPI = props => {
   const { subreddit = 'all' } = props.match.params

src/pages/thread/CommentSection.js

@@ -1,7 +1,7 @@
 import React from 'react'
-import Comment from 'components/Comment'
-import CommentInfo from 'components/CommentInfo'
-import SortBy from 'components/SortBy'
+import Comment from './Comment'
+import CommentInfo from './CommentInfo'
+import SortBy from './SortBy'
 import { connect } from 'react-redux'
 import {
   SORT_TOP, SORT_BOTTOM, SORT_NEW, SORT_OLD,

src/pages/thread/index.js

@@ -1,6 +1,6 @@
 import React from 'react'
-import Post from 'components/Post'
-import CommentSection from 'components/CommentSection'
+import Post from '../common/Post'
+import CommentSection from './CommentSection'
 import {
   getPost,
   getComments as getRedditComments