From your tables to a maintained admin app

import { f, resource } from '@protobase/schema'

/** shop.repairs, described as it is */
export const repairs = resource('repairs')
  .table('shop.repairs')
  .fields({
    id: f.integer().readOnly().filterable().sortable().dbDefault(),
    number: f.text().readOnly().filterable().sortable().dbDefault(),
    customer_id: f.relation('customers').filterable().sortable(),
    bike: f.text(),
    problem: f.text(),
    status: f
      .enum(['booked', 'waiting', 'working', 'ready', 'collected'])
      .default('booked')
      .filterable()
      .sortable(),
    mechanic: f.text().optional().filterable().sortable(),
    estimate: f.decimal({ precision: 8, scale: 2 }).filterable().sortable(),
    paid: f.boolean().default(false).filterable(),
    booked_on: f.date().filterable().sortable(),
    // The column keeps its old name.
    notes: f.text().optional().column('internal_notes'),
    // An old column, left out on purpose.
    legacy_ref: null,
  })
  .primaryKey((r) => r.id)
  .validate((repair) =>
    repair.status === 'collected' && !repair.paid
      ? [{ field: 'paid', message: 'A bike leaves the shop paid' }]
      : undefined,
  )

import { view } from '@protobase/schema'
import type { repairs } from './data'

export const repairsView = view<typeof repairs>('repairs')
  .names({ singular: 'Repair', plural: 'Repairs' })
  .title((r) => r.number)
  .fields((r) => ({
    number: r.number.format('code'),
    customer_id: r.customer_id.label('Customer'),
    status: r.status.format('badge'),
    estimate: r.estimate.prefix('€').decimals(2),
  }))
  .list((r) => ({
    columns: [
      r.number, r.customer_id, r.bike, r.status,
      r.mechanic, r.estimate, r.booked_on,
    ],
    sort: [[r.booked_on, 'desc']],
    search: [r.number, r.bike],
  }))
  .filters((r, w) => [
    w.facets(r.status),
    w.facets(r.mechanic, { search: true }),
    w.dateRange(r.booked_on, { presets: ['7d', '30d', 'month'] }),
    w.range(r.estimate, { histogram: true }),
    w.toggle(r.paid),
  ])
  .chart((r) => ({ field: r.booked_on, range: '30d', granularity: 'day' }))