Skip to content

Commit 93578a4

Browse files
millotpshortcuts
millotp
and
shortcuts
authored
fix: upgrade algoliasearch to v5 (#2326)
We can use the new generated client to stay up to date and upgrade packages that depends on docsearch. --------- Co-authored-by: shortcuts <vannicattec@gmail.com>
1 parent 90f3c6a commit 93578a4

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+13950
-13724
lines changed

‎.circleci/config.yml

+2-3
Original file line numberDiff line numberDiff line change
@@ -38,12 +38,12 @@ aliases:
3838
defaults: &defaults
3939
working_directory: ~/docsearch
4040
docker:
41-
- image: cimg/node:16.20.2
41+
- image: cimg/node:18.20.3
4242

4343
cypress: &cypress
4444
working_directory: ~/docsearch
4545
docker:
46-
- image: cypress/browsers:node16.14.0-chrome99-ff97
46+
- image: cypress/browsers:node-18.20.3-chrome-125.0.6422.141-1-ff-126.0.1-edge-125.0.2535.85-1
4747
environment:
4848
## this enables colors in the output
4949
TERM: xterm
@@ -153,7 +153,6 @@ jobs:
153153
steps:
154154
- checkout
155155
- *attach_workspace
156-
- run: *install_yarn_version
157156
- restore_cache: *restore_yarn_cache
158157
- run: *run_yarn_install
159158
- save_cache: *save_yarn_cache

‎.nvmrc

+1-1
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
16.20.2
1+
18.20.3

‎bundlesize.config.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,11 @@
66
},
77
{
88
"path": "packages/docsearch-react/dist/umd/index.js",
9-
"maxSize": "23 kB"
9+
"maxSize": "27 kB"
1010
},
1111
{
1212
"path": "packages/docsearch-js/dist/umd/index.js",
13-
"maxSize": "31 kB"
13+
"maxSize": "35 kB"
1414
}
1515
]
1616
}

‎cypress/integration/search/actions.spec.ts

