Settings page recipe

A settings page is for values that exist once, not as a list of records. A site name, a support email, a feature flag: there is a single current value, and the screen is a form with a Save button that updates that value. A resource would force a list and an id in the URL. SettingsPage is the page type that skips the list and calls fill() to load the singleton and save() to write it back.

This recipe is that screen. The general idea of pages that are not resources is Pages.

SettingsPage — tabs, sticky Save in the page heading, and `fill()` / `save()` hooks for a singleton record.

import { SettingsPage, Tabs, Tab, Section, TextInput, type FormBuilder } from '@shamar/core'

export default class AppSettingsPage extends SettingsPage {
  static override slug = 'settings'
  static override label = 'Settings'
  static override icon = 'cog'

  static override form(form: FormBuilder) {
    form.schema([
      Tabs.make()
        .columnSpanFull()
        .tabs([
          Tab.make('Branding').schema([
            Section.make('App branding').schema([
              TextInput.make('name').label('Brand name'),
            ]),
          ]),
        ]),
    ])
    return form
  }

  static override async fill() {
    /* load singleton */
    return { name: '' }
  }

  static override async save(data: Record<string, unknown>) {
    /* persist */
    return { message: 'Settings saved' }
  }
}

See the SettingsPage reference for the full API.