Merge pull request #3349 from Vizzuality/fix/404s

Fix/404s

Author: pjosh

app/assets/stylesheets/layouts/_static.scss

@@ -1,7 +1,5 @@
-// LAYOUT
-.layout-content {
- // padding: 0 15px;
-}
+
+/* eslint-disable */
 
 .loader-mobile{
   display: block;
@@ -107,6 +105,9 @@
   }
   .inner {
     padding: 0 15px;
+    &.-redirect {
+      text-align: center;
+    }
   }
   .row {
     display: flex;

app/javascript/pages/country/header/header-component.js

@@ -70,6 +70,7 @@ class Header extends PureComponent {
                 theme="theme-dropdown-dark"
                 placeholder="Country"
                 noItemsFound="No country found"
+                noSelectedValue="Country"
                 value={locationNames.country}
                 options={locationOptions.countries}
                 onChange={handleCountryChange}

app/javascript/pages/country/header/header.js

@@ -136,7 +136,11 @@ class HeaderContainer extends PureComponent {
     let secondSentence = '';
     if (data.extent > 0) {
       firstSentence = `
-        In 2010, <b>${location}</b> had <b>${extent}ha</b> of tree cover, extending over <b>${percentageCover}%</b> of its land area.
+        In 2010, <b>${location}</b> had <b>${
+        extent
+      }ha</b> of tree cover, extending over <b>${
+        percentageCover
+      }%</b> of its land area.
       `;
     } else {
       firstSentence = `
@@ -145,14 +149,16 @@ class HeaderContainer extends PureComponent {
     }
     if (data.extent > 0 && data.totalLoss.area) {
       secondSentence = `
-        In ${
-          data.totalLoss.year
-        }, it lost <b>${lossWithOutPlantations}ha</b> of forest${
-          data.plantationsLoss.area ? ' excluding tree plantations' : ''
-        }, equivalent to <b>${emissionsWithoutPlantations}t</b> of CO₂ of emissions.
+        In ${data.totalLoss.year}, it lost <b>${
+        lossWithOutPlantations
+      }ha</b> of forest${
+        data.plantationsLoss.area ? ' excluding tree plantations' : ''
+      }, equivalent to <b>${
+        emissionsWithoutPlantations
+      }t</b> of CO₂ of emissions.
       `;
     }
-    return `${firstSentence} ${secondSentence}`;
+    return `${location ? firstSentence : ''} ${secondSentence}`;
   };
 
   render() {

app/javascript/pages/country/root/root-component.js

@@ -72,6 +72,7 @@ class Root extends PureComponent {
           <div className="widgets">
             {loading && <Loader className="widgets-loader large" />}
             {!loading &&
+              currentLocation &&
               widgets &&
               widgets.length > 0 &&
               widgets.map(widget => (
@@ -82,12 +83,16 @@ class Root extends PureComponent {
                 />
               ))}
             {!loading &&
-              (!widgets || widgets.length === 0) && (
+              (!currentLocation || (!widgets || widgets.length === 0)) && (
                 <NoContent
                   className="no-widgets-message large"
-                  message={`${upperFirst(
-                    category
-                  )} data for ${currentLocation} coming soon`}
+                  message={
+                    currentLocation
+                      ? `${upperFirst(category)} data for ${
+                        currentLocation
+                      } coming soon`
+                      : 'Please select a country'
+                  }
                   icon
                 />
               )}

app/javascript/pages/country/router.js

@@ -1,4 +1,4 @@
-import { connectRoutes } from 'redux-first-router';
+import { connectRoutes, NOT_FOUND, redirect } from 'redux-first-router';
 import createHistory from 'history/createBrowserHistory';
 import queryString from 'query-string';
 import { setWidgetSettingsStore } from 'pages/country/widget/widget-actions';
@@ -26,6 +26,10 @@ export const routes = {
   },
   [COUNTRY]: {
     path: '/country/:country/:region?/:subRegion?'
+  },
+  [NOT_FOUND]: {
+    path: '/404',
+    thunk: dispatch => dispatch(redirect({ type: COUNTRY }))
   }
 };