Merge pull request #8 from Urban-Analytics-Technology-Platform/people

Adding people collection and stubbing out some entries

src/components/PersonLink.astro

@@ -0,0 +1,16 @@
+---
+import type { CollectionEntry } from "astro:content";
+interface Props {
+  person: CollectionEntry<"people">;
+}
+
+const { person } = Astro.props;
+---
+
+{
+  person && (
+    <a href={"/people/" + person.slug}>
+      {[person.data.firstName, person.data.lastName].join(" ")}{" "}
+    </a>
+  )
+}

src/content/config.ts

@@ -1,4 +1,4 @@
-import { z, defineCollection } from "astro:content";
+import { z, defineCollection, reference } from "astro:content";
 
 export const collections = {
   project: defineCollection({
@@ -16,6 +16,16 @@ export const collections = {
       github: z.string(),
       tags: z.array(z.string()),
       draft: z.boolean().default(false),
+      funders: z.string().optional(),
+      pis: z.array(reference("people")).optional(),
+      team: z.array(reference("people")).optional(),
+    }),
+  }),
+  people: defineCollection({
+    schema: z.object({
+      firstName: z.string(),
+      lastName: z.string(),
+      avatarURL: z.string(),
     }),
   }),
 };

src/content/people/dani_arribas_bel.md

@@ -0,0 +1,5 @@
+---
+firstName: "Dani"
+lastName: "Arribas-Bel"
+avatarURL: ""
+---

src/content/people/falli_palaiologou.md

@@ -0,0 +1,5 @@
+---
+firstName: "Falli"
+lastName: "Palaiologou"
+avatarURL: ""
+---

src/content/people/hadrien_salat.md

@@ -0,0 +1,5 @@
+---
+firstName: "Hadrien"
+lastName: "Salat"
+avatarURL: ""
+---

src/content/people/jon_yong.md

@@ -0,0 +1,5 @@
+---
+firstName: "Jon"
+lastName: "Yong"
+avatarURL: ""
+---

src/content/people/mark_birkin.md

@@ -0,0 +1,5 @@
+---
+firstName: "Mark"
+lastName: "Birkin"
+avatarURL: ""
+---

src/content/people/martin_fleischmann.md

@@ -0,0 +1,5 @@
+---
+firstName: "Martin"
+lastName: "Fleischmann"
+avatarURL: ""
+---

src/content/people/mike_simpson.md

@@ -0,0 +1,5 @@
+---
+firstName: "Mike"
+lastName: "Simpson"
+avatarURL: ""
+---

src/content/people/polly_hudson.md

@@ -0,0 +1,5 @@
+---
+firstName: "Polly"
+lastName: "Hudson"
+avatarURL: ""
+---

src/content/people/sam_greenbury.md

@@ -0,0 +1,5 @@
+---
+firstName: "Sam"
+lastName: "Greenbury"
+avatarURL: ""
+---

src/content/people/stuart_lynn.md

@@ -0,0 +1,7 @@
+---
+firstName: "Stuart"
+lastName: "Lynn"
+avatarURL: "https://pbs.twimg.com/profile_images/2392941891/anq5bkkx8rtdhn8p2i9m_400x400.png"
+---
+
+Stuart Lynn is a developer, data scientist and tinkerer whose interests involve widening the participation in scientific discussion and inquiry to non-traditional communities through the development of tools and active participation in citizen science and collaborative processes. He holds a Master in Mathematical Physics and a PHD in Astrophysics from the University of Edinburgh. In previous roles he has worked with non-profits and NGOs with the Two Sigma Data Clinic, lead the Data Science team at CARTO and was the technical lead for the citizen science platform The Zooniverse. He is the lead developer of the Matico project and has built a number of other open source tools focused on understanding and using data.

src/content/project/colouring_cities.md

@@ -1,16 +1,21 @@
 ---
-name: 'Colouring Cities/Colouring London'
-description: 'Colouring Cities/Colouring London'
+name: "Colouring Cities/Colouring London"
+description: "Colouring Cities/Colouring London"
 image:
-    url: 'https://alan-turing-institute.github.io/demoland-web/assets/map-7fd64ded.png'
-    alt: 'Screenshot showing the demoland application'
+  url: "https://alan-turing-institute.github.io/demoland-web/assets/map-7fd64ded.png"
+  alt: "Screenshot showing the demoland application"
 tags: ["modelling", "quality of life", "land use"]
 github: "https://github.com/alan-turing-institute/demoland-web"
 link: "https://colouringlondon.org/"
 tier: 2
+pi:
+  - polly_hudson
+team:
+  - falli_palaiologou
+  - mike_simpson
+funders: "SoCaR"
 ---
 
 Colouring London is a free knowledge exchange platform designed to provide over fifty types of open data on buildings in the city, to help make the city more sustainable.
 
-
 <iframe  style="width:100%;min-height:500px" src="https://colouringlondon.org/" title="demoland"/>

src/content/project/demoland.md

@@ -8,6 +8,13 @@ tags: ["modelling", "quality of life", "land use"]
 github: "https://github.com/alan-turing-institute/demoland-web"
 link: "https://alan-turing-institute.github.io/demoland-web/#10.05/54.94/-1.59"
 tier: 1
