queryString 매개 변수를 기반으로 Gatsby에서 사용자 정의 / 동적 정렬을 수행하려면 어떻게해야합니까?

Netlify와 함께 Gatsby를 사용하는 간단한 사이트가 있습니다.

이 시점에서 사이트의 "콘텐츠"는 최소한이므로 JSON 파일에 보관하고 해당 파일에서 페이지 / 목록을 생성합니다.

이 사이트의 주요 목적은 다운로드 가능한 파일 목록을 표시하는 것입니다. 목록이 길어짐에 따라 페이지 매김을 처리하기 위해 다음 코드를 구현했습니다.

  const array_chunks = (array, chunk_size) =>
    Array(Math.ceil(array.length / chunk_size))
      .fill()
      .map((_, index) => index * chunk_size)
      .map(begin => array.slice(begin, begin + chunk_size))
  // const pages = array_chunks(edges.sort(customSort), pageSize)
  const pages = array_chunks(edges, pageSize)
  console.dir(pages)

  const handlePageChange = (event, data) => {
    setPage(data.activePage)
  }

  return (
    <div>
      <Table celled striped unstackable>
        <Table.Header>
          <Table.Row>
            <Table.HeaderCell singleLine>Report Name</Table.HeaderCell>
            <Table.HeaderCell singleLine>Released</Table.HeaderCell>
          </Table.Row>
        </Table.Header>
        <Table.Body>
          {pages[page - 1].map(({ node }) => {
            let countryName = node.country.toString().toLowerCase()
            return (
              <Table.Row key={node.id}>
                <Table.Cell>
                  <CountryIcon />
                  {node.name}&nbsp;
                  <DownloadLink url={node.reportUrl} external={node.external} />
                </Table.Cell>
                <Table.Cell>{node.date}</Table.Cell>
              </Table.Row>
            )
          })}
        </Table.Body>
      </Table>
      <Pagination
        boundaryRange={0}
        defaultActivePage={1}
        ellipsisItem={null}
        firstItem={null}
        lastItem={null}
        siblingRange={1}
        totalPages={pages.length}
        onPageChange={handlePageChange}
      />
    </div>
  )
}

때때로 우리는 사람들을 사이트로 안내하고 보고서 중 하나가 기본 순서 대신 목록 맨 위에 표시되기를 원합니다. 이와 같은 사용자 지정 정렬 기능을 구현하고 pages위의 주석 처리 된 줄에서 볼 수 있듯이 변수에 적용했습니다 .

  const customSort = (a, b) => {
    if (a.node.name.includes(reportName)) return -1
    return 0
  }

내가 사용한 적이 .includes과 startsWith가끔 정상에 거품이 원하는 것을 지속적으로 접두사 두 보고서가 있기 때문에 방법. 그런 다음과 같은 사이트를 방문하면 mysite.com/?reportName=myReportPrefix모든 것이 작동합니다. Netlify에 배포 한 후에는 모든 것이 옆으로 갔고 사이트를 정적으로 생성하고 사용자 지정 정렬 기능을 망쳐 버렸기 때문이라고 생각합니다.하지만 로컬에서 개발할 때는 (아마도?) 핫 리로딩이고 페이지에 액세스 권한이 있기 때문에 제대로 작동했습니다. 쿼리 된 데이터에.

프로덕션에서이 기능을 구현할 수있는 방법이 있습니까? Gatsby가 가능한 각 정렬 기준에 대해 정적 페이지를 생성하도록하는 방법을 알아 내야합니까? "올바른"방법이 있습니까?