refactor: display certificate select field after https switch field inside add-domain dialogs

This commit is contained in:
Ben
2024-09-26 13:53:10 +02:00
parent 3b9f5d6f5c
commit 9059f42b03
2 changed files with 49 additions and 47 deletions

View File

@@ -140,7 +140,7 @@ export const AddDomain = ({
<DialogTrigger className="" asChild> <DialogTrigger className="" asChild>
{children} {children}
</DialogTrigger> </DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-2xl"> <DialogContent className="max-h-screen overflow-y-auto sm:max-w-2xl">
<DialogHeader> <DialogHeader>
<DialogTitle>Domain</DialogTitle> <DialogTitle>Domain</DialogTitle>
<DialogDescription>{dictionary.dialogDescription}</DialogDescription> <DialogDescription>{dictionary.dialogDescription}</DialogDescription>
@@ -241,6 +241,29 @@ export const AddDomain = ({
); );
}} }}
/> />
<FormField
control={form.control}
name="https"
render={({ field }) => (
<FormItem className="flex flex-row items-center justify-between p-3 mt-4 border rounded-lg shadow-sm">
<div className="space-y-0.5">
<FormLabel>HTTPS</FormLabel>
<FormDescription>
Automatically provision SSL Certificate.
</FormDescription>
<FormMessage />
</div>
<FormControl>
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
{form.getValues().https && ( {form.getValues().https && (
<FormField <FormField
control={form.control} control={form.control}
@@ -270,28 +293,6 @@ export const AddDomain = ({
)} )}
/> />
)} )}
<FormField
control={form.control}
name="https"
render={({ field }) => (
<FormItem className="mt-4 flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
<div className="space-y-0.5">
<FormLabel>HTTPS</FormLabel>
<FormDescription>
Automatically provision SSL Certificate.
</FormDescription>
<FormMessage />
</div>
<FormControl>
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
</div> </div>
</div> </div>
</form> </form>

View File

@@ -161,7 +161,7 @@ export const AddDomainCompose = ({
<DialogTrigger className="" asChild> <DialogTrigger className="" asChild>
{children} {children}
</DialogTrigger> </DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-2xl"> <DialogContent className="max-h-screen overflow-y-auto sm:max-w-2xl">
<DialogHeader> <DialogHeader>
<DialogTitle>Domain</DialogTitle> <DialogTitle>Domain</DialogTitle>
<DialogDescription>{dictionary.dialogDescription}</DialogDescription> <DialogDescription>{dictionary.dialogDescription}</DialogDescription>
@@ -190,7 +190,7 @@ export const AddDomainCompose = ({
{errorServices?.message} {errorServices?.message}
</AlertBlock> </AlertBlock>
)} )}
<div className="flex flex-row gap-4 w-full items-end"> <div className="flex flex-row items-end w-full gap-4">
<FormField <FormField
control={form.control} control={form.control}
name="serviceName" name="serviceName"
@@ -377,6 +377,29 @@ export const AddDomainCompose = ({
); );
}} }}
/> />
<FormField
control={form.control}
name="https"
render={({ field }) => (
<FormItem className="flex flex-row items-center justify-between p-3 mt-4 border rounded-lg shadow-sm">
<div className="space-y-0.5">
<FormLabel>HTTPS</FormLabel>
<FormDescription>
Automatically provision SSL Certificate.
</FormDescription>
<FormMessage />
</div>
<FormControl>
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
{https && ( {https && (
<FormField <FormField
control={form.control} control={form.control}
@@ -406,28 +429,6 @@ export const AddDomainCompose = ({
)} )}
/> />
)} )}
<FormField
control={form.control}
name="https"
render={({ field }) => (
<FormItem className="mt-4 flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
<div className="space-y-0.5">
<FormLabel>HTTPS</FormLabel>
<FormDescription>
Automatically provision SSL Certificate.
</FormDescription>
<FormMessage />
</div>
<FormControl>
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
</div> </div>
</div> </div>
</form> </form>