added second level categories

Author: jackreichert

bundle.js

@@ -28733,10 +28733,12 @@
 	    _react2.default.createElement(_reactRouter.IndexRoute, { component: _blog2.default }),
 	    _react2.default.createElement(_reactRouter.Route, { path: 'page/:pageNum', component: _blog2.default, addHandlerKey: true }),
 	    _react2.default.createElement(_reactRouter.Route, { path: 'search/:term', component: _search2.default }),
-	    _react2.default.createElement(_reactRouter.Route, { path: 'category/:slug', component: _category2.default }),
-	    _react2.default.createElement(_reactRouter.Route, { path: 'category/:slug/:pageNum', component: _category2.default }),
+	    _react2.default.createElement(_reactRouter.Route, { path: 'category/:slug/', component: _category2.default }),
+	    _react2.default.createElement(_reactRouter.Route, { path: 'category/:parent/:slug/', component: _category2.default }),
+	    _react2.default.createElement(_reactRouter.Route, { path: 'category/:slug/:pageNum(\\\\d+)', component: _category2.default }),
+	    _react2.default.createElement(_reactRouter.Route, { path: 'category/:parent/:slug/:pageNum(\\\\d+)', component: _category2.default }),
 	    _react2.default.createElement(_reactRouter.Route, { path: 'tag/:slug', component: _tag2.default }),
-	    _react2.default.createElement(_reactRouter.Route, { path: 'tag/:slug/:pageNum', component: _tag2.default }),
+	    _react2.default.createElement(_reactRouter.Route, { path: 'tag/:slug/:pageNum(\\\\d+)', component: _tag2.default }),
 	    _react2.default.createElement(_reactRouter.Route, { path: '*', component: _single2.default })
 	);
 
@@ -30529,13 +30531,6 @@
 	            return _react2.default.createElement(
 	                'header',
 	                { className: 'navbar navbar-toggleable-sm navbar-light bg-faded' },
-	                _react2.default.createElement(
-	                    'button',
-	                    { className: 'navbar-toggler navbar-toggler-right', type: 'button', 'data-toggle': 'collapse',
-	                        'data-target': '#navbarSupportedContent', 'aria-controls': 'navbarSupportedContent',
-	                        'aria-expanded': 'false', 'aria-label': 'Toggle navigation' },
-	                    _react2.default.createElement('span', { className: 'navbar-toggler-icon' })
-	                ),
 	                _react2.default.createElement(
 	                    'h1',
 	                    { className: 'navbar-brand' },
@@ -33264,7 +33259,7 @@
 	                            { key: cat.term_id },
 	                            _react2.default.createElement(
 	                                _reactRouter.Link,
-	                                { to: '/category/' + cat.slug, className: 'cat-links' },
+	                                { to: _this2.getCategoryPath(cat.link), className: 'cat-links' },
 	                                cat.name
 	                            ),
 	                            1 < _this2.props.categories.length && i < _this2.props.categories.length - 1 ? ', ' : ''
@@ -33273,6 +33268,13 @@
 	                });
 	            }
 	        }
+	    }, {
+	        key: 'getCategoryPath',
+	        value: function getCategoryPath(link) {
+	            var el = document.createElement('a');
+	            el.href = link;
+	            return el.pathname;
+	        }
 	    }, {
 	        key: 'renderDates',
 	        value: function renderDates() {
@@ -34107,6 +34109,7 @@
 	    _createClass(Category, [{
 	        key: 'componentWillMount',
 	        value: function componentWillMount() {
+	            console.log("SLUG", this.props.params.slug);
 	            this.props.getTaxIdFromSlug('categories', this.props.params.slug);
 	        }
 	    }, {

lib/theme-enqueue.php

@@ -22,15 +22,23 @@ function bootstrap() {
 		function theme() {
 			wp_enqueue_script( 'ReactTheme-js', get_template_directory_uri() . '/bundle.js', [ 'jquery' ], date( 'YmdHis' ), true );
 			wp_localize_script( 'ReactTheme-js', 'RT_API', array(
-				'root'       => esc_url_raw( rest_url() ),
-				'nonce'      => wp_create_nonce( 'wp_rest' ),
-				'siteName'   => get_bloginfo( 'name' ),
-				'siteDescription'   => get_bloginfo( 'description' ),
-				'categories' => get_categories( [ 'hide_empty' => 0 ] ),
-				'current_user' => wp_get_current_user()
+				'root'            => esc_url_raw( rest_url() ),
+				'nonce'           => wp_create_nonce( 'wp_rest' ),
+				'siteName'        => get_bloginfo( 'name' ),
+				'siteDescription' => get_bloginfo( 'description' ),
+				'categories'      => $this->get_categories_with_links(),
+				'current_user'    => wp_get_current_user()
 			) );
 			wp_enqueue_style( get_stylesheet(), get_template_directory_uri() . '/bundle.css' );
 		}
+
+		function get_categories_with_links() {
+			$categories = get_categories( [ 'hide_empty' => 0 ] );
+			foreach ( $categories as $i => $category ) {
+				$categories[ $i ]->link = get_category_link( $category->term_id );
+			}
+			return $categories;
+		}
 	}
 
 endif;

src/components/main/article/meta.js

@@ -7,14 +7,20 @@ export default class Meta extends Component {
             return this.props.categories.map((cat, i) => {
                 if (1 == this.props.categories.length || cat.slug !== 'uncategorized') {
                     return (<span key={cat.term_id}>
-                        <Link to={`/category/${cat.slug}`} className="cat-links">{cat.name}</Link>
+                        <Link to={this.getCategoryPath(cat.link)} className="cat-links">{cat.name}</Link>
                         {(1 < this.props.categories.length && i < (this.props.categories.length - 1)) ? ', ' : ''}
                         </span>);
                 }
             });
         }
     }
 
+    getCategoryPath(link) {
+        var el = document.createElement('a');
+        el.href = link;
+        return el.pathname;
+    }
+
     renderDates() {
         if ('post' === this.props.type && this.props.isSingle ) {
             return  <span> | <time dateTime={this.props.date.substring(0,10)}>{this.props.formattedDate}</time></span>;

src/containers/category.js

@@ -9,6 +9,7 @@ import Footer from '../components/footer';
 
 class Category extends Component {
     componentWillMount() {
+        console.log("SLUG",this.props.params.slug);
         this.props.getTaxIdFromSlug('categories', this.props.params.slug);
     }
 

src/routes.js

@@ -12,10 +12,12 @@ export default (
         <IndexRoute component={Blog}/>
         <Route path="page/:pageNum" component={Blog} addHandlerKey={true}/>
         <Route path="search/:term" component={Search}/>
-        <Route path="category/:slug" component={Category}/>
-        <Route path="category/:slug/:pageNum" component={Category}/>
+        <Route path="category/:slug/" component={Category}/>
+        <Route path="category/:parent/:slug/" component={Category}/>
+        <Route path="category/:slug/:pageNum(\\d+)" component={Category}/>
+        <Route path="category/:parent/:slug/:pageNum(\\d+)" component={Category}/>
         <Route path="tag/:slug" component={Tag}/>
-        <Route path="tag/:slug/:pageNum" component={Tag}/>
+        <Route path="tag/:slug/:pageNum(\\d+)" component={Tag}/>
         <Route path="*" component={Single}/>
     </Route>
 );