Skip to content

Commit b563e4b

Browse files
committed
Describe changes in README.md
1 parent acd4c94 commit b563e4b

File tree

1 file changed

+74
-24
lines changed

1 file changed

+74
-24
lines changed

packages/instant-meilisearch/README.md

Lines changed: 74 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -80,12 +80,14 @@ To be able to create a search interface, you'll need to [install `instantsearch.
8080
```js
8181
import { instantMeiliSearch } from '@meilisearch/instant-meilisearch'
8282

83-
const searchClient = instantMeiliSearch(
83+
const { searchClient, setMeiliSearchParams } = instantMeiliSearch(
8484
'https://ms-adf78ae33284-106.lon.meilisearch.io', // Host
8585
'a63da4928426f12639e19d62886f621130f3fa9ff3c7534c5d179f0f51c4f303' // API key
8686
)
8787
```
8888

89+
where `searchClient` is to be passed to instantsearch.js or its many framework adaptations, and [`setMeiliSearchParams`](#modify-meilisearch-search-parameters) is a function used to set/modify certain Meilisearch search parameters to be overridden.
90+
8991
### Parameters
9092

9193
- `Host` - URL of Meilisearch instance
@@ -96,19 +98,19 @@ const searchClient = instantMeiliSearch(
9698
`instant-meilisearch` offers some options you can set to further fit your needs.
9799

98100
- [`placeholderSearch`](#placeholder-search): Enable or disable placeholder search (default: `true`).
99-
- [`finitePagination`](#finite-pagination): Enable finite pagination when using the the [`pagination`](#-pagination) widget (default: `false`) .
101+
- [`finitePagination`](#finite-pagination): Enable finite pagination when using the [`pagination`](#-pagination) widget (default: `false`) .
100102
- [`primaryKey`](#primary-key): Specify the primary key of your documents (default `undefined`).
101103
- [`keepZeroFacets`](#keep-zero-facets): Show the facets value even when they have 0 matches (default `false`).
102-
- [`matchingStrategy`](#matching-strategy): Determine the search strategy on words matching (default `last`).
103104
- [`requestConfig`](#request-config): Use custom request configurations.
104-
- ['httpClient'](#custom-http-client): Use a custom HTTP client.
105+
- [`httpClient`](#custom-http-client): Use a custom HTTP client.
106+
- [`meiliSearchParams`](#meilisearch-search-parameters): Override a selection of Meilisearch search parameters (default `undefined`).
105107

106108
The options are added as the third parameter of the `instantMeilisearch` function.
107109

108110
```js
109111
import { instantMeiliSearch } from '@meilisearch/instant-meilisearch'
110112

111-
const searchClient = instantMeiliSearch(
113+
const { searchClient } = instantMeiliSearch(
112114
'https://ms-adf78ae33284-106.lon.meilisearch.io',
113115
'a63da4928426f12639e19d62886f621130f3fa9ff3c7534c5d179f0f51c4f303',
114116
{
@@ -172,20 +174,6 @@ genres:
172174
{ keepZeroFacets : true } // default: false
173175
```
174176

175-
### Matching strategy
176-
177-
`matchingStrategy` gives you the possibility to choose how Meilisearch should handle the presence of multiple query words, see [documentation](https://www.meilisearch.com/docs/reference/api/search#matching-strategy).
178-
179-
For example, if your query is `hello world` by default Meilisearch returns documents containing either both `hello` and `world` or documents that only contain `hello`. This is the `last` strategy, where words are stripped from the right.
180-
The other strategy is `all`, where both `hello` and `world` **must** be present in a document for it to be returned.
181-
182-
183-
```js
184-
{
185-
matchingStrategy: 'all' // default last
186-
}
187-
```
188-
189177
### Request Config
190178

191179
You can provide a custom request configuration. Available field can be [found here](https://fetch.spec.whatwg.org/#requestinit).
@@ -221,6 +209,66 @@ You can use your own HTTP client, for example, with [`axios`](https://github.com
221209
}
222210
```
223211

212+
### Meilisearch search parameters
213+
214+
`meiliSearchParams` lets you override a set of search parameters that are sent off to Meilisearch.
215+
The following options can be overridden:
216+
[`attributesToRetrieve`](https://www.meilisearch.com/docs/reference/api/search#attributes-to-retrieve),
217+
[`attributesToCrop`](https://www.meilisearch.com/docs/reference/api/search#attributes-to-crop),
218+
[`cropLength`](https://www.meilisearch.com/docs/reference/api/search#crop-length),
219+
[`cropMarker`](https://www.meilisearch.com/docs/reference/api/search#crop-marker),
220+
[`attributesToHighlight`](https://www.meilisearch.com/docs/reference/api/search#attributes-to-highlight),
221+
[`highlightPreTag`, `highlightPostTag`](https://www.meilisearch.com/docs/reference/api/search#highlight-tags),
222+
[`showMatchesPosition`](https://www.meilisearch.com/docs/reference/api/search#show-matches-position),
223+
[`matchingStrategy`](https://www.meilisearch.com/docs/reference/api/search#matching-strategy),
224+
[`showRankingScore`](https://www.meilisearch.com/docs/reference/api/search#ranking-score),
225+
[`attributesToSearchOn`](https://www.meilisearch.com/docs/reference/api/search#customize-attributes-to-search-on-at-search-time).
226+
227+
```js
228+
instantMeiliSearch(
229+
// ...
230+
{
231+
meiliSearchParams: {
232+
attributesToHighlight: ['overview'],
233+
highlightPreTag: '<em>',
234+
highlightPostTag: '</em>',
235+
attributesToSearchOn: ['overview'],
236+
},
237+
}
238+
)
239+
```
240+
241+
### Modify Meilisearch search parameters
242+
243+
`instantMeiliSearch` returns an instance with two properties on it, one of them being `setMeiliSearchParams`.
244+
245+
```js
246+
const { searchClient, setMeiliSearchParams } = instantMeiliSearch(/*...*/)
247+
```
248+
249+
It modifies (or sets if not already set) the [overridden Meilisearch search parameters](#meilisearch-search-parameters).
250+
It only modifies parameters that are defined on the provided object, the following will not change `attributesToHighlight`.
251+
252+
```js
253+
const { setMeiliSearchParams } = instantMeiliSearch(
254+
// ...
255+
{
256+
meiliSearchParams: {
257+
attributesToHighlight: ['overview'],
258+
highlightPreTag: '<em>',
259+
highlightPostTag: '</em>',
260+
attributesToSearchOn: ['overview'],
261+
},
262+
}
263+
)
264+
265+
setMeiliSearchParams({
266+
highlightPreTag: '<mark>',
267+
highlightPostTag: '</mark>',
268+
attributesToSearchOn: ['overview', 'title'],
269+
})
270+
```
271+
224272
## 🪡 Example with InstantSearch
225273

226274
The open-source [InstantSearch](https://www.algolia.com/doc/api-reference/widgets/js/) library powered by Algolia provides all the front-end tools you need to highly customize your search bar environment.
@@ -252,12 +300,14 @@ In `index.html`:
252300
In `app.js`:
253301

254302
```js
303+
const { searchClient } = instantMeiliSearch(
304+
'https://ms-adf78ae33284-106.lon.meilisearch.io',
305+
'a63da4928426f12639e19d62886f621130f3fa9ff3c7534c5d179f0f51c4f303'
306+
)
307+
255308
const search = instantsearch({
256309
indexName: 'steam-video-games',
257-
searchClient: instantMeiliSearch(
258-
'https://ms-adf78ae33284-106.lon.meilisearch.io',
259-
'a63da4928426f12639e19d62886f621130f3fa9ff3c7534c5d179f0f51c4f303'
260-
),
310+
searchClient,
261311
})
262312

263313
search.addWidgets([
@@ -381,7 +431,7 @@ const search = instantsearch({
381431
{
382432
// ... InstantMeiliSearch options
383433
}
384-
),
434+
).searchClient,
385435
// ... InstantSearch options
386436
routing: true // for example
387437
})

0 commit comments

Comments
 (0)