+ {Boolean(title) &&
+
{ title } | RENCI.org
+ }
+
{/* Add meta tags for SEO*/}
{/* Display content sections */}
@@ -81,6 +87,7 @@ export async function getServerSideProps(context) {
sections: contentSections,
metadata: pageData.metaData,
global: globalLocale,
+ title: pageData.title,
pageContext: {
...pageContext,
// localizedPaths,
diff --git a/pages/index.js b/pages/index.js
index 85adc18f..8fe7eb59 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -1,13 +1,16 @@
import { Fragment } from 'react'
import Head from 'next/head'
import Image from 'next/image'
-import { Typography } from '@mui/material'
+import { Typography, Stack } from '@mui/material'
import { Link, Page } from '../components'
import homeHero from '../images/racks.jpg'
import { ProjectSpotlight } from '../components/projectSpotlight'
import { fetchDashboardProjects } from "@/lib/dashboard/projects";
+import { fetchHomeNews } from '../lib/strapi'
+import { HomePageArticlePreview } from "../components/news/article-preview";
+
+export default function Home({ selectedProjects, newsArray }) {
-export default function Home({ selectedProjects}) {
return (
+ {
+ newsArray && (
+
+ Recent News
+
+ { newsArray.map((article, i) => (
+
+ ))}
+
+
+ )
+ }
+
)
}
export async function getServerSideProps({ res }) {
- res.setHeader(
- 'Cache-Control',
- 'no-cache, no-store, must-revalidate'
- )
+ try {
+ res.setHeader(
+ 'Cache-Control',
+ 'no-cache, no-store, must-revalidate'
+ )
- const projects = await fetchDashboardProjects()
-
- let projectsCopy = [...projects]
- let projectSelection = []
- for (let i = 0; i < 3; i += 1) {
- const randomIndex = Math.floor(Math.random() * projectsCopy.length)
- const randomProject = projectsCopy.splice(randomIndex, 1)[0]
- //add a property that is a snippet of the original description before pushing to the array
- projectSelection.push({
- ...randomProject,
- })
- }
+ const [newsArray, projects] = await Promise.all([
+ fetchHomeNews(),
+ fetchDashboardProjects(),
+ ]);
+
+ let projectsCopy = [...projects]
+ let projectSelection = []
+ for (let i = 0; i < 3; i += 1) {
+ const randomIndex = Math.floor(Math.random() * projectsCopy.length)
+ const randomProject = projectsCopy.splice(randomIndex, 1)[0]
+ //add a property that is a snippet of the original description before pushing to the array
+ projectSelection.push({
+ ...randomProject,
+ })
+ }
- return {
- props: { selectedProjects: JSON.parse(JSON.stringify(projectSelection)) },
+ return {
+ props: {
+ selectedProjects: JSON.parse(JSON.stringify(projectSelection)),
+ newsArray: JSON.parse(JSON.stringify(newsArray))
+ },
+ }
+ } catch (error) {
+ console.error('Error fetching data:', error);
+ return {
+ props: { selectedProjects: [], newsArray: [] }
+ };
}
}
diff --git a/pages/news/[year]/[month]/[day]/[slug].js b/pages/news/[year]/[month]/[day]/[slug].js
index daf7fe86..d1d8e67f 100644
--- a/pages/news/[year]/[month]/[day]/[slug].js
+++ b/pages/news/[year]/[month]/[day]/[slug].js
@@ -1,15 +1,17 @@
import { Fragment } from "react"
import { Page, Section } from "@/components/layout";
import { fetchArticle, fetchStrapiGraphQL } from "@/lib/strapi";
-import { Divider, Typography, Box, Stack } from "@mui/material";
+import { Divider, Typography, Stack, styled, Avatar } from "@mui/material";
import { Markdown } from "@/components/markdown";
import Image from "next/image";
import { ArticleDate } from "@/components/news/article-date"
import { Tag } from "@/components/news/tag"
import qs from "qs";
import { Link } from "@/components/link"
+import { useRouter } from "next/router";
export default function Article({ article }) {
+ const router = useRouter();
const tags = [
article.projects.map((x) => ({ ...x, type: 'projects' })),
@@ -24,6 +26,11 @@ export default function Article({ article }) {
return `/news?${qs.stringify({[type]: id})}`
}
+ let authors = [
+ ...article.renciAuthors,
+ ...article.externalAuthors?.split(",").map((a) => a.trim()) ?? []
+ ]
+
return (
@@ -60,17 +67,35 @@ export default function Article({ article }) {
const id = type === 'postTags' ? name : slug;
return (
-
-
-
+ { router.push(createTagLinkURL(id, type)); }}
+ sx={{ maxWidth: 'revert', cursor: 'pointer' }}
+ />
)
})}
+ {Boolean(authors.length) &&
+ {authors.reduce((acc, a, i) => {
+ let out;
+ if (typeof a === "string") out = {a};
+ else if (!a.active) out = {a.name};
+ else out =
+
+ {Boolean(a.photo) && }
+ {a.name}
+
+
+
+ acc.push(out);
+ if(i < authors.length - 1) acc.push("·");
+ return acc;
+ }, [])}
+ }
+
@@ -78,15 +103,18 @@ export default function Article({ article }) {
{
article.content.map((item)=> {
return item.__typename == "ComponentPostSectionsImage" ? (
-
+
+
+ {item.caption}
+
) : (
{item.content}
)
@@ -95,64 +123,80 @@ export default function Article({ article }) {
-
-
-
- {article.researchGroups[0] && (
-
- Research Groups:
-
- {
- article.researchGroups.map((item, i) => (
- - {item.name}
- ))
- }
-
-
-
- )}
- {article.collaborations[0] && (
+ {
+ ( article.researchGroups[0] || article.collaborations[0] || article.projects[0] || article.people[0] ) && (
- Collaborations:
-
- {
- article.collaborations.map((item, i) => (
- - {item.name}
- ))
- }
-
-
+
+
+
+ {article.researchGroups[0] && (
+
+ Research Groups
+
+ {
+ article.researchGroups.map((item, i) => (
+ - {item.name}
+ ))
+ }
+
+
+ )}
+ {article.collaborations[0] && (
+
+ Collaborations
+
+ {
+ article.collaborations.map((item, i) => (
+ - {item.name}
+ ))
+ }
+
+
+ )}
+ {article.projects[0] && (
+
+ Projects
+
+ {
+ article.projects.map((item, i) => (
+ - {item.name}
+ ))
+ }
+
+
+ )}
+ {article.people[0] && (
+
+ People
+
+ {
+ article.people.map((item, i) => (
+ - {item.name}
+ ))
+ }
+
+
+ )}
+
- )}
- {article.projects[0] && (
-
- Projects:
- {
- article.projects.map((item, i) => (
- {item.name}
- ))
- }
-
-
- )}
- {article.people[0] && (
-
- People:
-
- {
- article.people.map((item, i) => (
- - {item.name}
- ))
- }
-
-
-
- )}
-
+ )
+ }
)
}
+const Figure = styled('figure')`
+ margin: 1rem 0;
+ display: flex;
+ flex-direction: column;
+ gap: 8px;
+
+ & figcaption.MuiTypography-root {
+ align-self: center;
+ font-style: italic;
+ }
+`;
+
export async function getStaticPaths() {
const postsGql = await fetchStrapiGraphQL(`query {
posts(pagination: { limit: 1000 }, sort: "publishDate:desc") {
diff --git a/pages/news/index.js b/pages/news/index.js
index d8432413..a410d54d 100644
--- a/pages/news/index.js
+++ b/pages/news/index.js
@@ -111,7 +111,7 @@ export default function News() {
const isTagSelected = useCallback((id, type) => {
if (id === undefined || type === undefined) return false;
return selectedTags[type]?.find((tag) => (
- tag[type === 'freeSearch' ? 'name' : 'slug'] === id
+ tag[type === 'freeSearch' || type === 'postTags' ? 'name' : 'slug'] === id
)) !== undefined;
}, [selectedTags]);
diff --git a/pages/people/[slug].js b/pages/people/[slug].js
index d80bcb20..fb885757 100644
--- a/pages/people/[slug].js
+++ b/pages/people/[slug].js
@@ -73,8 +73,8 @@ export default function Person({ person }) {
{
person.contributions.projects && (
- Projects
-
+ Projects
+
{
person.contributions.projects.map(project => (
-
@@ -86,12 +86,11 @@ export default function Person({ person }) {
)
}
- { person.contributions.projects && person.contributions.collaborations &&
}
{
person.contributions.collaborations && (
- Collaborations
-
+ Collaborations
+
{
person.contributions.collaborations.map(project => (
-
diff --git a/style/theme.js b/style/theme.js
index d6e84537..35533995 100644
--- a/style/theme.js
+++ b/style/theme.js
@@ -31,8 +31,9 @@ const typography = {
fontSize: 'clamp(1.7rem, 1.486rem + 0.571vw, 2rem)',
},
h3: {
- fontSize: 'clamp(1.3rem, 0.986rem + 0.571vw, 1.7rem)',
- paddingBottom: '0.5rem'
+ fontSize: '1.17rem',
+ paddingBottom: '0.5rem',
+ fontWeight: '500'
},
h4: {
fontSize: 'clamp(1.2rem, 3vw, 1.6rem)',