feat: Demo Project/fix: duplicate vintage changed to projects

Chia-Network · Dec 2, 2021 · 6bace11 · 6bace11
1 parent 5e414d5
commit 6bace11
Show file tree

Hide file tree

Showing 10 changed files with 123 additions and 49 deletions.
diff --git a/src/mocks/project-locations.json b/src/mocks/project-locations.json
@@ -1,19 +1,19 @@
 [
   {
-    "in_country_region": true,
+    "in_country_region": "true",
     "host_country": "United States"
   },
   {
 
-    "in_country_region": true,
+    "in_country_region": "true",
     "host_country": "United States"
   },
   {
-    "in_country_region": false,
+    "in_country_region": "false",
     "host_country": "China"
   },
   {
-    "in_country_region": false,
+    "in_country_region": "false",
     "host_country": "Russia"
   },
   {

diff --git a/src/navigation/AppNavigator.js b/src/navigation/AppNavigator.js
@@ -40,7 +40,7 @@ const AppNavigator = () => {
             <Pages.Vintages />
           </Route>
           <Route exact path="/projects">
-            <Pages.Vintages />
+            <Pages.Projects />
           </Route>
         </Suspense>
       </Router>

diff --git a/src/pages/demo/CoBenefits/index.js b/src/pages/demo/CoBenefits/index.js
@@ -1,15 +1,26 @@
-import React from 'react';
-import { useIntl } from 'react-intl';
-
-import { Card, H3 } from '../../../components';
+import React,{useEffect} from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import { Card, DataTable } from '../../../components';
+import { getCoBenefits } from '../../../store/actions/climateWarehouseActions';
 
 const CoBenefits = () => {
-  const intl = useIntl();
+  const dispatch = useDispatch();
+  const climateWarehouseStore = useSelector(
+    store => store.climateWarehouse
+  );
+
+  useEffect(() => dispatch(getCoBenefits({ useMockedResponse: true })), []);
 
   return (
     <>
       <Card>
-        <H3>{intl.formatMessage({ id: 'hello-world' })}</H3>
+        <div>Co-Benefits</div>
+        {climateWarehouseStore.coBenefits && (
+          <DataTable
+            headings={['Co-Benefit']}
+            data={climateWarehouseStore.coBenefits}
+          />
+        )}
       </Card>
     </>
   );

diff --git a/src/pages/demo/Locations/index.js b/src/pages/demo/Locations/index.js
@@ -1,15 +1,25 @@
-import React from 'react';
-import { useIntl } from 'react-intl';
-
-import { Card, H3 } from '../../../components';
+import React,{ useEffect } from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import { DataTable } from '../../../components';
+import { Card } from '../../../components';
+import { getProjectLocations } from '../../../store/actions/climateWarehouseActions';
 
 const Locations = () => {
-  const intl = useIntl();
+  const dispatch = useDispatch();
+  const climateWarehouseStore = useSelector( store => store.climateWarehouse);
+
+  useEffect(() => dispatch(getProjectLocations({ useMockedResponse: true })), []);
 
   return (
     <>
       <Card>
-        <H3>{intl.formatMessage({ id: 'hello-world' })}</H3>
+        <div>Locations</div>
+        {climateWarehouseStore.projectLocations && (
+          <DataTable
+            headings={['in_country_region', 'host_country']}
+            data={climateWarehouseStore.projectLocations}
+          />
+        )}
       </Card>
     </>
   );

diff --git a/src/pages/demo/Projects/index.js b/src/pages/demo/Projects/index.js
@@ -1,15 +1,26 @@
-import React from 'react';
-import { useIntl } from 'react-intl';
-
-import { Card, H3 } from '../../../components';
+import React, { useEffect } from 'react';
+import { Card, DataTable } from '../../../components';
+import { useSelector, useDispatch } from 'react-redux';
+import { projectsResponseStub } from '../../../mocks';
+import { getProjects } from '../../../store/actions/climateWarehouseActions';
 
 const Projects = () => {
-  const intl = useIntl();
+  const dispatch = useDispatch();
+  const climateWarehouseStore = useSelector(
+    store => store.climateWarehouse
+  );
 
+  useEffect(() => dispatch(getProjects({ useMockedResponse: true })), []);
   return (
     <>
-      <Card>
-        <H3>{intl.formatMessage({ id: 'hello-world' })}</H3>
+       <Card>
+        <div>Projects</div>
+        {climateWarehouseStore.projects && (
+          <DataTable
+            headings={Object.keys(projectsResponseStub[0])}
+            data={climateWarehouseStore.projects}
+          />
+        )}
       </Card>
     </>
   );

diff --git a/src/pages/demo/Qualifications/index.js b/src/pages/demo/Qualifications/index.js
@@ -1,15 +1,26 @@
-import React from 'react';
-import { useIntl } from 'react-intl';
-
-import { Card, H3 } from '../../../components';
+import React, { useEffect } from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import { DataTable } from '../../../components';
+import { Card } from '../../../components';
+import { qualificationsResponseStub } from '../../../mocks';
+import { getQualifications } from '../../../store/actions/climateWarehouseActions';
 
 const Qualifications = () => {
-  const intl = useIntl();
+  const dispatch = useDispatch();
+  const climateWarehouseStore = useSelector(store => store.climateWarehouse);
+
+  useEffect(() => dispatch(getQualifications({ useMockedResponse: true })), []);
 
   return (
     <>
       <Card>
-        <H3>{intl.formatMessage({ id: 'hello-world' })}</H3>
+        <div>Qualifications</div>
+        {climateWarehouseStore.qualifications && (
+          <DataTable
+            headings={Object.keys(qualificationsResponseStub[0])}
+            data={climateWarehouseStore.qualifications}
+          />
+        )}
       </Card>
     </>
   );

diff --git a/src/pages/demo/Ratings/index.js b/src/pages/demo/Ratings/index.js
@@ -1,6 +1,5 @@
 import React, { useEffect } from 'react';
 import { getRatings } from '../../../store/actions/climateWarehouseActions';
-
 import { Card, DataTable } from '../../../components';
 import { useSelector, useDispatch } from 'react-redux';
 

diff --git a/src/pages/demo/RelatedProjects/index.js b/src/pages/demo/RelatedProjects/index.js
@@ -1,15 +1,27 @@
-import React from 'react';
-import { useIntl } from 'react-intl';
-
-import { Card, H3 } from '../../../components';
+import React, { useEffect } from 'react';
+import { Card, DataTable } from '../../../components';
+import { getRelatedProjects } from '../../../store/actions/climateWarehouseActions';
+import { useSelector, useDispatch } from 'react-redux';
+import { relatedProjectsResponseStub } from '../../../mocks';
 
 const RelatedProjects = () => {
-  const intl = useIntl();
+  const dispatch = useDispatch();
+  const climateWarehouseStore = useSelector(store => store.climateWarehouse);
 
+  useEffect(
+    () => dispatch(getRelatedProjects({ useMockedResponse: true })),
+    [],
+  );
   return (
     <>
       <Card>
-        <H3>{intl.formatMessage({ id: 'hello-world' })}</H3>
+        <div>Related Project</div>
+        {climateWarehouseStore.relatedProjects && (
+          <DataTable
+            headings={Object.keys(relatedProjectsResponseStub[0])}
+            data={climateWarehouseStore.relatedProjects}
+          />
+        )}
       </Card>
     </>
   );

diff --git a/src/pages/demo/Units/index.js b/src/pages/demo/Units/index.js
@@ -1,15 +1,25 @@
-import React from 'react';
-import { useIntl } from 'react-intl';
-
-import { Card, H3 } from '../../../components';
+import React, { useEffect } from 'react';
+import { Card, DataTable } from '../../../components';
+import { getUnits } from '../../../store/actions/climateWarehouseActions';
+import { useSelector, useDispatch } from 'react-redux';
+import { unitsResponseStub } from '../../../mocks';
 
 const Units = () => {
-  const intl = useIntl();
+  const dispatch = useDispatch();
+  const climateWarehouseStore = useSelector(store => store.climateWarehouse);
+
+  useEffect(() => dispatch(getUnits({ useMockedResponse: true })), []);
 
   return (
     <>
       <Card>
-        <H3>{intl.formatMessage({ id: 'hello-world' })}</H3>
+        <div>Units</div>
+        {climateWarehouseStore.units && (
+          <DataTable
+            headings={Object.keys(unitsResponseStub[0])}
+            data={climateWarehouseStore.units}
+          />
+        )}
       </Card>
     </>
   );

diff --git a/src/pages/demo/Vintages/index.js b/src/pages/demo/Vintages/index.js
@@ -1,15 +1,25 @@
-import React from 'react';
-import { useIntl } from 'react-intl';
-
-import { Card, H3 } from '../../../components';
+import React, { useEffect } from 'react';
+import { Card, DataTable } from '../../../components';
+import { useSelector, useDispatch } from 'react-redux';
+import { vintagesResponseStub } from '../../../mocks';
+import { getVintages } from '../../../store/actions/climateWarehouseActions';
 
 const Vintages = () => {
-  const intl = useIntl();
+  const dispatch = useDispatch();
+  const climateWarehouseStore = useSelector(store => store.climateWarehouse);
+
+  useEffect(() => dispatch(getVintages({ useMockedResponse: true })), []);
 
   return (
     <>
       <Card>
-        <H3>{intl.formatMessage({ id: 'hello-world' })}</H3>
+        <div>Vintages</div>
+        {climateWarehouseStore.vintages && (
+          <DataTable
+            headings={Object.keys(vintagesResponseStub[0])}
+            data={climateWarehouseStore.vintages}
+          />
+        )}
       </Card>
     </>
   );