Fumadocs

Orama Cloud

Integrate with Orama Cloud

Setup

To begin, create an account on Orama Cloud.

  1. Create a new index from Dashboard.

  2. Use the following schema:

    {
      "id": "string",
      "title": "string",
      "url": "string",
      "tag": "string",
      "page_id": "string",
      "section": "string",
      "section_id": "string",
      "content": "string"
    }
  3. Then, using the API key and index ID from dashboard, create a script to sync search indexes.

    sync-index.mjs
    import { sync } from 'fumadocs-core/search/orama-cloud';
    import * as fs from 'node:fs/promises';
    import { CloudManager } from '@oramacloud/client';
     
    export async function updateSearchIndexes() {
      const apiKey = process.env.ORAMA_PRIVATE_API_KEY; // private API key
     
      if (!apiKey) {
        console.log('no api key for Orama found, skipping');
        return;
      }
     
      const content = await fs.readFile('.next/server/app/static.json.body');
      const records = JSON.parse(content.toString());
     
      const manager = new CloudManager({ api_key: apiKey });
     
      await sync(manager, {
        index: '<index>',
        documents: records,
      });
     
      console.log(`search updated: ${records.length} records`);
    }
     
    void updateSearchIndexes();
  4. Create a route handler in your Next.js app to export search indexes.

    app/static.json/route.ts
    import { NextResponse } from 'next/server';
    import { type OramaDocument } from 'fumadocs-core/search/orama-cloud';
    import { source } from '@/lib/source';
     
    export const revalidate = false;
     
    export function GET() {
      const results: OramaDocument[] = [];
     
      for (const page of source.getPages()) {
        results.push({
          id: page.url,
          structured: page.data.structuredData,
          url: page.url,
          title: page.data.title,
          description: page.data.description,
        });
      }
     
      return NextResponse.json(results);
    }
  5. Run the script after next build.

Search Client

To search documents on the client side, use Fumadocs UI Search Dialog, or make your own implementation.

In addition, the headless search client of Fumadocs can handle state management for React.

import { useDocsSearch } from 'fumadocs-core/search/client';
import { OramaClient } from '@oramacloud/client';
 
const client = new OramaClient();
 
const { search, setSearch, query } = useDocsSearch({
  type: 'orama-cloud',
  client,
  params: {
    // search params
  },
});
Edit on GitHub

Last updated on

On this page