Generate renderingContent automatically.

Context: #150 (comment)

Author: jasonbosco

README.md

@@ -369,12 +369,9 @@ const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter({
 
 > Available as of Typesense Server `v0.25.0.rc12`
 
-In order to use [`dynamicWidgets`](https://www.algolia.com/doc/api-reference/widgets/dynamic-facets/js/),
-Instantsearch expects a parameter called [`renderingContent`](https://www.algolia.com/doc/api-reference/api-parameters/renderingContent/) to be set
-which controls the display logic for this widget.
-
-In Algolia, this configuration can be set via the dashboard or via the API.
-But when using Typesense and this adapter, this setting has to be configured when instantiating the adapter like this:
+This [`dynamicWidgets`](https://www.algolia.com/doc/api-reference/widgets/dynamic-facets/js/) widget works out of the box with no additional changes, 
+but if you want to control the order in which these facets are displayed in the UI 
+Instantsearch expects a parameter called [`renderingContent`](https://www.algolia.com/doc/api-reference/api-parameters/renderingContent/) to be set.
 
 ```js
 const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter({
@@ -389,10 +386,8 @@ const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter({
       },
     ],
   },
-  renderingContent: {
-    // <<====== Required
+  renderingContent: { // <<===== Add this, only if you want to control the order of the widgets displayed by dynamicWidgets
     facetOrdering: {
-      // <<====== Required: this controls the order in which the dynamic facets are displayed, and is *required* for the dynamicWidget to render
       facets: {
         order: ["size", "brand"], // <<===== Change this as needed
       },

dist/typesense-instantsearch-adapter.js

@@ -264,7 +264,21 @@ export class SearchResponseAdapter {
     return adaptedResult;
   }
 
+  _adaptRenderingContent(typesenseFacetCounts) {
+    const adaptedResult = Object.assign({}, this.configuration.renderingContent);
+
+    // Only set facet ordering if the user has not set one
+    if (adaptedResult.facetOrdering?.facets?.order == null) {
+      adaptedResult.facetOrdering = adaptedResult.facetOrdering || {};
+      adaptedResult.facetOrdering.facets = adaptedResult.facetOrdering.facets || {};
+      adaptedResult.facetOrdering.facets.order = typesenseFacetCounts.map((fc) => fc["field_name"]);
+    }
+
+    return adaptedResult;
+  }
+
   adapt() {
+    const adaptedRenderingContent = this._adaptRenderingContent(this.typesenseResponse.facet_counts || []);
     const adaptedResult = {
       hits: this.typesenseResponse.grouped_hits
         ? this._adaptGroupedHits(this.typesenseResponse.grouped_hits)
@@ -277,7 +291,7 @@ export class SearchResponseAdapter {
       facets_stats: this._adaptFacetStats(this.typesenseResponse.facet_counts || {}),
       query: this.typesenseResponse.request_params.q,
       processingTimeMS: this.typesenseResponse.search_time_ms,
-      ...(this.configuration.renderingContent != null && { renderingContent: this.configuration.renderingContent }),
+      ...(Object.keys(adaptedRenderingContent).length > 0 ? { renderingContent: adaptedRenderingContent } : null),
     };
 
     // console.log(adaptedResult);

dist/typesense-instantsearch-adapter.js.map

@@ -1,5 +1,6 @@
 import { SearchResponseAdapter } from "../src/SearchResponseAdapter";
 import { Configuration } from "../src/Configuration";
+import typesenseResponse from "./support/data/typesense-search-response.json";
 
 describe("SearchResponseAdapter", () => {
   describe("._adaptHighlightResult", () => {
@@ -274,4 +275,109 @@ describe("SearchResponseAdapter", () => {
       });
     });
   });
+
+  describe("._adaptRenderingContent", () => {
+    describe("when user does not specify any renderingContent", () => {
+      it("generates the facet ordering for the user automatically", () => {
+        const typesenseResponse = require("./support/data/typesense-search-response.json");
+        const subject = new SearchResponseAdapter(
+          typesenseResponse["results"][0],
+          {
+            params: {
+              highlightPreTag: "<mark>",
+              highlightPostTag: "</mark>",
+            },
+          },
+          {}
+        );
+
+        const result = subject.adapt();
+        expect(result?.renderingContent?.facetOrdering?.facets?.order).toEqual([
+          "brand",
+          "free_shipping",
+          "price",
+          "rating",
+          "categories",
+          "categories.lvl0",
+        ]);
+      });
+    });
+    describe("when user specifies partial renderingContent, without facet ordering", () => {
+      it("generates the facet ordering for the user automatically, and merges with the provided data", () => {
+        const typesenseResponse = require("./support/data/typesense-search-response.json");
+        const subject = new SearchResponseAdapter(
+          typesenseResponse["results"][0],
+          {
+            params: {
+              highlightPreTag: "<mark>",
+              highlightPostTag: "</mark>",
+            },
+          },
+          {
+            renderingContent: {
+              facetOrdering: {
+                somevalue: "abc",
+                anothervalue: {
+                  key: "value",
+                },
+              },
+            },
+          }
+        );
+
+        const result = subject.adapt();
+        expect(result?.renderingContent).toEqual({
+          facetOrdering: {
+            somevalue: "abc",
+            anothervalue: {
+              key: "value",
+            },
+            facets: {
+              order: ["brand", "free_shipping", "price", "rating", "categories", "categories.lvl0"],
+            },
+          },
+        });
+      });
+    });
+    describe("when user specifies facet ordering", () => {
+      it("it uses that and doesn't override", () => {
+        const typesenseResponse = require("./support/data/typesense-search-response.json");
+        const subject = new SearchResponseAdapter(
+          typesenseResponse["results"][0],
+          {
+            params: {
+              highlightPreTag: "<mark>",
+              highlightPostTag: "</mark>",
+            },
+          },
+          {
+            renderingContent: {
+              facetOrdering: {
+                somevalue: "abc",
+                anothervalue: {
+                  key: "value",
+                },
+                facets: {
+                  order: ["brand", "free_shipping"],
+                },
+              },
+            },
+          }
+        );
+
+        const result = subject.adapt();
+        expect(result?.renderingContent).toEqual({
+          facetOrdering: {
+            somevalue: "abc",
+            anothervalue: {
+              key: "value",
+            },
+            facets: {
+              order: ["brand", "free_shipping"],
+            },
+          },
+        });
+      });
+    });
+  });
 });