From 7bc8880cc37ce45729e321d9b6693f21b7d4ff02 Mon Sep 17 00:00:00 2001
From: David Brooks <david@colab.coop>
Date: Mon, 4 Oct 2021 12:19:20 -0500
Subject: [PATCH] Integrate resources to the project detail page #64

---
 ...own-com-projects-list-adsdsasdsadasdasd.md |  2 +-
 pages/projects/[id].js                        | 27 ++++++++++++++++---
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/_resources/map-name-a-test-resource-description-just-testing-the-external-pr-flow-file-img-projectdrawdown-png-link-projectdrawdown-com-projects-list-adsdsasdsadasdasd.md b/_resources/map-name-a-test-resource-description-just-testing-the-external-pr-flow-file-img-projectdrawdown-png-link-projectdrawdown-com-projects-list-adsdsasdsadasdasd.md
index eacd7c2..13b8733 100644
--- a/_resources/map-name-a-test-resource-description-just-testing-the-external-pr-flow-file-img-projectdrawdown-png-link-projectdrawdown-com-projects-list-adsdsasdsadasdasd.md
+++ b/_resources/map-name-a-test-resource-description-just-testing-the-external-pr-flow-file-img-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
index aabd7c9..9b1f698 100644
--- 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},
   };
 };