fetchPages

The fetchPages function is useful when you want to retrieve all your pages from outside the React context (where you could use the usePagesPublic hook instead).

In particular, this comes in handy to retrieve all the pages during the build process of a static website. Indeed, this is the method used in our Gatsby and Next.js starter projects.

Signature (simplified)

const fetchPages = async (
  apiKey: string,
  options: {
    type: pageType,
    types: pageTypes as string[],
    tag,
    language,
    page,
    pageSize,
    sort,
    usePagination,
  }
): Promise<types.PageFromList[] | types.PagesFromListWithPagination>

Really the TypeScript signature is more complex, because the returned type is an array of PageFromList only when usePagination is true and an object of type PagesFromListWithPagination when usePagination is false.

Property	Definition
apiKey	Api Key of your React Bricks app (a string).
options	Optional object to filter the pages by type or tag (see below).

Options

The options object has the following shape

{
  type?: string
  types?: string[]
  tag?: string
  language?: string
  usePagination?: boolean
  page?: number
  pageSize?: number
  sort?: string
}

Property	Definition
type	Optional string to return only the pages with the specified page type.
types	Optional array of strings to return only the pages with one of the specified page types.
tag	Optional string to return only the pages with the specified tag.
language	Optional string to return only the pages with the specified language.
usePagination	If true, it will consider the page and pageSize parameters and it will return paginated results
page	The page number, in case of pagination
pageSize	The page size, in case of pagination
sort	Sort parameter: currently it accepts only createdAt,-createdAt,publishedAt,-publishedAt

Return value

fetchPages returns a promise which resolves to.

• When usePagination is false, an array of type PageFromList
• When usePagination is true, an object of type PagesFromListWithPagination

To retrieve the content of each page, you can use the fetchPage function.

Usage example

fetchPages('API_KEY', { type: 'blogPost', tag: 'react' }).then((data) => {
  console.log(data)
})