Skip to main content
This component is returned by useWorkspaceSettingsForm().
Unlike with useForm() where validation is defined in the schema, workspace settings validation is specified directly on the input components using props like min and max.

​
Example

workspace-settings.tsx
import React from "react"
import {useWorkspaceSettingsForm} from "attio/client"
import type {App} from "attio"

export const workspaceSettings: App.Settings.Workspace = {
  Page,
}

function Page() {
  const {Form, NumberInput} = useWorkspaceSettingsForm()

  return (
    <Form>
      <NumberInput
        label="Sync interval (minutes)"
        name="sync_interval_minutes"
        min={5}
        max={1440}
      />
      <NumberInput label="Max records per sync" name="max_records_per_sync" min={1} />
    </Form>
  )
}

​
Props

​
label
string
required
The label of the input field.
​
name
string
required
The path to the number value of the input field in your settings schema.e.g. "sync_interval_minutes", "api.timeout_seconds"
​
placeholder
string
An optional placeholder text for your input.
​
min
number
The minimum allowed value. Validation will fail if the user inputs a number less than this value.
​
max
number
The maximum allowed value. Validation will fail if the user inputs a number greater than this value.
​
disabled
boolean
Whether or not the field should be disabled.Defaults to false (not disabled).