fix: fixed hydration errors by setting ids

moved scripts to body since beforeInteractive strategy ones will be placed in the head regardless, avoiding double render

apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/index.tsx

@@ -2,7 +2,7 @@
 
 import { cva } from "class-variance-authority"
 import Downshift from "downshift"
-import { type ChangeEvent, type FormEvent } from "react"
+import { type ChangeEvent, type FormEvent, useId } from "react"
 import { useFormContext, useWatch } from "react-hook-form"
 import { useIntl } from "react-intl"
 
@@ -46,6 +46,7 @@ export function Search({
 }: SearchProps) {
   const { register, setValue, setFocus } = useFormContext()
   const intl = useIntl()
+  const searchLabelId = useId()
   const searchTerm = useWatch({ name: SEARCH_TERM_NAME }) as string
   const { searchHistory, insertSearchHistoryItem, clearHistory } =
     useSearchHistory()
@@ -117,7 +118,10 @@ export function Search({
         <div className={searchContainerVariants({ variant })}>
           <div className={styles.inputContainer}>
             <label
-              {...getLabelProps({ htmlFor: SEARCH_TERM_NAME })}
+              {...getLabelProps({
+                htmlFor: SEARCH_TERM_NAME,
+                id: searchLabelId,
+              })}
               className={labelVariants({
                 color: withSearchButton && isOpen ? "default" : "red",
               })}
@@ -127,11 +131,17 @@ export function Search({
                   {intl.formatMessage({ defaultMessage: "Where to?" })}
                 </span>
               </Typography>
-              <div {...getRootProps({}, { suppressRefError: true })}>
+              <div
+                {...getRootProps(
+                  { "aria-labelledby": searchLabelId },
+                  { suppressRefError: true }
+                )}
+              >
                 <div className={searchInputClassName}>
                   <Input
                     {...getInputProps({
                       id: SEARCH_TERM_NAME,
+                      "aria-labelledby": searchLabelId,
                       onFocus() {
                         openMenu()
                       },