mirror of
https://github.com/supabase/supabase.git
synced 2026-10-12 21:05:06 +03:00
32b5d8c244
* Start
* Add join org logic
* Regenerate the API types and add RQ hooks.
* Various fixes to the UI for SSO config.
* Refactor the components to use RHF.
* Fix the loading/error states in the main file.
* fix: minor changes to SSO UI
* Expanded default attribute mapping preset for `Okta` to include `user_name`, `first_name`, and `last_name` to match our docs.
* Normalized role casing in the "Join Organization on Signup" dropdown to match the roles expected by the backend (`Owner`, `Administrator`, `Developer`).
* Added the role (`Read-only`) to the selectable roles for auto-join.
* Call update mutation when an `ssoConfig` has been retrieved.
* Treats `404` as a valid "create" flow state rather than an error.
* Conditionally renders the SSO config form when config is successfully loaded *or* when the provider is not found, allowing users to onboard from scratch and disable the provider.
* chore: prettier
* feat: add a button linking to SSO setup docs
* Revert "feat: add a button linking to SSO setup docs"
This will be included in a separate docs pr.
This reverts commit 0b616fdd2e.
* General clean up
* Nit copy
* Add empty state for SSO
* Smol change
* One last tweak
---------
Co-authored-by: Chris Stockton <180184+cstockton@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
Co-authored-by: Chris Stockton <chris.stockton@supabase.io>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
67 lines
1.9 KiB
TypeScript
67 lines
1.9 KiB
TypeScript
import { Plus, Trash } from 'lucide-react'
|
|
import { useFieldArray, useForm } from 'react-hook-form'
|
|
|
|
import {
|
|
Button,
|
|
FormControl_Shadcn_,
|
|
FormField_Shadcn_,
|
|
FormItem_Shadcn_,
|
|
FormMessage_Shadcn_,
|
|
Input_Shadcn_,
|
|
} from 'ui'
|
|
import { FormItemLayout } from 'ui-patterns/form/FormItemLayout/FormItemLayout'
|
|
import { SSOConfigFormSchema } from './SSOConfig'
|
|
|
|
export const SSODomains = ({ form }: { form: ReturnType<typeof useForm<SSOConfigFormSchema>> }) => {
|
|
const { fields, append, remove } = useFieldArray({
|
|
control: form.control,
|
|
name: 'domains',
|
|
})
|
|
|
|
return (
|
|
<>
|
|
<FormItemLayout
|
|
label="Domains"
|
|
layout="flex-row-reverse"
|
|
description="Provide one or more domains"
|
|
>
|
|
<div className="grid gap-2 w-96">
|
|
{fields.map((field, idx) => (
|
|
<div key={field.id} className="flex gap-2 items-top">
|
|
<FormField_Shadcn_
|
|
name={`domains.${idx}.value`}
|
|
render={({ field }) => (
|
|
<FormItem_Shadcn_ className="flex-1">
|
|
<FormControl_Shadcn_>
|
|
<Input_Shadcn_ {...field} autoComplete="off" placeholder="example.com" />
|
|
</FormControl_Shadcn_>
|
|
<FormMessage_Shadcn_ />
|
|
</FormItem_Shadcn_>
|
|
)}
|
|
/>
|
|
|
|
<Button
|
|
type="default"
|
|
icon={<Trash size={12} />}
|
|
className="h-[34px] w-[34px]"
|
|
disabled={fields.length <= 1}
|
|
onClick={() => remove(idx)}
|
|
/>
|
|
</div>
|
|
))}
|
|
<div>
|
|
<Button
|
|
type="text"
|
|
icon={<Plus className="w-4 h-4" />}
|
|
size="tiny"
|
|
onClick={() => append({ value: '' })}
|
|
>
|
|
Add another
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</FormItemLayout>
|
|
</>
|
|
)
|
|
}
|