TypeScript
Using types for JSON:API responses
We have included a few types you can use to properly type your JSON:API responses:
DrupalNode
Retrieving an `article` node by id:
import { DrupalNode } from "next-drupal"
const node = await getResource<DrupalNode>( "node--article", "e96869cb-2b58-4863-ba18-1480f6696bb9")Retrieving a `news` node by path:
import { DrupalNode } from "next-drupal"
const node = await getResourceByPath<DrupalNode>("/path/to/news")Retrieving a collection of `articles` from context:
import { DrupalNode } from "next-drupal"
const articles = await getResourceCollectionFromContext<DrupalNode[]>( "node--article", context)Available types
`DrupalNode``DrupalMedia``DrupalTaxonomyTerm``DrupalBlock``DrupalUser``DrupalMenuLinkContent`
You can see a list of type definitions here.
getStaticProps
You can use the type definition to type your getStaticProps responses as follows:
pages/index.tsx
import { getPathsFromContext, getResourceCollectionFromContext, DrupalNode,} from "next-drupal"
interface BlogPageProps { nodes: DrupalNode[] }
export default function BlogPage({ nodes }: BlogPageProps) { return // .....}
export async function getStaticProps( context): Promise<GetStaticPropsResult<BlogPageProps>> { const nodes = await getResourceCollectionFromContext<DrupalNode[]>( "node--article", context )
return { props: { nodes, }, }}