@@ -14,13 +14,19 @@ export const UpdateTeam = gql`
1414 $cohort: String
1515 $TTL: String
1616 $orgToken: String
17+ $manager: String
18+ $phase: String
19+ $program: String
1720 ) {
1821 updateTeam(
1922 id: $updateTeamId
2023 orgToken: $orgToken
2124 name: $name
2225 cohort: $cohort
2326 TTL: $TTL
27+ manager: $manager
28+ phase: $phase
29+ program: $program
2430 ) {
2531 name
2632 }
@@ -37,6 +43,8 @@ export default function UpdateTeamModal({
3743 data ?: {
3844 getAllTeams : Team [ ] ;
3945 getAllCohorts : Cohort [ ] ;
46+ getAllPrograms ?: any [ ] ;
47+ getAllPhases ?: any [ ] ;
4048 getAllUsers : any ;
4149 } ;
4250 updateTeamModal : boolean ;
@@ -47,7 +55,6 @@ export default function UpdateTeamModal({
4755 const { t } = useTranslation ( ) ;
4856 const {
4957 handleSubmit,
50- watch,
5158 formState : { errors } ,
5259 reset,
5360 register,
@@ -69,10 +76,16 @@ export default function UpdateTeamModal({
6976 async function updateTeam ( data : any ) {
7077 const newData : any = { ...data } ;
7178
79+ // Process the select fields
80+ newData . manager && ( newData . manager = newData . manager . value ) ;
81+ newData . program && ( newData . program = newData . program . value ) ;
82+ newData . phase && ( newData . phase = newData . phase . value ) ;
83+
7284 newData . coordinatorEmail &&
7385 ( newData . coordinatorEmail = newData . coordinatorEmail . value ) ;
7486 newData . programName && ( newData . programName = newData . programName . value ) ;
7587
88+ // Clean up empty fields
7689 Object . keys ( newData ) . forEach ( ( field ) => {
7790 if ( ! newData [ field ] || newData [ field ] === '' ) {
7891 delete newData [ field ] ;
@@ -86,8 +99,9 @@ export default function UpdateTeamModal({
8699
87100 await updateTeamMutation ( { variables : newData } ) ;
88101 }
89-
102+ console . log ( 'data' , data )
90103 useEffect ( ( ) => {
104+ // Set form values when the modal opens
91105 setValue ( 'name' , currentTeam ?. name ) ;
92106 setValue ( 'TTL' , {
93107 value : currentTeam ?. ttl ?. email ,
@@ -97,6 +111,18 @@ export default function UpdateTeamModal({
97111 value : currentTeam ?. cohort ?. name ,
98112 label : currentTeam ?. cohort ?. name || 'no cohort assigned' ,
99113 } ) ;
114+ setValue ( 'manager' , {
115+ value : currentTeam ?. manager ?. email ,
116+ label : currentTeam ?. manager ?. email || 'no manager assigned' ,
117+ } ) ;
118+ setValue ( 'phase' , {
119+ value : currentTeam ?. phase ?. name ,
120+ label : currentTeam ?. phase ?. name || 'no phase assigned' ,
121+ } ) ;
122+ setValue ( 'program' , {
123+ value : currentTeam ?. program ?. name ,
124+ label : currentTeam ?. program ?. name || 'no program assigned' ,
125+ } ) ;
100126 } , [ currentTeam , updateTeamModal ] ) ;
101127
102128 return (
@@ -111,54 +137,52 @@ export default function UpdateTeamModal({
111137 < h3 className = "w-11/12 text-sm font-bold text-center uppercase dark:text-white" >
112138 { t ( 'Update Team' ) }
113139 </ h3 >
114- < hr className = "w-full my-3 border-b bg-primary" />
140+ < hr className = "w-full my-3 border-b bg-primary" />
115141 </ div >
116142 < div className = "card-body" >
117143 < form className = "px-8 py-3 " >
118- < div className = "my-5 input h-9 " >
119- < div className = "flex items-center w-full h-full rounded-md grouped-input" >
120- < input
121- type = "text"
122- className = "w-full px-5 py-2 font-sans text-xs border rounded outline-none border-primary dark:bg-dark-frame-bg dark:text-white"
123- placeholder = { t ( 'name' ) }
124- { ...register ( 'name' ) }
125- />
126- </ div >
144+ { /* Team Name */ }
145+ < div className = "my-5 input h-9" >
146+ < input
147+ type = "text"
148+ className = "w-full px-5 py-2 font-sans text-xs border rounded outline-none border-primary dark:bg-dark-frame-bg dark:text-white"
149+ placeholder = { t ( 'name' ) }
150+ { ...register ( 'name' ) }
151+ />
127152 { errors ?. name && (
128153 < p className = "font-thin text-[12px] text-red-300" >
129154 { errors ?. name ?. message ?. toString ( ) }
130155 </ p >
131156 ) }
132157 </ div >
158+
159+ { /* TTL Email */ }
133160 < div className = "my-5 input h-9" >
134- < div className = "flex items-center w-full h-full rounded-md grouped-input" >
135- < ControlledSelect
136- placeholder = { t ( 'email' ) }
137- register = { {
138- control,
139- name : 'TTL' ,
140- rules : {
141- required : `${ t ( 'The ttl email is required' ) } ` ,
142- } ,
143- } }
144- options = {
145- data ?. getAllUsers
146- ?. filter ( ( user : any ) => user . role === 'ttl' )
147- ?. map ( ( user : any ) => ( {
148- value : user . email ,
149- label : user . email ,
150- } ) ) ?? [ ]
151- }
152- />
153- </ div >
154- { errors ?. ttlEmail && (
161+ < ControlledSelect
162+ placeholder = { t ( 'email' ) }
163+ register = { {
164+ control,
165+ name : 'TTL' ,
166+ rules : { required : `${ t ( 'The ttl email is required' ) } ` } ,
167+ } }
168+ options = {
169+ data ?. getAllUsers
170+ ?. filter ( ( user : any ) => user . role === 'ttl' )
171+ ?. map ( ( user : any ) => ( {
172+ value : user . email ,
173+ label : user . email ,
174+ } ) ) ?? [ ]
175+ }
176+ />
177+ { errors ?. TTL && (
155178 < p className = "font-thin text-[12px] text-red-300" >
156- { errors ?. ttlEmail ?. message ?. toString ( ) }
179+ { errors ?. TTL ?. message ?. toString ( ) }
157180 </ p >
158181 ) }
159182 </ div >
160183
161- < div className = "my-5 input h-9 " >
184+ { /* Cohort */ }
185+ < div className = "my-5 input h-9" >
162186 < ControlledSelect
163187 placeholder = { t ( 'Choose a Cohort' ) }
164188 register = { {
@@ -171,9 +195,82 @@ export default function UpdateTeamModal({
171195 label : name ,
172196 } ) ) }
173197 />
174- { errors ?. programName && (
198+ { errors ?. cohort && (
199+ < p className = "font-thin text-[12px] text-red-300" >
200+ { errors ?. cohort ?. message ?. toString ( ) }
201+ </ p >
202+ ) }
203+ </ div >
204+
205+ { /* Manager */ }
206+ < div className = "my-5 input h-9" >
207+ < ControlledSelect
208+ placeholder = { t ( 'Manager' ) }
209+ register = { {
210+ control,
211+ name : 'manager' ,
212+ rules : { required : `${ t ( 'Manager is required' ) } ` } ,
213+ } }
214+ options = {
215+ data ?. getAllUsers
216+ ?. filter ( ( user : any ) => user . role === 'manager' )
217+ ?. map ( ( user : any ) => ( {
218+ value : user . email ,
219+ label : user . email ,
220+ } ) ) ?? [ ]
221+ }
222+ />
223+ { errors ?. manager && (
224+ < p className = "font-thin text-[12px] text-red-300" >
225+ { errors ?. manager ?. message ?. toString ( ) }
226+ </ p >
227+ ) }
228+ </ div >
229+
230+ { /* Phase */ }
231+ { /* <div className="my-5 input h-9">
232+ <input
233+ type="text"
234+ className="w-full px-5 py-2 font-sans text-xs border rounded outline-none border-primary dark:bg-dark-frame-bg dark:text-white"
235+ placeholder={t('Phase')}
236+ {...register('phase', { required: `${t('Phase is required')}` }) }
237+ />
238+ {errors?.phase && (
239+ <p className="font-thin text-[12px] text-red-300">
240+ {errors?.phase?.message?.toString()}
241+ </p>
242+ )}
243+ </div> */ }
244+ < ControlledSelect
245+ placeholder = { t ( 'Phases' ) }
246+ register = { {
247+ control,
248+ name : 'phase' , // Ensure this matches your backend mutation variable
249+ rules : { required : `${ t ( 'Phase is required' ) } ` } ,
250+ } }
251+ options = { data ?. getAllPhases ?. map ( ( { id, name } ) => ( {
252+ value : id ,
253+ label : name ,
254+ } ) ) }
255+ />
256+
257+ { /* Program */ }
258+ < div className = "my-5 input h-9" >
259+ < ControlledSelect
260+ placeholder = { t ( 'Program' ) }
261+ register = { {
262+ control,
263+ name : 'program' ,
264+ rules : { required : `${ t ( 'Program is required' ) } ` } ,
265+ } }
266+ options = { data ?. getAllPrograms ?. map ( ( { name } ) => ( {
267+ value : name ,
268+ label : name ,
269+ } ) ) }
270+ />
271+ { errors ?. program && (
175272 < p className = "font-thin text-[12px] text-red-300" >
176- { errors ?. programName ?. message ?. toString ( ) }
273+ { errors ?. program ?. message ?. toString ( ) }
177274 </ p >
178275 ) }
179276 </ div >
@@ -190,18 +287,17 @@ export default function UpdateTeamModal({
190287 } }
191288 disabled = { loading }
192289 >
193- { ' ' }
194290 { t ( 'Cancel' ) }
195291 </ Button >
196292 < Button
197293 variant = "primary"
198294 size = "sm"
199- style = "w-[30%] md:w-1/4 text-sm font-sans p-0"
295+ style = "w-[30%] md:w-1/4 text-sm font-sans"
296+ data-testid = "updateTeam"
200297 onClick = { handleSubmit ( updateTeam ) }
201298 loading = { loading }
202- data-testid = "confirmUpdateBtn"
299+ disabled = { loading }
203300 >
204- { ' ' }
205301 { t ( 'Save' ) }
206302 </ Button >
207303 </ div >
0 commit comments