Merge pull request #4706 from wri/develop

PROD Deploy 2023-10-12 12:57pm EST

package.json

@@ -94,7 +94,7 @@
     "@next/bundle-analyzer": "^10.0.1",
     "@reduxjs/toolkit": "^1.4.0",
     "@wordpress/api-fetch": "^3.19.1",
-    "@worldresources/gfw-components": "^3.2.2",
+    "@worldresources/gfw-components": "^3.4.0",
     "aws-sdk": "^2.291.0",
     "axios": "^0.21.1",
     "chroma-js": "^2.1.0",

pages/about.js

@@ -1,13 +1,18 @@
 import PageWrapper from 'wrappers/page';
 import About from 'layouts/about';
 
+import PropTypes from 'prop-types';
+
 import { getImpactProjects, getSGFProjects } from 'services/projects';
 import { getCountriesProvider } from 'services/country';
 
+import { getPublishedNotifications } from 'services/notifications';
+
 const AboutPage = (props) => (
   <PageWrapper
     title="About GFW | Global Forest Watch"
     description="Global Forest Watch is an online platform that provides data and tools for monitoring forests."
+    notifications={props.notifications}
   >
     <About {...props} />
   </PageWrapper>
@@ -17,14 +22,21 @@ export const getStaticProps = async () => {
   const { sgfProjects } = await getSGFProjects({ params: { per_page: 100 } });
   const impactProjects = await getImpactProjects();
   const countries = await getCountriesProvider();
+  const notifications = await getPublishedNotifications();
 
   return {
     props: {
       impactProjects,
       sgfProjects,
       countries: countries?.data?.rows,
+      notifications: notifications || [],
     },
+    revalidate: 10,
   };
 };
 
+AboutPage.propTypes = {
+  notifications: PropTypes.array,
+};
+
 export default AboutPage;

pages/index.js

@@ -31,6 +31,7 @@ export const getStaticProps = async () => {
       news: newsArticles || [],
       notifications: notifications || [],
     },
+    revalidate: 10,
   };
 };
 

pages/my-gfw.js

@@ -23,6 +23,7 @@ export const getStaticProps = async () => {
     props: {
       notifications: notifications || [],
     },
+    revalidate: 10,
   };
 };
 

pages/search.js

@@ -1,14 +1,34 @@
 import PageLayout from 'wrappers/page';
 import Search from 'layouts/search';
 
-const SearchPage = () => (
+import PropTypes from 'prop-types';
+
+import { getPublishedNotifications } from 'services/notifications';
+
+const SearchPage = (props) => (
   <PageLayout
     title="Search | Global Forest Watch"
     description="Search forest information, including forest data, news, updates and more."
+    notifications={props.notifications}
     noIndex
   >
     <Search />
   </PageLayout>
 );
 
+// eslint-disable-next-line no-unused-vars
+export const getServerSideProps = async ({ params, query, req }) => {
+  const notifications = await getPublishedNotifications();
+
+  return {
+    props: {
+      notifications: notifications || [],
+    },
+  };
+};
+
+SearchPage.propTypes = {
+  notifications: PropTypes.array,
+};
+
 export default SearchPage;

wrappers/fullscreen/component.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useRouter } from 'next/router';
+import dynamic from 'next/dynamic';
 import { Loader, MediaContextProvider } from '@worldresources/gfw-components';
 import cx from 'classnames';
 
@@ -10,10 +11,11 @@ import { useSetLanguage } from 'utils/lang';
 import Head from 'wrappers/head';
 import Cookies from 'wrappers/cookies';
 
-import Header from 'components/header';
 import ContactUsModal from 'components/modals/contact-us';
 import ErrorMessage from 'components/error-message';
 
+const Header = dynamic(() => import('components/header'), { ssr: false });
+
 const FullScreenWrapper = ({
   children,
   title,

wrappers/page/component.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useRouter } from 'next/router';
+import dynamic from 'next/dynamic';
 import { Loader, MediaContextProvider } from '@worldresources/gfw-components';
 import cx from 'classnames';
 
@@ -10,11 +11,12 @@ import { useSetLanguage } from 'utils/lang';
 import Head from 'wrappers/head';
 import Cookies from 'wrappers/cookies';
 
-import Header from 'components/header';
 import Footer from 'components/footer';
 import ContactUsModal from 'components/modals/contact-us';
 import ErrorMessage from 'components/error-message';
 
+const Header = dynamic(() => import('components/header'), { ssr: false });
+
 const PageWrapper = ({
   children,
   showFooter,

yarn.lock

@@ -3945,10 +3945,10 @@
     lodash "^4.17.19"
     react-native-url-polyfill "^1.1.2"
 
-"@worldresources/gfw-components@^3.2.2":
-  version "3.2.2"
-  resolved "https://registry.yarnpkg.com/@worldresources/gfw-components/-/gfw-components-3.2.2.tgz#3f0992d9beec5520dc71c03ae7858f3f3ec1cc41"
-  integrity sha512-8QlZWhbgEqWAvQdK+6KF8YvVrKyhSTg7xdxL+sawTCdiPcw37GqhSIUbqWG7c6ltQ1AYDcTTibBS/Y/TttQYuQ==
+"@worldresources/gfw-components@^3.4.0":
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/@worldresources/gfw-components/-/gfw-components-3.4.0.tgz#06ff95f00fa4b52f2fcf15739c5ddba8c52780f2"
+  integrity sha512-w9s2eYA/cVjXhKdaKr3hlkiWKkaZFSd5XAbIqUv8fZlIRp3cbNgRTYaSXene+NhScYc2NjBKye2hF5MveUU1JQ==
   dependencies:
     "@artsy/fresnel" "^1.1.0"
     "@tippyjs/react" "^4.0.2"