Array pagination fails on serverless

[ryangittings]

Operating system

macOS 13.0 (22A380)

Eleventy

2.0.0

Describe the bug

The pagination works expected in build:

/build/
/build/2/
The pagination works here in serverless:

/serverless/

But it doesn't work when you go to page 2:

/serverless/2/

Reproduction steps

No response

Expected behavior

No response

Reproduction URL

https://github.com/ryangittings/11ty-serverless-pagination-issue

Screenshots

No response

[zachleat]

Cross posting our social discussion! https://fediverse.zachleat.com/@zachleat/109994443453826167

I am looking at this today!

[zachleat]

Alright I did uncover a temporary workaround for you that works in current versions!

---js
{
  title: "Posts",
  pagination: {
    data: "collections.post",
    reverse: true,
    alias: "posts",
    size: 2,
    serverless: "eleventy.serverless.path.page",
    serverlessFilter: function(data, key) {
      let chunks = [];
      // this code assumes a page chunk size of 2 and adds them in reverse order
      for(let j=0, k=data.length; j<k; j+=2) {
        chunks.push([data[j+1], data[j]]);
      }
      return chunks[chunks.length - (key || 0)];
    },
  },
  permalink: {
    serverless: ["/serverless/", "/serverless/:page/"],
  }
}
---

(Noting that pagination.page.previous and next are still missing to create the nav links, but you should be able to recreate those using eleventy.serverless.path https://www.11ty.dev/docs/data-eleventy-supplied/#eleventy-variable)

[ryangittings]

Okay, cool! Is there likely to be a new version that fixes this without a workaround?

If not, how would I be able to generate the dynamic previous and next and make them null if we're at the start/end?

[zachleat]

This will ship with v2.0.1

[zachleat]

Just pushed a small fix here that unlocks the use of multiple serverless URLs in array pagination (including one without a path param)

---js
{
  title: "Posts",
  pagination: {
    data: "collections.post",
    reverse: true,
    alias: "posts",
    size: 2,
    serverless: "eleventy.serverless.path.page",
  },
  permalink: {
    serverless: ["/serverless/", "/serverless/:page/"],
  }
}
---

Navigating to /serverless/ now populates the next page link with /serverless/1/ as expected!

[ryangittings]

Yessss! Wonderful stuff. Thank you ever so much.

[dwkns]

Does this also solve:
#2544

And remove the need for this documentation change?
11ty/11ty-website#1489

[zachleat]

@dwkns let me look!

[zachleat]

@dwkns I added support for Array-based serverless pagination with resolve: values to this as well, per your repo! Look forward to having you try it out in 2.0.1!