Autocomplete with Docsearch - Error fetching results

[EfstathiadisD]

I have a documentation website, which I am using Docsearch up until now. We want to elevate the experience a bit, due to various issues we have. (Multiple versions, very similar results due to function-name overlapping in snippets, and our bad organization 😉 )

So, I set it up following the guide in Replicating the Algolia documentation search with autocomplete.

I have a small issue though. I am getting an error when I try to fetch results.

Uncaught TypeError: Cannot read property 'noResults' of undefined
    at getAlgoliaFacets.ts:21
    at Array.some (<anonymous>)
    at Object.onStateChange (getAlgoliaFacets.ts:21)
    at Object.onStateChange (getAlgoliaFacets.ts:21)
    at getAlgoliaFacets.ts:21
    at Object.dispatch (getAlgoliaFacets.ts:21)
    at setQuery (getAlgoliaFacets.ts:21)
    at Z (getAlgoliaFacets.ts:21)
    at Object.i [as focus] (getAlgoliaFacets.ts:21)
    at HTMLInputElement.je (getAlgoliaFacets.ts:21)

Here is my configuration and what I have done until now. The website is written in Hugo and we already pay for Algolia indexing:

  const { autocomplete, getAlgoliaResults } =
    window["@algolia/autocomplete-js"];
  const algoliasearch = window["algoliasearch"];

  const searchClient = algoliasearch(
    "APP_ID",
    "API_KEU"
  );

  autocomplete({
    container: "#autocomplete",
    detachedMediaQuery: "",
    getSources() {
      return [
        {
          sourceId: "hits",
          getItems({ query }) {
            return getAlgoliaResults({
              searchClient,
              queries: [
                {
                  indexName: "INDEX_NAME",
                  query: query,
                  params: {
                    hitsPerPage: 8,
                  },
                },
              ],
            });
          },
        },
      ];
    },
  });

And one more question if I may. What is the sourceId. Is it completely arbitrary? Or is it specific to each index, and if yes, how do I fin it?

[francoischalifour]

Hey! You need to import getAlgoliaResults from @algolia/autocomplete-js, not @algolia/autocomplete-preset-algolia.

We explain what sourceId is in our API reference. It's a string that is unique to your Autocomplete source. It's used internally for Autocomplete, and to distinguish the section of your source in the DOM (e.g., if you want to style a section differently).

[EfstathiadisD]

Thanks. I just did that, but now I am on another error. I made the example even more minimal... I used algolissearch instead of docsearch now, and it works better. Still getting an error on facets though.

[EfstathiadisD]

I also seem to be getting some results back. If I log the getItemUrl I seem 1 result. Not very relevant tbh, but something is returned.

          getItemUrl({ item }) {
            console.log(item);
            return item.url;
          },

[francoischalifour]

There are still a few things missing in your source, like templates.