construction a dynamic query builder generically ?

Ok i'm not really sure how to ask this but I'm trying to allow a user the ability in UI to build out a query builder where they can add many filters with potentially nested filters with AND/OR conjuctions. Like airtable.

Anyone have any patterns how to do this?

I had attempted to try to construct a mapping on the SQL operators and the drizzle functions but I can't get the types to work .

I'm playing aroung just with the

sql

sql

operator to try making ti work with more raw SQL.

trying to wrap my head around this and its a pattern i've seen few apps implement and never seen any code online to use as a guide

Ideally a user can do a query in the UI like below and the queries can be constructed dynamically.

Filter employes where 
  name = john AND
  salary >= 50,000 AND
  relatedDepartment contains 'billing' AND
  ( department_city does not contain NYC OR
    whatever... equals blah
  )

Filter employes where 
  name = john AND
  salary >= 50,000 AND
  relatedDepartment contains 'billing' AND
  ( department_city does not contain NYC OR
    whatever... equals blah
  )

const operators: Record<OperatorNames, Operator> = {
    contains: {
        label: 'Contains',
        name: 'contains',
        sql: 'LIKE',
        drizzle: (column: Column, value: string | SQLWrapper): typeof like => {
            return like(column, value)
        },
    },
        // other operators...
}

const operators: Record<OperatorNames, Operator> = {
    contains: {
        label: 'Contains',
        name: 'contains',
        sql: 'LIKE',
        drizzle: (column: Column, value: string | SQLWrapper): typeof like => {
            return like(column, value)
        },
    },
        // other operators...
}

construction a dynamic query builder generically ?

sql

sql

Filter employes where 
  name = john AND
  salary >= 50,000 AND
  relatedDepartment contains 'billing' AND
  ( department_city does not contain NYC OR
    whatever... equals blah
  )

Filter employes where 
  name = john AND
  salary >= 50,000 AND
  relatedDepartment contains 'billing' AND
  ( department_city does not contain NYC OR
    whatever... equals blah
  )

const operators: Record<OperatorNames, Operator> = {
    contains: {
        label: 'Contains',
        name: 'contains',
        sql: 'LIKE',
        drizzle: (column: Column, value: string | SQLWrapper): typeof like => {
            return like(column, value)
        },
    },
        // other operators...
}

const operators: Record<OperatorNames, Operator> = {
    contains: {
        label: 'Contains',
        name: 'contains',
        sql: 'LIKE',
        drizzle: (column: Column, value: string | SQLWrapper): typeof like => {
            return like(column, value)
        },
    },
        // other operators...
}

construction a dynamic query builder generically ?

Similar Threads

construction a dynamic query builder generically ?

Similar Threads

Similar Threads

Similar Threads