NewAwsMarketplaceOrgForm() — supabase Function Reference

Source Code

apps/studio/components/interfaces/Organization/CloudMarketplace/NewAwsMarketplaceOrgForm.tsx lines 51–157

const NewAwsMarketplaceOrgForm = ({ onSubmit }: Props) => {
  const form = useForm<NewMarketplaceOrgForm>({
    resolver: zodResolver(FormSchema),
    defaultValues: {
      name: '',
      kind: ORG_KIND_DEFAULT,
    },
  })

  const kind = form.watch('kind')

  return (
    <Form_Shadcn_ {...form}>
      <form id={CREATE_AWS_MANAGED_ORG_FORM_ID} onSubmit={form.handleSubmit(onSubmit)}>
        <div className="flex flex-col gap-4">
          <FormField_Shadcn_
            control={form.control}
            name="name"
            render={({ field }) => (
              <FormItemLayout label="Name" layout="horizontal">
                <FormControl_Shadcn_>
                  <>
                    <Input_Shadcn_ {...field} placeholder="Organization name" />
                    <div className="mt-1">
                      <Label_Shadcn_
                        htmlFor="name"
                        className="text-foreground-lighter leading-normal text-sm"
                      >
                        What's the name of your company or team?
                      </Label_Shadcn_>
                    </div>
                  </>
                </FormControl_Shadcn_>
              </FormItemLayout>
            )}
          />
          <FormField_Shadcn_
            control={form.control}
            name="kind"
            render={({ field }) => (
              <FormItemLayout label="Type" layout="horizontal">
                <FormControl_Shadcn_>
                  <>
                    <Select_Shadcn_ value={field.value} onValueChange={field.onChange}>
                      <SelectTrigger_Shadcn_>
                        <SelectValue_Shadcn_ />
                      </SelectTrigger_Shadcn_>
                      <SelectContent_Shadcn_>
                        {Object.entries(ORG_KIND_TYPES).map(([k, v]) => (
                          <SelectItem_Shadcn_ key={k} value={k}>
                            {v}
                          </SelectItem_Shadcn_>
                        ))}
                      </SelectContent_Shadcn_>
                    </Select_Shadcn_>
                    <div className="mt-1">
                      <Label_Shadcn_
                        htmlFor="kind"
                        className="text-foreground-lighter leading-normal text-sm"
                      >
                        What would best describe your organization?
                      </Label_Shadcn_>
                    </div>
                  </>
                </FormControl_Shadcn_>
              </FormItemLayout>
            )}
          />
          {kind == 'COMPANY' && (
            <FormField_Shadcn_
              control={form.control}
              name="size"
              render={({ field }) => (
                <FormItemLayout label="Company size" layout="horizontal">
                  <FormControl_Shadcn_>
                    <>
                      <Select_Shadcn_ value={field.value} onValueChange={field.onChange}>
                        <SelectTrigger_Shadcn_>
                          <SelectValue_Shadcn_ placeholder="How many people are in your company?" />
                        </SelectTrigger_Shadcn_>
                        <SelectContent_Shadcn_>
                          {Object.entries(ORG_SIZE_TYPES).map(([k, v]) => (
                            <SelectItem_Shadcn_ key={k} value={k}>
                              {v}
                            </SelectItem_Shadcn_>
                          ))}
                        </SelectContent_Shadcn_>
                      </Select_Shadcn_>
                      <div className="mt-1">
                        <Label_Shadcn_
                          htmlFor="size"
                          className="text-foreground-lighter leading-normal text-sm"
                        >
                          How many people are in your company?
                        </Label_Shadcn_>
                      </div>
                    </>
                  </FormControl_Shadcn_>
                </FormItemLayout>
              )}
            />
          )}
        </div>
      </form>
    </Form_Shadcn_>
  )
}