Settings.useForm() returns the form components for a settings page. Pass your app’s settings schema; the components’ name props are typed off it. Unlike regular forms created with useForm(), workspace settings forms automatically save changes and don’t require an onSubmit handler:
- Text inputs and number inputs save
onBlur(when the user leaves the field) - Toggles, checkboxes, and comboboxes save
onChange(immediately when changed)
Only workspace admins can edit workspace settings. However, all workspace members can view the
settings.
Parameters
WorkspaceSettingsSchema
required
The schema built with
Settings.defineWorkspaceSchema, imported
from your schema file.Returns
An object containing the following form components. Note that settings forms do not include a submit button, as changes are saved automatically.Form component
<Form />- The form wrapper
Input components
<AttioUserCombobox />- Select Attio workspace users<Checkbox />- Boolean checkbox input<Combobox />- Dropdown selection input<InputGroup />- Group multiple inputs together<NumberInput />- Numeric input field<RichTextInput />- Rich text input field<TextInput />- Text input field<Toggle />- Boolean toggle switch
Layout components
<Section />- Group form fields into sections
Utility components
<Button />- Action buttons for additional functionality<WithState />- Access form state for conditional rendering
Example
src/app/settings/page.tsx