+1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
describe('Start', () => {
44
beforeEach(() => {
55
cy.visit(Cypress.config().baseUrl!);
6+
cy.waitLoad();
67
});
78

89
it('Open modal on search button click', () => {

‎cypress/support/commands.d.ts

+4
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,10 @@ declare namespace Cypress {
1414
* Toggles the dark mode on the preview website.
1515
*/
1616
darkmode: () => void;
17+
/**
18+
* Wait for the page to load.
19+
*/
20+
waitLoad: () => void;
1721
/**
1822
* Opens the DocSearch modal.
1923
*/

‎cypress/support/commands.ts

+5-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
Cypress.Commands.add('modalIsVisibleAndFocused', () => {
2-
cy.get('.DocSearch-Modal').should('be.visible');
2+
cy.get('.DocSearch-Modal', { timeout: 10000 }).should('be.visible');
33
cy.get('.DocSearch-Input').should('be.focus');
44
});
55

@@ -14,6 +14,10 @@ Cypress.Commands.add('darkmode', () => {
1414
cy.get('html.dark').should('be.visible');
1515
});
1616

17+
Cypress.Commands.add('waitLoad', () => {
18+
cy.get('.DocSearch-Button', { timeout: 10000 }).should('be.visible');
19+
});
20+
1721
Cypress.Commands.add('openModal', () => {
1822
cy.get('.DocSearch-Button').should('be.visible').click();
1923
cy.modalIsVisibleAndFocused();

‎examples/demo/favicon.png ‎examples/demo/favicon.ico

File renamed without changes.

‎examples/demo/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66

7-
<link rel="shortcut icon" href="favicon.png" type="image/x-icon" />
7+
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
88

99
<title>DocSearch v3 - React</title>
1010
</head>

‎examples/js-demo/favicon.png ‎examples/js-demo/favicon.ico

File renamed without changes.

‎examples/js-demo/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<meta charset="UTF-8" />
44
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
55

6-
<link rel="shortcut icon" href="favicon.png" type="image/x-icon" />
6+
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
77

88
<title>DocSearch v3 - Vanilla JavaScript</title>
99
</head>

‎netlify.toml

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
[build]
2-
command="yarn build"
2+
command="yarn build && yarn website:build"
33
publish="packages/website/build"
44
ignore="git diff --quiet $COMMIT_REF $CACHED_COMMIT_REF -- packages/website/ yarn.lock"
55

‎package.json

+9-7
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@
33
"private": true,
44
"workspaces": {
55
"packages": [
6-
"packages/*",
6+
"packages/docsearch-css",
7+
"packages/docsearch-js",
8+
"packages/docsearch-react",
79
"examples/*"
810
],
911
"nohoist": [
@@ -34,9 +36,9 @@
3436
"test:types": "tsc --noEmit",
3537
"test": "jest",
3638
"watch": "lerna run watch --parallel --scope @docsearch/*",
37-
"website:build": "yarn workspace @docsearch/website build",
38-
"website:start": "yarn workspace @docsearch/website start --host 0.0.0.0",
39-
"website:test": "yarn workspace @docsearch/website start --no-open"
39+
"website:build": "cd packages/website && yarn install && yarn build",
40+
"website:start": "cd packages/website && yarn install && yarn start --host 0.0.0.0",
41+
"website:test": "cd packages/website && yarn install && yarn start --no-open"
4042
},
4143
"devDependencies": {
4244
"@babel/cli": "7.23.4",
@@ -45,7 +47,7 @@
4547
"@babel/preset-typescript": "7.23.3",
4648
"@rollup/plugin-babel": "^6.0.4",
4749
"@rollup/plugin-json": "4.1.0",
48-
"@rollup/plugin-node-resolve": "7.1.1",
50+
"@rollup/plugin-node-resolve": "11.2.1",
4951
"@rollup/plugin-replace": "2.3.3",
5052
"@testing-library/dom": "9.3.1",
5153
"@testing-library/jest-dom": "5.16.5",
@@ -57,7 +59,7 @@
5759
"@types/react-dom": "^18.0.0",
5860
"@typescript-eslint/eslint-plugin": "5.41.0",
5961
"@typescript-eslint/parser": "5.41.0",
60-
"algoliasearch": "4.17.2",
62+
"algoliasearch": "5.11.0",
6163
"babel-eslint": "10.1.0",
6264
"babel-loader": "9.1.3",
6365
"babel-plugin-inline-replace-variables": "1.3.1",
@@ -103,7 +105,7 @@
103105
"stylelint-order": "5.0.0",
104106
"stylelint-prettier": "3.0.0",
105107
"ts-jest": "28.0.8",
106-
"typescript": "4.7.4",
108+
"typescript": "5.6.3",
107109
"watch": "1.0.2",
108110
"webpack": "4.44.1"
109111
}

‎packages/docsearch-js/README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -43,4 +43,4 @@ docsearch({
4343

4444
## Documentation
4545

46-
[Read documentation →](https://docsearch.algolia.com/docs/DocSearch-v3)
46+
[Read documentation →](https://docsearch.algolia.com/docs/docsearch-v3)

‎packages/docsearch-react/README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -40,4 +40,4 @@ export default App;
4040

4141
## Documentation
4242

43-
[Read documentation →](https://docsearch.algolia.com/docs/DocSearch-v3)
43+
[Read documentation →](https://docsearch.algolia.com/docs/docsearch-v3)

‎packages/docsearch-react/babel.config.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
module.exports = (api) => {
22
const isTest = api.env('test');
3-
const modules = isTest ? 'commonjs' : false;
3+
const modules = isTest ? 'commonjs' : 'auto';
44
const targets = {};
55

66
if (isTest) {

‎packages/docsearch-react/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
"@algolia/autocomplete-core": "1.9.3",
3636
"@algolia/autocomplete-preset-algolia": "1.9.3",
3737
"@docsearch/css": "3.6.2",
38-
"algoliasearch": "^4.19.1"
38+
"algoliasearch": "^5.11.0"
3939
},
4040
"peerDependencies": {
4141
"@types/react": ">= 16.8.0 < 19.0.0",

‎packages/docsearch-react/src/DocSearch.tsx

+6-4
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import type {
22
AutocompleteState,
33
AutocompleteOptions,
44
} from '@algolia/autocomplete-core';
5-
import type { SearchOptions } from '@algolia/client-search';
6-
import type { SearchClient } from 'algoliasearch/lite';
5+
import type { SearchClient } from 'algoliasearch';
6+
import type { SearchQuery, LiteClient } from 'algoliasearch/lite';
77
import React from 'react';
88
import { createPortal } from 'react-dom';
99

@@ -28,7 +28,7 @@ export interface DocSearchProps {
2828
apiKey: string;
2929
indexName: string;
3030
placeholder?: string;
31-
searchParameters?: SearchOptions;
31+
searchParameters?: SearchQuery;
3232
maxResultsPerGroup?: number;
3333
transformItems?: (items: DocSearchHit[]) => DocSearchHit[];
3434
hitComponent?: (props: {
@@ -38,7 +38,9 @@ export interface DocSearchProps {
3838
resultsFooterComponent?: (props: {
3939
state: AutocompleteState<InternalDocSearchHit>;
4040
}) => JSX.Element | null;
41-
transformSearchClient?: (searchClient: SearchClient) => SearchClient;
41+
transformSearchClient?: <T extends LiteClient | SearchClient>(
42+
searchClient: T
43+
) => T;
4244
disableUserPersonalization?: boolean;
4345
initialQuery?: string;
4446
navigator?: AutocompleteOptions<InternalDocSearchHit>['navigator'];

‎packages/docsearch-react/src/DocSearchModal.tsx

+8-8
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import {
22
type AlgoliaInsightsHit,
33
createAutocomplete,
44
} from '@algolia/autocomplete-core';
5-
import type { SearchResponse } from '@algolia/client-search';
5+
import type { SearchResponse } from 'algoliasearch/lite';
66
import React from 'react';
77

88
import { MAX_QUERY_SIZE } from './constants';
@@ -224,11 +224,11 @@ export function DocSearchModal({
224224
const insightsActive = Boolean(insights);
225225

226226
return searchClient
227-
.search<DocSearchHit>([
228-
{
229-
query,
230-
indexName,
231-
params: {
227+
.search<DocSearchHit>({
228+
requests: [
229+
{
230+
query,
231+
indexName,
232232
attributesToRetrieve: [
233233
'hierarchy.lvl0',
234234
'hierarchy.lvl1',
@@ -257,8 +257,8 @@ export function DocSearchModal({
257257
clickAnalytics: insightsActive,
258258
...searchParameters,
259259
},
260-
},
261-
])
260+
],
261+
})
262262
.catch((error) => {
263263
// The Algolia `RetryError` happens when all the servers have
264264
// failed, meaning that there's no chance the response comes

‎packages/docsearch-react/src/useDocSearchKeyboardEvents.ts

+6-9
Original file line numberDiff line numberDiff line change
@@ -29,15 +29,8 @@ export function useDocSearchKeyboardEvents({
2929
}: UseDocSearchKeyboardEventsProps) {
3030
React.useEffect(() => {
3131
function onKeyDown(event: KeyboardEvent) {
32-
function open() {
33-
// We check that no other DocSearch modal is showing before opening
34-
// another one.
35-
if (!document.body.classList.contains('DocSearch--active')) {
36-
onOpen();
37-
}
38-
}
3932
if (
40-
(event.keyCode === 27 && isOpen) ||
33+
(event.code === 'Escape' && isOpen) ||
4134
// The `Cmd+K` shortcut both opens and closes the modal.
4235
// We need to check for `event.key` because it can be `undefined` with
4336
// Chrome's autofill feature.
@@ -53,8 +46,12 @@ export function useDocSearchKeyboardEvents({
5346
if (isOpen) {
5447
onClose();
5548
} else if (!document.body.classList.contains('DocSearch--active')) {
56-
open();
49+
// We check that no other DocSearch modal is showing before opening
50+
// another one.
51+
onOpen();
5752
}
53+
54+
return;
5855
}
5956

6057
if (

‎packages/docsearch-react/src/useSearchClient.ts

+7-6
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
1-
import algoliasearch from 'algoliasearch/dist/algoliasearch-lite.esm.browser';
2-
import type { SearchClient } from 'algoliasearch/lite';
1+
import { liteClient } from 'algoliasearch/lite';
2+
import type { LiteClient } from 'algoliasearch/lite';
33
import React from 'react';
44

55
import { version } from './version';
66

77
export function useSearchClient(
88
appId: string,
99
apiKey: string,
10-
transformSearchClient: (searchClient: SearchClient) => SearchClient
11-
): SearchClient {
10+
transformSearchClient: (searchClient: LiteClient) => LiteClient
11+
): LiteClient {
1212
const searchClient = React.useMemo(() => {
13-
const client = algoliasearch(appId, apiKey);
13+
const client = liteClient(appId, apiKey);
1414
client.addAlgoliaAgent('docsearch', version);
1515

1616
// Since DocSearch.js relies on DocSearch React with an alias to Preact,
@@ -19,7 +19,8 @@ export function useSearchClient(
1919
// We therefore only add the `docsearch-react` user agent if `docsearch.js`
2020
// is not present.
2121
if (
22-
/docsearch.js \(.*\)/.test(client.transporter.userAgent.value) === false
22+
/docsearch.js \(.*\)/.test(client.transporter.algoliaAgent.value) ===
23+
false
2324
) {
2425
client.addAlgoliaAgent('docsearch-react', version);
2526
}

‎packages/docsearch-react/tsconfig.declaration.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
{
2-
"extends": "../../tsconfig.declaration"
2+
"extends": "../../tsconfig.declaration",
33
}

‎packages/website/docs/api.mdx

+2-1
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,8 @@ Learn more on the [Navigator API][11] documentation.
156156
157157
Allow translations of any raw text and aria-labels present in the DocSearch button or modal components.
158158

159-
<details><summary>docSearchTranslations</summary>
159+
<details>
160+
<summary>docSearchTranslations</summary>
160161
<div>
161162

162163
```ts

‎packages/website/docs/crawler.mdx

+3-3
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ You can also read our [Crawler FAQ](https://www.algolia.com/doc/tools/crawler/tr
1212
- [One of my pages was not crawled](https://www.algolia.com/doc/tools/crawler/troubleshooting/faq/#one-of-my-pages-was-not-crawled)
1313
- [Why are my pages skipped?](https://www.algolia.com/doc/tools/crawler/troubleshooting/faq/#when-are-pages-skipped-or-ignored)
1414

15-
For questions related to the DocSearch program, please see our [DocSearch program FAQ](/docs/DocSearch-program).
15+
For questions related to the DocSearch program, please see our [DocSearch program FAQ](/docs/docsearch-program).
1616

1717
## How often will you crawl my website?
1818

@@ -28,7 +28,7 @@ Ultimately, it is possible to set set the [`exclusionPatterns`](https://www.algo
2828

2929
## Are the [`docsearch-scraper`](https://github.com/algolia/docsearch-scraper) and [`docsearch-configs`](https://github.com/algolia/docsearch-configs) repository still maintained?
3030

31-
We've deprecated our legacy infrastructure, but you can still use it to [run your own instance](/docs/legacy/run-your-own) and plug it to [DocSearch v3](/docs/DocSearch-v3)!
31+
We've deprecated our legacy infrastructure, but you can still use it to [run your own instance](/docs/legacy/run-your-own) and plug it to [DocSearch v3](/docs/docsearch-v3)!
3232

3333
## How to migrate
3434

@@ -113,4 +113,4 @@ The fastest way will be to connect with us on our [Discord](https://alg.li/disco
113113

114114
[1]: https://alg.li/discord
115115
[2]: https://crawler.algolia.com/
116-
[3]: https://support.algolia.com/
116+
[3]: https://support.algolia.com/

‎packages/website/docs/DocSearch-program.md ‎packages/website/docs/docsearch-program.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ For questions related to the DocSearch x Algolia Crawler, please see our [Crawle
88

99
## What do I need to install on my side?
1010

11-
You just need to [implement DocSearch in your frontend](/docs/DocSearch-v3) with the credentials received by email when your application has been deployed.
11+
You just need to [implement DocSearch in your frontend](/docs/docsearch-v3) with the credentials received by email when your application has been deployed.
1212

1313
DocSearch leverages the [Algolia Crawler](https://www.algolia.com/products/search-and-discovery/crawler/), which offers a web [interface](https://crawler.algolia.com/) to create, monitor, edit, start your Crawlers. If you have any questions regarding it, please see our [Crawler FAQ](/docs/crawler).
1414

@@ -111,7 +111,7 @@ Here are some links to help you:
111111

112112
- [The Algolia Crawler documentation](https://www.algolia.com/doc/tools/crawler/getting-started/overview/)
113113
- [The Algolia Crawler FAQ](/docs/crawler)
114-
- [The DocSearch FAQ](/docs/DocSearch-program)
114+
- [The DocSearch FAQ](/docs/docsearch-program)
115115
- [The Algolia documentation](https://www.algolia.com/doc/)
116116

117117
You can also take a look at [the Algolia academy](https://academy.algolia.com/trainings) to understand more about Algolia.

‎packages/website/docs/DocSearch-v3.mdx ‎packages/website/docs/docsearch-v3.mdx

File renamed without changes.

‎packages/website/docs/how-does-it-work.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -47,5 +47,5 @@ Now that DocSearch is set, you don't have anything else to do. We'll keep crawli
4747
[4]: /docs/styling
4848
[5]: https://www.algolia.com/products/search-and-discovery/crawler/
4949
[6]: https://www.algolia.com/doc/tools/crawler/apis/configuration/
50-
[7]: /docs/DocSearch-v3
50+
[7]: /docs/docsearch-v3
5151
[8]: https://crawler.algolia.com/

‎packages/website/docs/migrating-from-legacy.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ Below are the keys that can be found in the [`legacy` DocSearch configs][14] and
6464
| `sitemap_alternate_links` | **removed** | Not needed anymore |
6565
| `stop_content` | **removed** | Should be handled in the [`recordExtractor`][28] and [`helpers.docsearch`][29] |
6666

67-
[1]: /docs/DocSearch-v3
67+
[1]: /docs/docsearch-v3
6868
[2]: https://www.algolia.com/products/search-and-discovery/crawler/
6969
[3]: /docs/legacy/run-your-own
7070
[4]: /docs/record-extractor

‎packages/website/docs/migrating-from-v2.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
title: Migrating from DocSearch v2
33
---
44

5-
This page lists the differences between the [DocSearch v2](/docs/legacy/dropdown) and [DocSearch v3](/docs/DocSearch-v3) API, you can also take a look at [the exhaustive `API reference` list](/docs/api) and [the `Getting started` guide](/docs/DocSearch-v3).
5+
This page lists the differences between the [DocSearch v2](/docs/legacy/dropdown) and [DocSearch v3](/docs/docsearch-v3) API, you can also take a look at [the exhaustive `API reference` list](/docs/api) and [the `Getting started` guide](/docs/docsearch-v3).
66

77
```diff
88
docsearch({

0 commit comments

Comments
 (0)