+funders: "Geospatial Comission"
+pis:
+  - dani_arribas_bel
+team:
+  - stuart_lynn
+  - martin_fleischmann
+  - jon_yong
 ---
 
 This interactive app showcases the outcomes of the Land Use Demonstrator project, which seeks to develop a modelling system leveraging data science and AI to support decision-making in land use policy.

src/content/project/spc.md

@@ -1,12 +1,17 @@
 ---
-name: 'Synthetic Population Catalyst (SPC)'
-description: 'A tool to model individual UK people and their activities, combining a variety of data sources and methods. SPC generates rich synthetic populations for the whole of Britain, with demographic, health, activity information.'
+name: "Synthetic Population Catalyst (SPC)"
+description: "A tool to model individual UK people and their activities, combining a variety of data sources and methods. SPC generates rich synthetic populations for the whole of Britain, with demographic, health, activity information."
 image:
-    url: 'https://github.com/alan-turing-institute/uatk-spc/raw/main/docs/img/SPC_Schema.png'
-    alt: 'Diagram showing the process of generating a sythetic population'
-tags: ["modelling","populations","synthetic"]
+  url: "https://github.com/alan-turing-institute/uatk-spc/raw/main/docs/img/SPC_Schema.png"
+  alt: "Diagram showing the process of generating a sythetic population"
+tags: ["modelling", "populations", "synthetic"]
 github: "https://github.com/alan-turing-institute/demoland-web"
 link: "https://github.com/alan-turing-institute/uatk-spc"
 tier: 2
+funders: "SoCaR"
+pis:
+  - mark_birkin
+team:
+  - hadrien_salat
+  - sam_greenbury
 ---
-

src/pages/people/[...slug].astro

@@ -0,0 +1,60 @@
+---
+import { getCollection, getEntry, getEntries } from "astro:content";
+import Base from "../../layouts/Base.astro";
+import ProjectCard from "../../components/ProjectCard.astro";
+
+export async function getStaticPaths() {
+  const project = await getCollection("people");
+  return project.map((entry) => ({
+    params: { slug: entry.slug },
+    props: { entry },
+  }));
+}
+
+const { entry } = Astro.props;
+const { Content } = await entry.render();
+const projects = await getCollection("project");
+const projectsForPerson = projects.filter(
+  (project) =>
+    project.data.pis?.find((t) => t.slug === entry.slug) ||
+    project.data.team?.find((t) => t.slug === entry.slug),
+);
+---
+
+<Base>
+  <section class="wrapper style1">
+    <div class="container">
+      <div class="row gtr-200">
+        <div class="col-3 col-12-narrower">
+          <div id="sidebar">
+            <section>
+              <h3>{[entry.data.firstName, entry.data.lastName].join(" ")}</h3>
+            </section>
+            <section>
+              <img src={entry.data.avatarURL} />
+            </section>
+          </div>
+        </div>
+
+        <div class="col-9 col-12-narrower imp-narrower">
+          <div id="content">
+            <article>
+              <header>
+                <h2>Bio</h2>
+              </header>
+              <Content />
+              <header>
+                <h2>Projects</h2>
+              </header>
+              <pre>
+                {projectsForPerson.map(project=>(
+                  <ProjectCard project={project} />
+                ))}
+              </pre>
+            </article>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+</Base>

src/pages/projects/[...slug].astro

@@ -1,6 +1,7 @@
 ---
-import { getCollection } from "astro:content";
+import { getCollection, getEntry, getEntries } from "astro:content";
 import Base from "../../layouts/Base.astro";
+import PersonLink from "../../components/PersonLink.astro";
 
 export async function getStaticPaths() {
   const project = await getCollection("project");
@@ -11,6 +12,8 @@ export async function getStaticPaths() {
 }
 
 const { entry } = Astro.props;
+const pis = await getEntries(entry.data.pis);
+const team = await getEntries(entry.data.team);
 const { Content } = await entry.render();
 ---
 
@@ -22,8 +25,19 @@ const { Content } = await entry.render();
           <div id="sidebar">
             <section>
               <h3>Summary</h3>
-              <p>Principal investigator: <code>entry.data.pi</code></p>
-              <p>Funders: <code>entry.data.funders</code></p>
+              <p>
+                Principal investigator: <br />
+                {
+                  pis &&
+                    pis.map((pi) => (
+                      // @ts-ignore
+                      <code>
+                        <PersonLink person={pi} />
+                      </code>
+                    ))
+                }
+              </p>
+              <p>Funders: <br /> <code>{entry.data.funders}</code></p>
               <footer></footer>
             </section>
 
@@ -34,6 +48,22 @@ const { Content } = await entry.render();
                 <li><a href={entry.data.link}>Web app</a></li>
               </ul>
             </section>
+
+            <section>
+              <h3>Team</h3>
+              <ul class="links">
+                {
+                  team.map((member) => (
+                    // @ts-ignore
+                    <li>
+                      <a href="">
+                        <PersonLink person={member} />
+                      </a>
+                    </li>
+                  ))
+                }
+              </ul>
+            </section>
           </div>
         </div>
 
@@ -44,9 +74,11 @@ const { Content } = await entry.render();
                 <h2>{entry.data.name}</h2>
                 <p>{entry.data.description}</p>
               </header>
-                {entry.data.image &&
+              {
+                entry.data.image && (
                   <img src={entry.data.image.url} alt={entry.data.image.alt} />
-                }
+                )
+              }
               <Content />
             </article>
           </div>