1
1
import { Input } from '@/components/primitives/input' ;
2
2
import { SecretInput } from '@/components/primitives/secret-input' ;
3
3
import { Select , SelectContent , SelectItem , SelectTrigger , SelectValue } from '@/components/primitives/select' ;
4
+ import { Textarea } from '@/components/primitives/textarea' ;
4
5
import { Switch } from '@/components/primitives/switch' ;
5
6
import { CredentialsKeyEnum , IProviderConfig } from '@novu/shared' ;
6
7
import { Control } from 'react-hook-form' ;
@@ -32,14 +33,24 @@ const SECURE_CREDENTIALS = [
32
33
] ;
33
34
34
35
export function CredentialsSection ( { provider, control } : CredentialsSectionProps ) {
36
+ console . log ( provider ) ;
35
37
return (
36
38
< div className = "border-neutral-alpha-200 bg-background text-foreground-600 mx-0 mt-0 flex flex-col gap-2 rounded-lg border p-3" >
37
39
{ provider ?. credentials ?. map ( ( credential ) => (
38
40
< FormField
39
41
key = { credential . key }
40
42
control = { control }
41
43
name = { `credentials.${ credential . key } ` }
42
- rules = { { required : credential . required ? `${ credential . displayName } is required` : false } }
44
+ rules = { {
45
+ required : credential . required ? `${ credential . displayName } is required` : false ,
46
+ validate : credential . validation ?. validate ,
47
+ pattern : credential . validation ?. pattern
48
+ ? {
49
+ value : credential . validation . pattern ,
50
+ message : credential . validation . message || 'Invalid format' ,
51
+ }
52
+ : undefined ,
53
+ } }
43
54
render = { ( { field, fieldState } ) => (
44
55
< FormItem className = "mb-2" >
45
56
< FormLabel htmlFor = { credential . key } optional = { ! credential . required } >
@@ -66,6 +77,16 @@ export function CredentialsSection({ provider, control }: CredentialsSectionProp
66
77
</ SelectContent >
67
78
</ Select >
68
79
</ FormControl >
80
+ ) : credential . type === 'textarea' ? (
81
+ < FormControl >
82
+ < Textarea
83
+ id = { credential . key }
84
+ placeholder = { `Enter ${ credential . displayName . toLowerCase ( ) } ` }
85
+ value = { field . value || '' }
86
+ onChange = { field . onChange }
87
+ rows = { 7 }
88
+ />
89
+ </ FormControl >
69
90
) : credential . type === 'secret' || SECURE_CREDENTIALS . includes ( credential . key as CredentialsKeyEnum ) ? (
70
91
< FormControl >
71
92
< SecretInput
@@ -88,7 +109,7 @@ export function CredentialsSection({ provider, control }: CredentialsSectionProp
88
109
</ FormControl >
89
110
) }
90
111
91
- < FormMessage > { credential . description } </ FormMessage >
112
+ < FormMessage > { fieldState . error ?. message || credential . description } </ FormMessage >
92
113
</ FormItem >
93
114
) }
94
115
/>
0 commit comments