Integrate resources to the project detail page #64

ProjectDrawdown · Oct 4, 2021 · 7bc8880 · 7bc8880
1 parent 5ae13d7
commit 7bc8880
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 4 deletions.
diff --git a/...projectdrawdown-png-link-projectdrawdown-com-projects-list-adsdsasdsadasdasd.md b/...projectdrawdown-png-link-projectdrawdown-com-projects-list-adsdsasdsadasdasd.md
@@ -4,5 +4,5 @@ description: just testing the external PR flow
 file: img/projectdrawdown.png
 link: projectdrawdown.com
 projects:
-  - adssdadsadsads
+  - adsdsasdsadasdasd
 ---
diff --git a/pages/projects/[id].js b/pages/projects/[id].js
@@ -4,6 +4,7 @@ import PropTypes from 'prop-types'
 import { Link, Heading, Text, Box, Avatar, Grid, GridItem } from "@chakra-ui/react"
 import matter from 'gray-matter';
 import StyledButton from '../../components/StyledButton';
+import getStaticFilesFrontMatter from '../../getStatic';
 
 function Post({
   data
@@ -47,7 +48,18 @@ function Post({
           <Heading as="h3" size="md" marginTop="5vh"> Collaborators: </Heading>
           <Avatar name="Dan Abrahmov" src="https://bit.ly/dan-abramov" marginTop="2vh" />
           <Heading as="h3" size="md" marginTop="5vh"> Hub resources: </Heading>
-          <Text fontSize="20px" marginTop="2vh">No resources.</Text>
+          <Text fontSize="20px" marginTop="2vh">
+            <ul>
+            {data.resources.map((resource, k) => (
+              <li key={k}>
+                <b>{resource.name}</b>
+                <p>{resource.description}</p>
+                <a href={resource.file}>{resource.file}</a>
+                <a href={resource.link}>{resource.link}</a>
+              </li>
+            ))}
+            </ul>
+          </Text>
         </Box>
         <Box position="relative"
         h={["250px", "250px", "500px"]}
@@ -80,9 +92,18 @@ export const getStaticPaths = async () => {
 export const getStaticProps = async ({ params }) => {
   const slug = params.id;
   const source = fs.readFileSync('projects/' + slug + '.md', "utf8");
-  const data = matter(source)
+  const data = matter(source).data;
+
+  const resources = await getStaticFilesFrontMatter("_resources");
+
+  const associatedResources = resources.filter((resource) => {
+    return resource && resource.projects && resource.projects.indexOf(data.name) !== -1;
+  });
+
+  data["resources"] = associatedResources
+
   return {
-    props: { data: data.data },
+    props: { data: data},
   };
 };