shuding / nextra

Simple, powerful and flexible site generation framework with everything you love from Next.js.
https://nextra.site
MIT License
11.86k stars 1.28k forks source link

Issue with `Search Bar` Functionality in `Nextra Docs Theme` #3673

Open kalinsky-dev opened 1 week ago

kalinsky-dev commented 1 week ago

Hello Nextra Team,

My colleagues and I are using the nextra docs-theme to build our documentation site. During development, we encountered an issue: the Search Bar, powered by FlexSearch, does not index content from our custom React components imported in .mdx files. It seems to only index the plain text written directly within the .mdx files.

Upon investigating, we found that the data used by the search bar is sourced from a JSON file located at .next/static/chunks/nextra-data-${locale}.json. This file contains metadata such as the path to the .mdx file, its title, and the data to be indexed. Here's an example of the file's structure:

{
    "/docs/architecture": {
        "title": "Our architecture",
        "data": {
            "how-does-it-work:#How Does It Work?": "some content here",
            "data-collection#Data Collection": "some other content here"
        }
    },
    "/docs/reference-documentation/DataStore": {
        "title": "DataStore",
        "data": {}
    }
}

The DataStore.mdx file imports a React Component and looks like this:

---
title: DataStore
---

import { DataStoreComponent } from '@/components/DataStoreComponent';

<DataStoreComponent data={JSON string} />

When we search for content in the DataStore file, no results are returned, likely because the data object is empty for that file.

Could you offer any guidance on how to resolve this issue so that content from custom React components is indexed properly in the search?

Thank you for your help!

Best regards,
Kalin

dimaMachina commented 1 week ago

this will be fixed in Nextra 4 with new search engine Pagefind