Page Menu
Home
c4science
Search
Configure Global Search
Log In
Files
F65819587
ResultCard.js
No One
Temporary
Actions
Download File
Edit File
Delete File
View Transforms
Subscribe
Mute Notifications
Award Token
Subscribers
None
File Metadata
Details
File Info
Storage
Attached
Created
Thu, Jun 6, 10:55
Size
2 KB
Mime Type
text/x-java
Expires
Sat, Jun 8, 10:55 (2 d)
Engine
blob
Format
Raw Data
Handle
18132167
Attached To
rOACCT Open Access Compliance Check Tool (OACCT)
ResultCard.js
View Options
import
React
from
"react"
import
{
makeStyles
}
from
'@material-ui/core/styles'
;
import
TermCard
from
"../components/TermCard"
import
Accordion
from
'@material-ui/core/Accordion'
;
import
AccordionSummary
from
'@material-ui/core/AccordionSummary'
;
import
AccordionDetails
from
'@material-ui/core/AccordionDetails'
;
import
Typography
from
'@material-ui/core/Typography'
;
import
ExpandMoreIcon
from
'@material-ui/icons/ExpandMore'
;
import
Badge
from
'@material-ui/core/Badge'
;
import
DescriptionIcon
from
'@material-ui/icons/Description'
import
{
HiOutlineDocumentDuplicate
}
from
"react-icons/hi"
;
import
{
HiOutlineDocument
}
from
"react-icons/hi"
;
const
useStyles
=
makeStyles
((
theme
)
=>
({
card
:
{
width
:
'100%'
,
marginTop
:
"1rem"
,
},
root
:
{
flexGrow
:
1
,
},
chip
:
{
margin
:
0.5
,
},
heading
:
{
fontSize
:
theme
.
typography
.
pxToRem
(
15
),
fontWeight
:
theme
.
typography
.
fontWeightRegular
,
},
}))
function
ResultCard
({
result
})
{
const
classes
=
useStyles
();
//create one array to organize the frontend output
const
termresult
=
[]
const
termArray
=
result
?
.
map
(
i
=>
(
// get condition details
i
.
term
?
.
map
(
j
=>
(
// termresult.push([j, i.id, i.comment, i.condition_type])
termresult
.
push
([
j
,
[
i
.
id
,
i
.
comment
,
i
.
condition_type
]])
))
))
//groupyBy array
function
groupBy
(
objectArray
,
property
)
{
// console.log(objectArray)
return
objectArray
.
reduce
((
acc
,
obj
)
=>
{
// console.log(obj[0])
const
key
=
obj
[
0
][
property
][
0
].
description
;
if
(
!
acc
[
key
])
{
acc
[
key
]
=
[];
}
// Add object to list for given key's value
acc
[
key
].
push
(
obj
);
return
acc
;
},
{});
}
const
groupedTerm
=
groupBy
(
termresult
,
'version'
)
//first version
// console.log(groupedTerm[1])
//convert object into array
const
termItem
=
Object
.
entries
(
groupedTerm
);
console
.
log
(
termItem
)
const
displayVersion
=
termItem
?
.
map
(
item
=>
(
<
div
>
<
Accordion
>
<
AccordionSummary
expandIcon
=
{
<
ExpandMoreIcon
/>
}
aria
-
controls
=
"panel1a-content"
id
=
"panel1a-header"
>
<
Typography
className
=
{
classes
.
heading
}
><
/Typography>
{
item
?
.
map
(
i
=>
(
<
Badge
anchorOrigin
=
{{
vertical
:
'top'
,
horizontal
:
'right'
,
}}
style
=
{{
padding
:
"1px"
,
color
:
"black"
,
}}
badgeContent
=
{
typeof
i
===
"object"
&&
i
.
length
}
>
{
typeof
i
===
"string"
&&
i
}
{
typeof
i
===
"object"
&&
i
.
length
>
1
?
<
HiOutlineDocumentDuplicate
/>:
typeof
i
===
"object"
&&
<
HiOutlineDocument
/>
}
<
/Badge>
))
}
<
/AccordionSummary>
{
item
?
.
map
(
j
=>
(
<
AccordionDetails
>
<
Typography
>
{
typeof
j
===
"object"
&&
<
TermCard
term
=
{
j
}
/>
}
<
/Typography>
<
/AccordionDetails>
))
}
<
/Accordion>
<
/div>
))
return
(
//level 0
<
div
key
=
{
result
.
id
}
>
{
displayVersion
}
<
/div>
)
}
export
default
ResultCard
Event Timeline
Log In to Comment