ais-configure : Type '{ hitsPerPage: number; }' is not assignable to type 'PlainSearchParameters'.

[johnico]

version : 4.14 on angular 14.5

i have tried to set hitsForPage in order to support pagination
so i bring the NgAisConfigureModule

and added :

  <ais-instantsearch [config]="searchConfig">
    <ais-configure
    [searchParameters]="{ hitsPerPage: 5, enablePersonalization: true }"
  ></ais-configure>
  ...
  ...

I got the following error on "hitsPerPage"

{ hitsPerPage: number; enablePersonalization: true; }' is not assignable to type 'PlainSearchParameters'.
  Object literal may only specify known properties, and '"hitsPerPage"' does not exist in type 'PlainSearchParameters'.

is here any way to define the items per page ?

[aymeric-giraudet]

Hi @johnico, thank you for raising the issue.

I cannot reproduce it on my end so there's probably information I'm missing.
Could you either provide a codesandbox showcasing it or sending me the output of the following command :

npm list algoliasearch algoliasearch-helper

Thank you !

[johnico]

Hi @johnico, thank you for raising the issue.

I cannot reproduce it on my end so there's probably information I'm missing. Could you either provide a codesandbox showcasing it or sending me the output of the following command :

npm list algoliasearch algoliasearch-helper

Thank you !

@aymeric-giraudet thanks

i can put diffrent params than hitsPerPage without typing issue but nothing happen

├── [email protected] 
└─┬ [email protected]
  └─┬ [email protected]
    └── [email protected] 

code : module

@NgModule({
  declarations: [TestComponent],
  imports: [ NgAisModule.forRoot()],
})
export class TestModule {}

Component.ts

import { Component, OnInit } from '@angular/core';
import algoliasearch, { SearchClient } from 'algoliasearch/lite';

@Component({
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.scss'],
})
export class TestComponent implements OnInit {
  config?: { indexName: string; searchClient: SearchClient, routing: true };

  constructor() {
    const data: Algolia.SearchApiKeyOnCallData = { global: true };
    const dataAlgolia = someCallToget search data
    dataAlgolia(data)
      .toPromise()
      .then((key: string) => {
        const searchClient = algoliasearch('string', key);
        this.config = {
          indexName: `test`,
          searchClient,
          routing: true
        };
      });
  }

html

  <ais-instantsearch [config]="config">
    <ais-configure 
    [searchParameters]="{hitsPerPage:2}"
  ></ais-configure>
  ...
  ...
  ...
  ..
</ais-instantsearch>

[aymeric-giraudet]

Thanks @johnico for the info !

I have the same version but no such issue, if I create an object with the same type used by Configure it's fine :

import { PlainSearchParameters } from 'algoliasearch-helper';
import { SearchOptions } from 'instantsearch.js';

const test: PlainSearchParameters = { hitsPerPage: 10 };
const test2: SearchOptions = { hitsPerPage: 10 };

Could you try that, check the definitions for PlainSearchParameters and SearchOptions by yourself and see if there's anything strange ?
Could also be a problem with TypeScript itself, which version are you running ? You could also maybe try to delete node_modules and reinstall.

[johnico]

@aymeric-giraudet I have added any to the object and it works now
Might be typescript issues ?

Also tried to remove node modules .

I see the object in the node modules code .
So I suspect the typescript version

I have typescript 4.7.4