{#- Content: Form Sections, then a Danger Zone when the area has one. -#}
<.settings_layout current="/settings/profile" items={options([("Profile", "/settings/profile"), ("Notifications", "/settings/notifications"), ("Security", "/settings/security"), ("Appearance", "/settings/appearance"), ("API keys", "/settings/api-keys"), ("Billing", "/settings/billing")])}>
<form class="ui-form-section" data-layout="stacked" method="post" action="/settings/profile">
<div class="ui-form-section-head"><h2>Profile</h2><p>This is how others see you across the workspace.</p></div>
<div class="ui-form-section-body"><.input field={Field::named("profile[display_name]", "Ada Lovelace")} /></div>
<div class="ui-form-section-foot"><.button>Save profile</.button></div>
</form>
</.settings_layout>