diff --git a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/Client/Results/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/Client/Results/index.tsx
index 54384b8d6..3e41881cf 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/Client/Results/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/Client/Results/index.tsx
@@ -12,7 +12,6 @@ import {
} from "react-aria-components"
import { useIntl } from "react-intl"
-import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
import styles from "./results.module.css"
@@ -77,19 +76,15 @@ export function Results({
href={item.url}
className={styles.item}
textValue={item.displayName}
+ // @ts-expect-error: pending https://github.com/adobe/react-spectrum/pull/8035
+ closeOnSelect={item.closesModal}
>
- {item.id === "clearHistory" ? (
- <>
-
-
-
- {intl.formatMessage({
- id: "Clear searches",
- })}
-
-
- >
- ) : null}
+ <>
+ {item.icon ? item.icon : null}
+
+ {item.displayName}
+
+ >
)}
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/Client/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/Client/index.tsx
index c17914cab..db8d77eb0 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/Client/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/Client/index.tsx
@@ -4,6 +4,8 @@ import { useCallback, useMemo, useState } from "react"
import { useIntl } from "react-intl"
import { useIsMounted, useMediaQuery } from "usehooks-ts"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
+
import { isDefined } from "@/server/utils"
import { ClientInline } from "./ClientInline"
@@ -132,7 +134,7 @@ export function JumpToClient({
[data]
)
- const latest: LocationMatchResults = useMemo(() => {
+ const latest = useMemo(() => {
if (data && history && history.length) {
const children = history
.map((v) => {
@@ -141,7 +143,7 @@ export function JumpToClient({
.filter(isDefined)
.slice(0, 5) // Only show five items
- return [
+ const results: LocationMatchResults = [
{
id: "latestSearches",
name: "Latest searches",
@@ -154,11 +156,15 @@ export function JumpToClient({
{
id: "clearHistory",
type: "clearHistory",
+ closesModal: false,
+ icon: ,
displayName: intl.formatMessage({ id: "Clear searches" }),
},
],
},
]
+
+ return results
}
return []
}, [data, history, intl])
diff --git a/apps/scandic-web/types/components/destinationOverviewPage/jumpTo/index.ts b/apps/scandic-web/types/components/destinationOverviewPage/jumpTo/index.ts
index a43d49706..1c27dd852 100644
--- a/apps/scandic-web/types/components/destinationOverviewPage/jumpTo/index.ts
+++ b/apps/scandic-web/types/components/destinationOverviewPage/jumpTo/index.ts
@@ -1,3 +1,4 @@
+import type { ReactNode } from "react"
import type { Key } from "react-aria-components"
export type JumpToDataItem = {
@@ -30,6 +31,8 @@ export type LocationMatch = {
type: string
description?: string
url?: string
+ closesModal?: boolean
+ icon?: ReactNode
}
export type ScoringMatch = LocationMatch & {