Skip to main content
The Workspace Settings API is experimental and may change in the future. Please don’t use it in production versions of your app.
This component is returned by experimental_useWorkspaceSettingsForm().
Any buttons placed inside workspace settings will be rendered appropriately within the form layout.

​
Example

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

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

function Page() {
  const { Form, TextInput, Button } = experimental_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.