Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enhanced Browse Dynamic Routes Proof of Concept #464

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

Enhanced Browse Dynamic Routes Proof of Concept #464

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
57 changes: 57 additions & 0 deletions pages/subjects/[[...slug]].tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import Head from "next/head"
import { useRouter } from "next/router"
import { capitalize } from "lodash"

import Layout from "../../src/components/Layout/Layout"

import { SITE_NAME } from "../../src/config/constants"

/**
* The Search page is responsible for fetching and displaying the Search results,
* as well as displaying and controlling pagination and search filters.
*/
export default function Search() {
const metadataTitle = `Subject Headings Dynamic Routes POC | ${SITE_NAME}`
const router = useRouter()

return (
<>
<Head>
<meta property="og:title" content={metadataTitle} key="og-title" />
<meta
property="og:site_name"
content={metadataTitle}
key="og-site-name"
/>
e
<meta name="twitter:title" content={metadataTitle} key="tw-title" />
<title key="main-title">{metadataTitle}</title>
</Head>
<Layout activePage="search">
<p>Subjects array: {JSON.stringify(router.query.slug)}</p>
<p>Number of subjects: {router.query.slug.length}</p>
<p>
Concatenated subject:{" "}
{Array.isArray(router.query.slug) &&
router.query.slug
.map((subject) => capitalize(subject))
.join(" -- ")}
</p>
</Layout>
</>
)
}

/**
* resolvedUrl is the original URL of the search page including the search query parameters.
* It is provided by Next.js as an attribute of the context object that is passed to getServerSideProps.
*
* Here it is used to construct a SearchParams object from the parsed query parameters in order to fetch the
* relevant search results on the server side (via fetchResults).
*
*/
export async function getServerSideProps() {
return {
props: {},
}
}