novadb-react

React hooks and provider for NovaDB — the high-performance embeddable Rust database.

Install

npm install novadb-react novadb-rs

Setup — wrap your app with <NovaDBProvider>

// main.tsx / index.tsx
import React from 'react'
import ReactDOM from 'react-dom/client'
import { NovaDBProvider } from 'novadb-react'
import { NovaDb } from 'novadb-rs'
import App from './App'

ReactDOM.createRoot(document.getElementById('root')!).render(
  <NovaDBProvider db={() => NovaDb.inMemory()}>
    <App />
  </NovaDBProvider>
)

useQuery — read data reactively

import { useQuery, useNovaDB } from 'novadb-react'

function UserList() {
  const db = useNovaDB()

  const { data, loading, error, refetch } = useQuery(
    () => db.collection('users').find({ active: true }),
    { deps: [] }   // re-run when deps change (like useEffect)
  )

  if (loading) return <p>Loading…</p>
  if (error)   return <p>Error: {error.message}</p>

  return (
    <>
      <button onClick={refetch}>Refresh</button>
      <ul>
        {data?.map(u => <li key={u._id as string}>{u.name as string}</li>)}
      </ul>
    </>
  )
}

useMutation — write data

import { useMutation, useNovaDB } from 'novadb-react'

function AddUser() {
  const db = useNovaDB()

  const { mutate, loading, error } = useMutation(
    (name: string) =>
      db.collection('users').insert({ name, active: true, createdAt: Date.now() })
  )

  async function handleAdd() {
    await mutate('Alice')
    // data is inserted — trigger a refetch in useQuery via shared state or context
  }

  return (
    <button onClick={handleAdd} disabled={loading}>
      {loading ? 'Saving…' : 'Add User'}
    </button>
  )
}

useSubscription — poll for live updates

import { useSubscription, useNovaDB } from 'novadb-react'

function LiveCount() {
  const db = useNovaDB()

  const { data } = useSubscription(
    () => db.collection('messages').count({}),
    { interval: 2000 }   // poll every 2 seconds
  )

  return <p>Messages: {data ?? '…'}</p>
}

Full CRUD example

import { useState } from 'react'
import { useQuery, useMutation, useNovaDB } from 'novadb-react'

interface User { _id: string; name: string; age: number }

function Users() {
  const db   = useNovaDB()
  const col  = db.collection<User>('users')
  const [name, setName] = useState('')

  const { data: users = [], loading, refetch } = useQuery(
    () => col.find({}),
    { deps: [] }
  )

  const { mutate: addUser } = useMutation(async (name: string) => {
    await col.insert({ name, age: 0 })
    refetch()
  })

  const { mutate: removeUser } = useMutation(async (id: string) => {
    await col.deleteOne({ _id: id })
    refetch()
  })

  return (
    <div>
      <input value={name} onChange={e => setName(e.target.value)} placeholder="Name" />
      <button onClick={() => addUser(name)}>Add</button>

      {loading ? <p>Loading…</p> : (
        <ul>
          {users.map(u => (
            <li key={u._id}>
              {u.name}
              <button onClick={() => removeUser(u._id)}>Delete</button>
            </li>
          ))}
        </ul>
      )}
    </div>
  )
}

API

| Hook / Component | Description | |---|---| | <NovaDBProvider db={...}> | Provides the DB instance to the component tree | | useNovaDB() | Returns the NovaDB instance | | useNovaDBContext() | Returns { db, ready, error } | | useQuery(fn, opts) | Runs a query, returns { data, loading, error, refetch } | | useMutation(fn) | Returns { mutate, loading, error } | | useSubscription(fn, opts) | Polls a query at interval ms |

License

MIT