@react-querybuilder/drizzle

Augments react-querybuilder with Drizzle ORM integration.

[!TIP]

This package is unnecessary, and only supports Drizzle's query builder API (like db.select().from(table).where(...)) anyway.

Recommended alternatives

For Drizzle's relational queries API, use formatQuery from react-querybuilder with the "drizzle" format. Assign the result to the where property of .findMany() or a related function, like so:

import { formatQuery } from 'react-querybuilder/formatQuery';
const where = formatQuery(query, 'drizzle');
const results = db.query.myTable.findMany({ where });

For Drizzle's query builder API, use the "drizzle" format in the same way as above and then pass a table definition and Drizzle operators into the generated function. Pass the result of that call to .where(), like so:

import { getOperators } from 'drizzle-orm';
import { drizzle } from 'drizzle-orm/bun-sqlite';
import { sqliteTable, text } from 'drizzle-orm/sqlite-core';
import { formatQuery } from 'react-querybuilder/formatQuery';

const db = drizzle(process.env.DB_FILE_NAME!);
const table = sqliteTable('musicians', {
  firstName: text(),
  lastName: text(),
});

const whereFn = formatQuery(query, 'drizzle');
const whereObj = whereFn(table, getOperators());
const results = db.select().from(table).where(whereObj);

Installation

npm i react-querybuilder @react-querybuilder/drizzle
# OR yarn add / pnpm add / bun add

Usage

To produce a Drizzle query based on a React Query Builder query object, first generate a rule group processor with generateDrizzleRuleGroupProcessor using your table config (or a plain object mapping field names to Drizzle Columns). Then run formatQuery, assigning your rule group processor as ruleGroupProcessor.

import { formatQuery } from 'react-querybuilder';
import { generateDrizzleRuleGroupProcessor } from '@react-querybuilder/drizzle';
import { drizzle } from 'drizzle-orm/bun-sqlite';
import { sqliteTable } from 'drizzle-orm/sqlite-core';
import { fields } from './fields';

const db = drizzle(process.env.DB_FILE_NAME!);

const table = sqliteTable('table', {
  firstName: text(),
  lastName: text(),
});

const ruleGroupProcessor = generateDrizzleRuleGroupProcessor(table);

const sqlWhere = formatQuery(query, { fields, ruleGroupProcessor });

const results = db.select().from(table).where(sqlWhere);