Skip to main content
This component is returned by useWorkspaceSettingsForm().
Any buttons placed inside workspace settings will be rendered appropriately within the form layout.

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, TextInput, Button} = useWorkspaceSettingsForm()

  return (
    <Form>
      <TextInput label="Display name" name="display_name" />
      <Button
        title="Reset to defaults"
        description="This will restore all settings to their default values."
        label="Reset"
        variant="destructive"
        onClick={() => {
          // code here
        }}
      />
    </Form>
  )
}

Props

title
string
required
The title of the button section.
description
string
An optional description that provides additional context about what the button does.
label
string
required
The text of the button.
onClick
() => void
required
A function that will be called if the user clicks the button.
variant
"secondary" | "destructive"
The style of the button.Defaults to "secondary".
disabled
boolean
Whether or not the button is disabled.Defaults to false.