From f7f6d26e1a5c3ae2d8a0adfaed2e30c4faf71ba0 Mon Sep 17 00:00:00 2001
From: Snorre Eskeland Brekke <snorre.e.brekke@gmail.com>
Date: Thu, 14 Sep 2023 16:31:06 +0200
Subject: [PATCH] fix: navigate to document when selecting it in index tool
 search

---
 src/embeddingsIndexDashboard/QueryIndex.tsx   | 20 ++++++++++++++++++-
 .../SemanticSearchAutocomplete.tsx            | 13 ++++++++----
 .../SemanticSearchReferenceInput.tsx          |  9 ++++-----
 3 files changed, 32 insertions(+), 10 deletions(-)

diff --git a/src/embeddingsIndexDashboard/QueryIndex.tsx b/src/embeddingsIndexDashboard/QueryIndex.tsx
index 2d8abdc..851a43a 100644
--- a/src/embeddingsIndexDashboard/QueryIndex.tsx
+++ b/src/embeddingsIndexDashboard/QueryIndex.tsx
@@ -1,6 +1,8 @@
 import {useCallback, useMemo} from 'react'
 import {SemanticSearchAutocomplete} from '../referenceInput/SemanticSearchAutocomplete'
 import {EmbeddingsIndexConfig} from '../schemas/typeDefExtensions'
+import {useRouter} from 'sanity/router'
+import {QueryResult} from '../api/embeddingsApi'
 
 export function QueryIndex(props: {indexName: string}) {
   const {indexName} = props
@@ -9,5 +11,21 @@ export function QueryIndex(props: {indexName: string}) {
     () => ({indexName, maxResults: 8}),
     [indexName],
   )
-  return <SemanticSearchAutocomplete getEmptySearchValue={getEmpty} indexConfig={indexConfig} />
+
+  const {resolveIntentLink, navigateUrl} = useRouter()
+  const onSelect = useCallback(
+    (hit: QueryResult) => {
+      navigateUrl({
+        path: resolveIntentLink('edit', {id: hit.value.documentId, type: hit.value.type}),
+      })
+    },
+    [resolveIntentLink, navigateUrl],
+  )
+  return (
+    <SemanticSearchAutocomplete
+      getEmptySearchValue={getEmpty}
+      indexConfig={indexConfig}
+      onSelect={onSelect}
+    />
+  )
 }
diff --git a/src/referenceInput/SemanticSearchAutocomplete.tsx b/src/referenceInput/SemanticSearchAutocomplete.tsx
index 40f85fd..cdb8375 100644
--- a/src/referenceInput/SemanticSearchAutocomplete.tsx
+++ b/src/referenceInput/SemanticSearchAutocomplete.tsx
@@ -21,7 +21,7 @@ export interface SemanticSearchAutocompleteProps {
   getEmptySearchValue: () => string
   typeFilter?: string[]
   filterResult?: (hit: QueryResult) => boolean
-  onChange?: (value: string) => void
+  onSelect?: (value: QueryResult) => void
   onFocus?: FocusEventHandler<HTMLInputElement>
   onBlur?: FocusEventHandler<HTMLInputElement>
   readOnly?: boolean
@@ -52,7 +52,7 @@ export const SemanticSearchAutocomplete = forwardRef(function SemanticSearchAuto
     readOnly,
     onFocus,
     onBlur,
-    onChange,
+    onSelect,
     typeFilter,
   } = props
   const id = useId()
@@ -138,9 +138,14 @@ export const SemanticSearchAutocomplete = forwardRef(function SemanticSearchAuto
         setOptions(NO_OPTIONS)
         return
       }
-      onChange?.(value)
+      const option = (options as Option[])
+        .filter((r): r is Option => 'result' in r)
+        .find((r) => r.result.value.documentId === value)
+      if (option && onSelect) {
+        onSelect(option.result)
+      }
     },
-    [onChange],
+    [onSelect, options],
   )
 
   return (
diff --git a/src/referenceInput/SemanticSearchReferenceInput.tsx b/src/referenceInput/SemanticSearchReferenceInput.tsx
index 94a9107..fc2ac7f 100644
--- a/src/referenceInput/SemanticSearchReferenceInput.tsx
+++ b/src/referenceInput/SemanticSearchReferenceInput.tsx
@@ -112,17 +112,16 @@ function SemanticSearchInput(props: ObjectInputProps & {indexConfig: EmbeddingsI
   const handleBlur = useCallback(() => onPathFocus([]), [onPathFocus])
 
   const handleChange = useCallback(
-    (nextId: string) => {
-      if (!nextId) {
+    (result: QueryResult) => {
+      if (!result) {
         onChange(unset())
         onPathFocus([])
         return
       }
-
       const patches = [
         setIfMissing({}),
         set(schemaType.name, ['_type']),
-        set(publicId(nextId), ['_ref']),
+        set(publicId(result.value.documentId), ['_ref']),
         unset(['_weak']),
         unset(['_strengthenOnPublish']),
       ]
@@ -150,7 +149,7 @@ function SemanticSearchInput(props: ObjectInputProps & {indexConfig: EmbeddingsI
       ref={autocompleteRef}
       typeFilter={typeFilter}
       indexConfig={indexConfig}
-      onChange={handleChange}
+      onSelect={handleChange}
       onFocus={handleFocus}
       onBlur={handleBlur}
       getEmptySearchValue={getEmptySearchValue}