From 3b49d1890826229f76f6041da4d9f268962e6d33 Mon Sep 17 00:00:00 2001 From: Robin Cussol Date: Fri, 24 Nov 2023 15:52:35 +0100 Subject: [PATCH] fix(Popover): use useRandomId hook instead of React.useId directly Some folks haven't migrated to React 18 yet, so we must continue to use our useRandomId hook instead of React.useId directly. Slack: https://skypicker.slack.com/archives/C7T7QG7M5/p1700834303233829 --- packages/orbit-components/src/Popover/index.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/orbit-components/src/Popover/index.tsx b/packages/orbit-components/src/Popover/index.tsx index f845a08c42..005201c618 100644 --- a/packages/orbit-components/src/Popover/index.tsx +++ b/packages/orbit-components/src/Popover/index.tsx @@ -5,6 +5,7 @@ import * as React from "react"; import useStateWithTimeout from "../hooks/useStateWithTimeout"; import { PLACEMENTS } from "../common/consts"; import PopoverContent from "./components/ContentWrapper"; +import useRandomId from "../hooks/useRandomId"; import Portal from "../Portal"; import handleKeyDown from "../utils/handleKeyDown"; import type { Props } from "./types"; @@ -34,7 +35,7 @@ const Popover = ({ dataTest, }: Props) => { const ref = React.useRef(null); - const popoverId = React.useId(); + const popoverId = useRandomId(); const [shown, setShown, setShownWithTimeout, clearShownTimeout] = useStateWithTimeout( false,