1
- import { deprecated_Form as Form , Details } from "@cloudogu/ces-theme-tailwind" ;
2
- import { Button , H2 , ListWithSearchbar } from "@cloudogu/deprecated-ces-theme-tailwind" ;
3
- import { TrashIcon } from "@heroicons/react/24/outline" ;
4
- import { twMerge } from "tailwind-merge" ;
5
- import { t } from "../../helpers/i18nHelpers" ;
6
- import { useConfirmation } from "../../hooks/useConfirmation" ;
7
- import { Prompt } from "../../hooks/usePrompt" ;
1
+ import { deprecated_Form as Form , Details } from "@cloudogu/ces-theme-tailwind" ;
2
+ import { Button , H2 , ListWithSearchbar } from "@cloudogu/deprecated-ces-theme-tailwind" ;
3
+ import { TrashIcon } from "@heroicons/react/24/outline" ;
4
+ import { twMerge } from "tailwind-merge" ;
5
+ import { t } from "../../helpers/i18nHelpers" ;
6
+ import { useConfirmation } from "../../hooks/useConfirmation" ;
7
+ import { Prompt } from "../../hooks/usePrompt" ;
8
8
import useUserFormHandler from "../../hooks/useUserFormHandler" ;
9
- import { GroupsService } from "../../services/Groups" ;
10
- import { ConfirmationDialog } from "../ConfirmationDialog" ;
11
- import { useApplicationContext } from "../contexts/ApplicationContext" ;
9
+ import { GroupsService } from "../../services/Groups" ;
10
+ import { ConfirmationDialog } from "../ConfirmationDialog" ;
11
+ import { useApplicationContext } from "../contexts/ApplicationContext" ;
12
12
import HelpLink from "../helpLink" ;
13
- import type { Group } from "../../services/Groups" ;
14
- import type { User } from "../../services/Users" ;
15
- import type { NotifyFunction , UseFormHandlerFunctions } from "@cloudogu/deprecated-ces-theme-tailwind" ;
13
+ import type { Group } from "../../services/Groups" ;
14
+ import type { User } from "../../services/Users" ;
15
+ import type { NotifyFunction , UseFormHandlerFunctions } from "@cloudogu/deprecated-ces-theme-tailwind" ;
16
16
17
17
const MAX_SEARCH_RESULTS = 10 ;
18
18
@@ -29,15 +29,15 @@ export interface UserFormProps<T extends User> {
29
29
}
30
30
31
31
export default function UserForm < T extends User > ( props : UserFormProps < T > ) {
32
- const { handler, notification, notify } = useUserFormHandler < T > ( props . initialUser , ( values : T ) => props . onSubmit ( values , notify , handler ) ) ;
33
- const { open, setOpen : toggleModal , targetName : groupName , setTargetName : setGroupName } = useConfirmation ( ) ;
32
+ const { handler, notification, notify} = useUserFormHandler < T > ( props . initialUser , ( values : T ) => props . onSubmit ( values , notify , handler ) ) ;
33
+ const { open, setOpen : toggleModal , targetName : groupName , setTargetName : setGroupName } = useConfirmation ( ) ;
34
34
35
- const { admin } = useApplicationContext ( ) . casUser ;
35
+ const { admin} = useApplicationContext ( ) . casUser ;
36
36
37
37
const addGroup = ( groupName : string ) : void => {
38
38
if ( handler . values . memberOf . indexOf ( groupName ) < 0 ) {
39
39
const newGroups = [ ...handler . values . memberOf , groupName ] ;
40
- handler . setValues ( { ...handler . values , memberOf : newGroups } ) ;
40
+ handler . setValues ( { ...handler . values , memberOf : newGroups } ) ;
41
41
}
42
42
} ;
43
43
@@ -78,7 +78,7 @@ export default function UserForm<T extends User>(props: UserFormProps<T>) {
78
78
addLable = { t ( "users.labels.addGroup" ) + " (" + t ( "general.optional" ) + ")" }
79
79
removeLable = { t ( "users.labels.removeGroup" ) }
80
80
emptyItemsLable = { t ( "users.labels.emptyGroups" ) }
81
- removeIcon = { < TrashIcon className = { "w-6 h-6" } /> }
81
+ removeIcon = { < TrashIcon className = { "w-6 h-6" } /> }
82
82
pageSize = { pageSize }
83
83
/>
84
84
) ;
@@ -93,35 +93,42 @@ export default function UserForm<T extends User>(props: UserFormProps<T>) {
93
93
await removeGroup ( groupName ?? "" ) ;
94
94
} }
95
95
title = { t ( "users.labels.removeGroup" ) }
96
- message = { t ( "users.labels.removeGroupConfirmationMessage" , { groupName : groupName } ) }
96
+ message = { t ( "users.labels.removeGroupConfirmationMessage" , { groupName : groupName } ) }
97
97
/>
98
- < Prompt when = { handler . dirty && ! handler . isSubmitting } message = { t ( "generic.notification.form.prompt" ) } />
98
+ < Prompt when = { handler . dirty && ! handler . isSubmitting } message = { t ( "generic.notification.form.prompt" ) } />
99
99
< Form handler = { handler } >
100
100
{ notification }
101
+ < span className = { "font-bold" } >
102
+ { t ( "users.externalUserWarning" ) }
103
+ </ span >
101
104
< Form . ValidatedTextInput type = { "text" } name = { "username" } disabled = { props . disableUsernameField ?? true } data-testid = "username" placeholder = { t ( "users.placeholder.username" ) } hint = { t ( "users.hint.username" ) } >
102
105
{ t ( "editUser.labels.username" ) }
103
106
</ Form . ValidatedTextInput >
104
- < Form . ValidatedTextInput type = { "text" } name = { "givenname" } data-testid = "givenname" placeholder = { t ( "users.placeholder.givenname" ) } >
107
+ < Form . ValidatedTextInput disabled = { props . initialUser . external } type = { "text" } name = { "givenname" } data-testid = "givenname" placeholder = { t ( "users.placeholder.givenname" ) } >
105
108
{ t ( "editUser.labels.givenName" ) }
106
109
</ Form . ValidatedTextInput >
107
- < Form . ValidatedTextInput type = { "text" } name = { "surname" } data-testid = "surname" placeholder = { t ( "users.placeholder.surname" ) } >
110
+ < Form . ValidatedTextInput disabled = { props . initialUser . external } type = { "text" } name = { "surname" } data-testid = "surname" placeholder = { t ( "users.placeholder.surname" ) } >
108
111
{ t ( "editUser.labels.surname" ) }
109
112
</ Form . ValidatedTextInput >
110
- < Form . ValidatedTextInput type = { "text" } name = { "displayName" } data-testid = "displayName" placeholder = { t ( "users.placeholder.displayName" ) } hint = { t ( "users.hint.displayName" ) } >
113
+ < Form . ValidatedTextInput disabled = { props . initialUser . external } type = { "text" } name = { "displayName" } data-testid = "displayName" placeholder = { t ( "users.placeholder.displayName" ) } hint = { t ( "users.hint.displayName" ) } >
111
114
{ t ( "editUser.labels.displayName" ) }
112
115
</ Form . ValidatedTextInput >
113
- < Form . ValidatedTextInput type = { "text" } name = { "mail" } data-testid = "mail" placeholder = { t ( "users.placeholder.mail" ) } >
116
+ < Form . ValidatedTextInput disabled = { props . initialUser . external } type = { "text" } name = { "mail" } data-testid = "mail" placeholder = { t ( "users.placeholder.mail" ) } >
114
117
{ t ( "editUser.labels.email" ) }
115
118
</ Form . ValidatedTextInput >
116
- < Form . ValidatedTextInput type = { "password" } name = { "password" } data-testid = "password" placeholder = { t ( "users.placeholder.password" ) } >
117
- { t ( "editUser.labels.password" ) }
118
- </ Form . ValidatedTextInput >
119
- < Form . ValidatedTextInput type = { "password" } name = { "confirmPassword" } data-testid = "confirmPassword" placeholder = { t ( "users.placeholder.confirmPassword" ) } >
120
- { t ( "editUser.labels.confirmPassword" ) }
121
- </ Form . ValidatedTextInput >
119
+ { ! props . initialUser . external &&
120
+ < >
121
+ < Form . ValidatedTextInput disabled = { props . initialUser . external } type = { "password" } name = { "password" } data-testid = "password" placeholder = { t ( "users.placeholder.password" ) } >
122
+ { t ( "editUser.labels.password" ) }
123
+ </ Form . ValidatedTextInput >
124
+ < Form . ValidatedTextInput disabled = { props . initialUser . external } type = { "password" } name = { "confirmPassword" } data-testid = "confirmPassword" placeholder = { t ( "users.placeholder.confirmPassword" ) } >
125
+ { t ( "editUser.labels.confirmPassword" ) }
126
+ </ Form . ValidatedTextInput >
127
+ </ >
128
+ }
122
129
123
130
< >
124
- { props . passwordReset && (
131
+ { ( props . passwordReset && ! props . initialUser . external ) && (
125
132
< >
126
133
< Form . ValidatedCheckboxLabelRight name = { "pwdReset" } data-testid = "pwdReset" >
127
134
{ t ( "editUser.labels.mustChangePassword" ) }
@@ -154,33 +161,37 @@ export default function UserForm<T extends User>(props: UserFormProps<T>) {
154
161
</ div >
155
162
</ Form >
156
163
157
- { props . groupsReadonly ? (
158
- < >
159
- < H2 >
160
- { t ( "users.labels.myGroups" ) } ({ handler . values . memberOf . length } )
161
- </ H2 >
162
- { renderGroupsList ( true , 10 ) }
163
- </ >
164
- ) : (
165
- < > </ >
166
- ) }
167
- { admin ? (
168
- < >
169
- < hr />
170
- < Details className = { twMerge ( "py-2" ) } >
171
- < Details . Summary >
172
- < Details . Summary . Arrow />
173
- { t ( "users.steps.title" ) }
174
- </ Details . Summary >
175
- < Details . Content >
176
- { t ( "users.steps.text" ) }
177
- < HelpLink />
178
- </ Details . Content >
179
- </ Details >
180
- </ >
181
- ) : (
182
- < > </ >
183
- ) }
164
+ {
165
+ props . groupsReadonly ? (
166
+ < >
167
+ < H2 >
168
+ { t ( "users.labels.myGroups" ) } ({ handler . values . memberOf . length } )
169
+ </ H2 >
170
+ { renderGroupsList ( true , 10 ) }
171
+ </ >
172
+ ) : (
173
+ < > </ >
174
+ )
175
+ }
176
+ {
177
+ admin ? (
178
+ < >
179
+ < hr />
180
+ < Details className = { twMerge ( "py-2" ) } >
181
+ < Details . Summary >
182
+ < Details . Summary . Arrow />
183
+ { t ( "users.steps.title" ) }
184
+ </ Details . Summary >
185
+ < Details . Content >
186
+ { t ( "users.steps.text" ) }
187
+ < HelpLink />
188
+ </ Details . Content >
189
+ </ Details >
190
+ </ >
191
+ ) : (
192
+ < > </ >
193
+ )
194
+ }
184
195
</ >
185
196
) ;
186
197
}
0 commit comments