@@ -17,6 +17,7 @@ import {
17
17
DaycareAclRow ,
18
18
DaycareId ,
19
19
EmployeeId ,
20
+ ScheduledDaycareAclRow ,
20
21
UserRole
21
22
} from 'lib-common/generated/api-types/shared'
22
23
import {
@@ -57,7 +58,8 @@ import {
57
58
deleteUnitSupervisorMutation ,
58
59
reactivateTemporaryEmployeeMutation ,
59
60
temporaryEmployeesQuery ,
60
- unitAclQuery
61
+ unitAclQuery ,
62
+ unitScheduledAclQuery
61
63
} from '../queries'
62
64
63
65
import AddAclModal from './acl-modals/AddAclModal'
@@ -73,6 +75,17 @@ export type DaycareAclRole = Extract<
73
75
| 'EARLY_CHILDHOOD_EDUCATION_SECRETARY'
74
76
>
75
77
78
+ const roleOrder = ( role : UserRole ) =>
79
+ role === 'UNIT_SUPERVISOR'
80
+ ? 0
81
+ : role === 'SPECIAL_EDUCATION_TEACHER'
82
+ ? 1
83
+ : role === 'EARLY_CHILDHOOD_EDUCATION_SECRETARY'
84
+ ? 2
85
+ : role === 'STAFF'
86
+ ? 3
87
+ : 999 // not expected
88
+
76
89
function GroupListing ( {
77
90
unitGroups,
78
91
groupIds
@@ -238,14 +251,7 @@ function AclTable({
238
251
orderBy (
239
252
rows . filter ( ( row ) => ! row . employee . temporary ) ,
240
253
[
241
- ( row ) =>
242
- row . role === 'UNIT_SUPERVISOR'
243
- ? 0
244
- : row . role === 'SPECIAL_EDUCATION_TEACHER'
245
- ? 1
246
- : row . role === 'EARLY_CHILDHOOD_EDUCATION_SECRETARY'
247
- ? 2
248
- : 3 ,
254
+ ( row ) => roleOrder ( row . role ) ,
249
255
( row ) => row . employee . firstName ,
250
256
( row ) => row . employee . lastName
251
257
]
@@ -282,6 +288,52 @@ function AclTable({
282
288
)
283
289
}
284
290
291
+ function ScheduledAclTable ( { rows } : { rows : ScheduledDaycareAclRow [ ] } ) {
292
+ const { i18n } = useTranslation ( )
293
+
294
+ const orderedRows = useMemo (
295
+ ( ) =>
296
+ orderBy ( rows , [
297
+ ( row ) => roleOrder ( row . role ) ,
298
+ ( row ) => row . firstName ,
299
+ ( row ) => row . lastName
300
+ ] ) ,
301
+ [ rows ]
302
+ )
303
+
304
+ return (
305
+ < Table data-qa = "scheduled-acl-table" >
306
+ < Thead >
307
+ < Tr >
308
+ < Th > { i18n . unit . accessControl . role } </ Th >
309
+ < Th > { i18n . common . form . name } </ Th >
310
+ < Th > { i18n . unit . accessControl . aclStartDate } </ Th >
311
+ < Th > { i18n . unit . accessControl . aclEndDate } </ Th >
312
+ </ Tr >
313
+ </ Thead >
314
+ < Tbody >
315
+ { orderedRows . map ( ( row ) => (
316
+ < Tr key = { row . id } data-qa = { `scheduled-acl-row-${ row . id } ` } >
317
+ < Td >
318
+ < span data-qa = "role" > { i18n . roles . adRoles [ row . role ] } </ span >
319
+ </ Td >
320
+ < Td >
321
+ < FixedSpaceColumn spacing = "zero" >
322
+ < span data-qa = "name" >
323
+ { formatName ( row . firstName , row . lastName , i18n ) }
324
+ </ span >
325
+ < EmailSpan data-qa = "email" > { row . email } </ EmailSpan >
326
+ </ FixedSpaceColumn >
327
+ </ Td >
328
+ < Td > { row . startDate . format ( ) } </ Td >
329
+ < Td > { row . endDate ?. format ( ) } </ Td >
330
+ </ Tr >
331
+ ) ) }
332
+ </ Tbody >
333
+ </ Table >
334
+ )
335
+ }
336
+
285
337
function TemporaryEmployeesTable ( {
286
338
unitId,
287
339
unitGroups,
@@ -490,6 +542,9 @@ export default React.memo(function UnitAccessControl({
490
542
491
543
const employees = useQueryResult ( getEmployeesQuery ( ) )
492
544
const daycareAclRows = useQueryResult ( unitAclQuery ( { unitId } ) )
545
+ const scheduledDaycareAclRows = useQueryResult (
546
+ unitScheduledAclQuery ( { unitId } )
547
+ )
493
548
const temporaryEmployees = useQueryResult (
494
549
permittedActions . includes ( 'READ_TEMPORARY_EMPLOYEE' )
495
550
? temporaryEmployeesQuery ( { unitId } )
@@ -627,6 +682,11 @@ export default React.memo(function UnitAccessControl({
627
682
628
683
< Gap size = "XL" />
629
684
685
+ < H3 noMargin > { i18n . unit . accessControl . scheduledAclRoles } </ H3 >
686
+ { renderResult ( scheduledDaycareAclRows , ( scheduledDaycareAclRows ) => (
687
+ < ScheduledAclTable rows = { scheduledDaycareAclRows } />
688
+ ) ) }
689
+
630
690
< FixedSpaceRow justifyContent = "space-between" alignItems = "center" >
631
691
< H3 noMargin > { i18n . unit . accessControl . temporaryEmployees . title } </ H3 >
632
692
{ permittedActions . includes ( 'CREATE_TEMPORARY_EMPLOYEE' ) && (
0 commit comments