[sitecore-jss-nextjs] Reduce the amount of Edge API calls during fetc…

…h `getStaticPaths` (#1612)

CHANGELOG.md

@@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. The format
 
 This project does NOT adhere to [Semantic Versioning](https://semver.org/spec/v2.0.0.html), and major versions of this project denote compatibility with Sitecore Platform versions. Refer to the "Headless Services" section in the [Sitecore modules compatibility table](https://support.sitecore.com/kb?id=kb_article_view&sysparm_article=KB1000576) or the [Headless Rendering download page](https://dev.sitecore.net/Downloads/Sitecore_Headless_Rendering.aspx) for more details on versioning.
 
+## 20.2.0
+
+### 🎉 New Features & Improvements
+
+`[sitecore-jss-nextjs]` Reduce the amount of Edge API calls during fetch getStaticPaths ([#1612](https://github.com/Sitecore/jss/pull/1612))
+
 ## 20.1.0
 
 ### 🎉 New Features & Improvements

packages/sitecore-jss-nextjs/src/services/graphql-sitemap-service.test.ts

@@ -232,6 +232,17 @@ describe('GraphQLSitemapService', () => {
       });
     });
 
+    it('should throw error if empty language is provided', async () => {
+      mockPathsRequest();
+
+      const service = new GraphQLSitemapService({ endpoint, apiKey, siteName });
+      await service.fetchSSGSitemap(['']).catch((error: RangeError) => {
+        expect(error.message).to.equal('The language must be a non-empty string');
+      });
+
+      return expect(nock.isDone()).to.be.false;
+    });
+
     it('should use a custom pageSize, if provided', async () => {
       const customPageSize = 20;
 
@@ -257,7 +268,7 @@ describe('GraphQLSitemapService', () => {
         .post(
           '/',
           (body) =>
-            body.query.indexOf('$pageSize: Int = 10') > 0 && body.variables.pageSize === undefined
+            body.query.indexOf('$pageSize: Int = 100') > 0 && body.variables.pageSize === undefined
         )
         .reply(200, sitemapQueryResult);
 

packages/sitecore-jss-nextjs/src/services/graphql-sitemap-service.ts

@@ -14,12 +14,15 @@ export const queryError =
 /** @private */
 export const languageError = 'The list of languages cannot be empty';
 
+/** @private */
+const languageEmptyError = 'The language must be a non-empty string';
+
 // Even though _hasLayout should always be "true" in this query, using a variable is necessary for compatibility with Edge
 const defaultQuery = /* GraphQL */ `
   query SitemapQuery(
     $rootItemId: String!
     $language: String!
-    $pageSize: Int = 10
+    $pageSize: Int = 100
     $hasLayout: String = "true"
     $after: String
   ) {
@@ -173,23 +176,29 @@ export class GraphQLSitemapService {
       throw new Error(queryError);
     }
 
-    // Fetch paths using all locales
-    const paths = await Promise.all(
-      languages.map((language) => {
-        debug.sitemap('fetching sitemap data for %s', language);
-        return this.searchService
-          .fetch(this.query, {
-            rootItemId,
-            language,
-            pageSize: this.options.pageSize,
-          })
-          .then((results) => {
-            return results.map((item) =>
-              formatStaticPath(item.url.path.replace(/^\/|\/$/g, '').split('/'), language)
-            );
-          });
-      })
-    );
+    const paths: StaticPath[] = [];
+
+    for (const language of languages) {
+      if (language === '') {
+        throw new RangeError(languageEmptyError);
+      }
+
+      debug.sitemap('fetching sitemap data for %s', language);
+
+      const languagePaths = await this.searchService
+        .fetch(this.query, {
+          rootItemId,
+          language,
+          pageSize: this.options.pageSize,
+        })
+        .then((results) => {
+          return results.map((item) =>
+            formatStaticPath(item.url.path.replace(/^\/|\/$/g, '').split('/'), language)
+          );
+        });
+
+      paths.push(...languagePaths);
+    }
 
     // merge promises results into single result
     return ([] as StaticPath[]).concat(...paths);