Issues with Displaying Paragraphs Using Typesense and React-instantsearch
TLDR Mark is struggling with displaying only relevant paragraphs of indexed body text in a UI with react-instantsearch and Typesense. Jason suggests modifications to the TypesenseInstantSearchAdapter instantiation, highlighting only relevant fields. The issue remains unresolved.
1
1
Oct 31, 2023 (1 month ago)
Mark
01:34 PMTo correct this, I have added the Snippet widget. While this shortens the output for each paragraph, all paragraphs are still included even if they are not highlighted.
Following is my schema and react page. Any help would be greatly appreciated.
collectionSchema: { // Required
name: "pages_v1",
enable_nested_fields: true,
fields: [
{
name: "title",
type: "string",
optional: true,
},
{
name: "body_text",
type: "string[]",
optional: true,
},
{
name: "site_section",
type: "string[]",
optional: true,
facet: true,
},
{
name: "page_path", // Required
type: "string",
},
{
name: "page_priority_score", // Required
type: "int32",
},
],
default_sorting_field: "page_priority_score", // Required
},```
export default function SearchInterface() {const Hit = ({ hit }) => (
<>
<details>
<summary><Link to={hit.page_path}><Highlight attribute="title" hit={hit} /></Link></summary>
<Snippet hit={hit} attribute="body_text" separator=" ——— " />
</details>
</>
)
return (
<Search>
<InstantSearch searchClient={searchClient} indexName="pages_v1">
<Textpage>
<div className="title">
<SearchBox placeholder="search" autoFocus="true" />
<p><Stats /></p>
</div>
<main>
<Sectionnav>
<RefinementList attribute="site_section" />
</Sectionnav>
<div className="right">
<Hits hitComponent={Hit} />
</div>
</main>
<div className="title"><Pagination /></div>
</Textpage>
</InstantSearch>
</Search>
)
}```
Jason
04:58 PMmulti_search
request, copy as curl and paste it here, minus the API key?Mark
08:05 PMcurl ‘https://dxkjm74r9falewn2p-1.a1.typesense.net/multi_search?x-typesense-api-key=xxx’ \
-H ‘authority: dxkjm74r9falewn2p-1.a1.typesense.net’ \
-H ‘accept: application/json, text/plain, /’ \
-H ‘accept-language: en-US,en;q=0.9’ \
-H ‘content-type: text/plain’ \
-H ‘dnt: 1’ \
-H ‘origin: https://mecad-production.netlify.app’ \
-H ‘sec-ch-ua: “Not=A?Brand”;v=“99", “Chromium”;v=“118"’ \
-H ‘sec-ch-ua-mobile: ?0’ \
-H ‘sec-ch-ua-platform: “macOS”’ \
-H ‘sec-fetch-dest: empty’ \
-H ‘sec-fetch-mode: cors’ \
-H ‘sec-fetch-site: cross-site’ \
-H ‘sec-gpc: 1’ \
-H ‘user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36’ \
--data-raw ‘{“searches”:[{“query_by”:“title, page_path, body_text, site_section”,“highlight_affix_num_tokens”:50,“highlight_full_fields”:“title, page_path, body_text, site_section”,“collection”:“pages_v1”,“q”:“anders”,“facet_by”:“site_section”,“max_facet_values”:10,“page”:1}]}’ \
--compressed
Jason
08:13 PMconst typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter({
...
additionalSearchParameters: {
query_by: 'title, page_path, body_text, site_section',
highlight_fields: 'body_text',
highlight_full_fields: 'title, page_path, site_section',
highlight_affix_num_tokens: 50,
...
},
});
1
Jason
08:14 PMhighlight_fields
will snippet the body_text
and for the other fields, the full field will be highlighted1
Nov 01, 2023 (1 month ago)
Mark
08:49 PMIs it possible to exclude snippets that do not have a highlight? or to set a maximum number of characters of body text displayed?
I saw a tutorial that used the truncate method from Tailwind. I’m not using Tailwind so I’m hoping there is another truncate method.
Jason
08:51 PMIdeally you'd want to break large pieces of text into smaller records... But I'm not sure I fully understand this. Could you share a screenshot of this issue?
Typesense
Indexed 3011 threads (79% resolved)
Similar Threads
Troubleshooting Typesense Setup and Understanding Facets and Keywords
Demitri encountered errors when exploring Typesense for the first time. Jason guided them through troubleshooting and discussed facets, keyword settings, and widget configurations. Helin shared a Python demo app and its source code to help Demitri with their project.
Phrase Search Relevancy and Weights Fix
Jan reported an issue with phrase search relevancy using Typesense Instantsearch Adapter. The problem occurred when searching phrases with double quotes. The team identified the issue to be related to weights and implemented a fix, improving the search results.
Querying and Indexing Multiple Elements Issues
Krish queried fields with multiple elements, which Kishore Nallan suggested checking `drop_tokens_threshold`. Krish wished to force OR mode for token, but Kishore Nallan admitted the feature was missing. Krish was able to resolve the issue with url encoding.