1
- import { KanbanTemplate } from "@maykin-ui/admin-ui" ;
1
+ import { AttributeData , FieldSet , KanbanTemplate } from "@maykin-ui/admin-ui" ;
2
2
import { useLoaderData } from "react-router-dom" ;
3
3
4
4
import { KanbanCard } from "../../components/KanbanCard/KanbanCard" ;
5
5
import {
6
6
DestructionList ,
7
7
listDestructionLists ,
8
8
} from "../../lib/api/destructionLists" ;
9
- import { deslugify , timeAgo } from "../../lib/string" ;
9
+ import { timeAgo } from "../../lib/string" ;
10
10
import "./Landing.css" ;
11
11
12
12
const STATUS_LABELS : { [ key : string ] : string } = {
@@ -15,70 +15,79 @@ const STATUS_LABELS: { [key: string]: string } = {
15
15
completed : "Completed" ,
16
16
} ;
17
17
18
- const STATUSES = [ "pending" , "in_progress" , "completed" ] ;
18
+ const STATUSES : FieldSet [ ] = [
19
+ [
20
+ STATUS_LABELS . pending ,
21
+ {
22
+ fields : [ ] ,
23
+ component : KanbanCard ,
24
+ } ,
25
+ ] ,
26
+ [
27
+ STATUS_LABELS . in_progress ,
28
+ {
29
+ fields : [ ] ,
30
+ component : KanbanCard ,
31
+ } ,
32
+ ] ,
33
+ [
34
+ STATUS_LABELS . completed ,
35
+ {
36
+ fields : [ ] ,
37
+ component : KanbanCard ,
38
+ } ,
39
+ ] ,
40
+ ] ;
19
41
20
42
interface LandingLoaderReturn {
21
43
[ key : string ] : DestructionList [ ] ;
22
44
}
23
45
24
46
export const landingLoader = async ( ) : Promise < LandingLoaderReturn > => {
25
47
const lists = await listDestructionLists ( ) ;
26
- const statusMap : LandingLoaderReturn = { } ;
27
48
28
49
// Initialize statusMap with empty arrays for each status
29
- STATUSES . forEach ( ( status ) => {
30
- statusMap [ status ] = [ ] ;
31
- } ) ;
32
-
33
- lists . forEach ( ( list ) => {
34
- if ( ! statusMap [ list . status ] ) {
35
- statusMap [ list . status ] = [ ] ;
36
- }
37
- statusMap [ list . status ] . push ( list ) ;
38
- } ) ;
50
+ const statusMap = STATUSES . reduce ( ( acc , val ) => {
51
+ const status = val [ 0 ] || "" ;
52
+ const destructionLists = lists . filter (
53
+ ( l ) => STATUS_LABELS [ l . status ] === status ,
54
+ ) ;
55
+ return { ...acc , [ status ] : destructionLists } ;
56
+ } , { } ) ;
39
57
40
58
return statusMap ;
41
59
} ;
42
60
43
61
export const Landing = ( ) => {
44
62
const lists = useLoaderData ( ) as LandingLoaderReturn ;
45
63
46
- const constructComponentList = ( lists : DestructionList [ ] ) => {
47
- const constructAssigneeNames = (
48
- assignees : DestructionList [ "assignees" ] ,
49
- ) => {
50
- const sortedAssignees = assignees . sort ( ( a , b ) => a . order - b . order ) ;
51
- const getName = ( assignee : DestructionList [ "assignees" ] [ 0 ] [ "user" ] ) =>
52
- // If there's a first and last name, return the full name otherwise we return the username
53
- assignee . firstName && assignee . lastName
54
- ? `${ assignee . firstName } ${ assignee . lastName } (${ assignee . role . name } )`
55
- : `${ assignee . username } (${ assignee . role . name } )` ;
56
- return sortedAssignees . map ( ( assignee ) => getName ( assignee . user ) ) ;
57
- } ;
58
-
59
- return lists . map ( ( list ) => ( {
60
- id : list . name ,
61
- content : (
62
- < KanbanCard
63
- title = { list . name }
64
- days = { timeAgo ( list . created ) }
65
- assigneeNames = { constructAssigneeNames ( list . assignees ) }
66
- href = { `/destruction-list/${ list . name } ` }
67
- key = { list . name }
68
- />
69
- ) ,
70
- } ) ) ;
64
+ const constructAssigneeNames = ( assignees : DestructionList [ "assignees" ] ) => {
65
+ const sortedAssignees = assignees . sort ( ( a , b ) => a . order - b . order ) ;
66
+ const getName = ( assignee : DestructionList [ "assignees" ] [ 0 ] [ "user" ] ) =>
67
+ // If there's a first and last name, return the full name otherwise we return the username
68
+ assignee . firstName && assignee . lastName
69
+ ? `${ assignee . firstName } ${ assignee . lastName } (${ assignee . role . name } )`
70
+ : `${ assignee . username } (${ assignee . role . name } )` ;
71
+ return sortedAssignees . map ( ( assignee ) => getName ( assignee . user ) ) ;
71
72
} ;
72
73
74
+ const objectLists = Object . values ( lists ) . map ( ( lists ) =>
75
+ lists . map ( ( list ) => ( {
76
+ key : list . name ,
77
+ title : list . name ,
78
+ days : timeAgo ( list . created ) ,
79
+ assigneeNames : constructAssigneeNames ( list . assignees ) ,
80
+ href : `/destruction-list/${ list . name } ` ,
81
+ } ) ) ,
82
+ ) as unknown as AttributeData [ ] [ ] ;
83
+
73
84
return (
74
85
< KanbanTemplate
75
86
kanbanProps = { {
87
+ draggable : false ,
76
88
title : "Landing Page" ,
77
- componentList : STATUSES . map ( ( status ) => ( {
78
- title : STATUS_LABELS [ status ] || deslugify ( status ) ,
79
- id : status ,
80
- items : constructComponentList ( lists [ status ] || [ ] ) ,
81
- } ) ) ,
89
+ fieldsets : STATUSES ,
90
+ objectLists : objectLists ,
82
91
} }
83
92
/>
84
93
) ;
0 commit comments