Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
fix(searchbutton): fix react production hydration error (#1384)
Co-authored-by: Clément Vannicatte <vannicattec@gmail.com>
  • Loading branch information
nissy-dev and shortcuts committed Jun 24, 2022
1 parent 8076389 commit 448192e
Show file tree
Hide file tree
Showing 2 changed files with 8 additions and 7 deletions.
4 changes: 2 additions & 2 deletions bundlesize.config.json
Expand Up @@ -6,11 +6,11 @@
},
{
"path": "packages/docsearch-react/dist/umd/index.js",
"maxSize": "20.25 kB"
"maxSize": "20.30 kB"
},
{
"path": "packages/docsearch-js/dist/umd/index.js",
"maxSize": "28.15 kB"
"maxSize": "28.20 kB"
}
]
}
11 changes: 6 additions & 5 deletions packages/docsearch-react/src/DocSearchButton.tsx
@@ -1,4 +1,4 @@
import React, { useMemo } from 'react';
import React, { useEffect, useState } from 'react';

import { ControlKeyIcon } from './icons/ControlKeyIcon';
import { SearchIcon } from './icons/SearchIcon';
Expand All @@ -25,13 +25,14 @@ export const DocSearchButton = React.forwardRef<
>(({ translations = {}, ...props }, ref) => {
const { buttonText = 'Search', buttonAriaLabel = 'Search' } = translations;

const key = useMemo<
const [key, setKey] = useState<
typeof ACTION_KEY_APPLE | typeof ACTION_KEY_DEFAULT | null
>(() => {
>(null);

useEffect(() => {
if (typeof navigator !== 'undefined') {
return isAppleDevice() ? ACTION_KEY_APPLE : ACTION_KEY_DEFAULT;
isAppleDevice() ? setKey(ACTION_KEY_APPLE) : setKey(ACTION_KEY_DEFAULT);
}
return null;
}, []);

return (
Expand Down

0 comments on commit 448192e

Please sign in to comment.