Json field

In the table page, a json field will look like this

When you click on the “open” button

In the create / edit page

Config

validation

Optionnal, a Vine validation schema to enforce on the json field

e.g.

const fieldValidationSchema = vine.compile(
  vine.object({
    color: vine.string(),
    isBeautiful: vine.boolean(),
    age: vine.number().optional(),
  })
)

Tip

By default, the json field is not searchable/sortable, but you can override this behavior by using the sqlFilter and sqlSort options (for sqlFilter use the bindings parameter to pass values to the sql query to prevent sql injection)

{
  type: 'json',
  label: 'Paramètres',
  nullable: true,
  sqlFilter: (input) => {
    if (!input) return 'true'

    return {
      sql: `settings->>'color' like '%' || ? || '%'`,
      bindings: [input],
    }
  },
  sqlSort: (ascDesc) => `settings->>'color' ${ascDesc}`,
  validation: vine.compile(
    vine.object({
      color: vine.string(),
      isBeautiful: vine.boolean(),
      age: vine.number().optional(),
    })
  ),
}