Skip to content
GitLab
Explore
Sign in
Primary navigation
Search or go to…
Project
X
xpub-epmc
Manage
Activity
Members
Labels
Plan
Wiki
Code
Merge requests
0
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Locked files
Deploy
Releases
Package Registry
Container Registry
Operate
Terraform modules
Analyze
Value stream analytics
Contributor analytics
Repository analytics
Code review analytics
Insights
Help
Help
Support
GitLab documentation
Compare GitLab plans
Community forum
Contribute to GitLab
Provide feedback
Terms and privacy
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
Literature-services
public-projects
xpub-epmc
Commits
ce406574
Commit
ce406574
authored
3 years ago
by
Audrey Hamelers
Browse files
Options
Downloads
Patches
Plain Diff
#1208
parent
35ce8a02
No related branches found
No related tags found
1 merge request
!387
Deploy to production
Changes
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
app/components/dashboard/MyManuscripts.jsx
+252
-211
252 additions, 211 deletions
app/components/dashboard/MyManuscripts.jsx
with
252 additions
and
211 deletions
app/components/dashboard/MyManuscripts.jsx
+
252
−
211
View file @
ce406574
...
@@ -19,6 +19,11 @@ const H2 = styled(HTwo)`
...
@@ -19,6 +19,11 @@ const H2 = styled(HTwo)`
font-size:
${
th
(
'
fontSizeHeading4
'
)}
;
font-size:
${
th
(
'
fontSizeHeading4
'
)}
;
line-height:
${
th
(
'
lineHeightHeading4
'
)}
;
line-height:
${
th
(
'
lineHeightHeading4
'
)}
;
`
`
const
H3
=
styled
(
HTwo
)
`
font-size:
${
th
(
'
fontSizeHeading3
'
)}
;
line-height:
${
th
(
'
lineHeightHeading3
'
)}
;
margin-top: 0;
`
const
ToggleBar
=
styled
(
Toggle
)
`
const
ToggleBar
=
styled
(
Toggle
)
`
float: left;
float: left;
@media screen and (max-width: 880px) {
@media screen and (max-width: 880px) {
...
@@ -30,229 +35,265 @@ const PaginationPane = styled.div`
...
@@ -30,229 +35,265 @@ const PaginationPane = styled.div`
justify-content: flex-end;
justify-content: flex-end;
`
`
const
MyManuscripts
=
({
currentUser
,
errors
,
history
})
=>
{
const
MyManuscripts
=
({
currentUser
,
errors
,
history
})
=>
(
const
onPageEntered
=
p
=>
{
<
Query
fetchPolicy
=
"cache-and-network"
query
=
{
COUNT_MANUSCRIPTS
}
>
history
.
push
(
`/dashboard?completed=true&page=
${
p
}
`
)
{
({
data
,
loading
})
=>
{
}
if
(
loading
)
{
return
(
return
(
<
Query
fetchPolicy
=
"cache-and-network"
query
=
{
COUNT_MANUSCRIPTS
}
>
<
Loading
>
{
({
data
,
loading
})
=>
{
<
LoadingIcon
/>
if
(
loading
)
{
</
Loading
>
return
(
)
<
Loading
>
}
<
LoadingIcon
/>
if
(
!
data
)
{
</
Loading
>
createBrowserHistory
({
forceRefresh
:
true
}).
push
(
'
/login
'
)
)
return
null
}
}
if
(
!
data
)
{
// get the total number of manuscripts to decide whether the toggles are required
createBrowserHistory
({
forceRefresh
:
true
}).
push
(
'
/login
'
)
const
{
countByStatus
}
=
data
return
null
const
done
=
states
.
indexOf
(
'
xml-complete
'
)
}
const
highlight
=
[
// get the total number of manuscripts to decide whether the toggles are required
'
INITIAL
'
,
const
{
countByStatus
}
=
data
'
READY
'
,
const
done
=
states
.
indexOf
(
'
xml-complete
'
)
'
submission-error
'
,
const
totalCount
=
countByStatus
.
reduce
(
'
in-review
'
,
(
sum
,
status
)
=>
sum
+
parseInt
(
status
.
count
,
10
),
'
xml-review
'
,
0
,
]
const
totalCount
=
countByStatus
.
reduce
(
(
sum
,
status
)
=>
sum
+
parseInt
(
status
.
count
,
10
),
0
,
)
const
totalAttention
=
countByStatus
.
filter
(
s
=>
highlight
.
includes
(
s
.
type
))
.
reduce
((
sum
,
status
)
=>
sum
+
parseInt
(
status
.
count
,
10
),
0
)
const
totalComplete
=
countByStatus
.
filter
(
s
=>
states
.
slice
(
done
).
includes
(
s
.
type
))
.
reduce
((
sum
,
status
)
=>
sum
+
parseInt
(
status
.
count
,
10
),
0
)
const
totalProcess
=
countByStatus
.
filter
(
s
=>
states
.
slice
(
done
)
.
filter
(
s
=>
!
highlight
.
includes
(
s
))
.
includes
(
s
.
type
),
)
)
const
totalComplete
=
countByStatus
.
reduce
((
sum
,
status
)
=>
sum
+
parseInt
(
status
.
count
,
10
),
0
)
.
filter
(
s
=>
states
.
slice
(
done
).
includes
(
s
.
type
))
const
params
=
new
URLSearchParams
(
history
.
location
.
search
)
.
reduce
((
sum
,
status
)
=>
sum
+
parseInt
(
status
.
count
,
10
),
0
)
const
togglesRequired
=
totalCount
>
pageSize
const
togglesRequired
=
totalCount
>
pageSize
&&
totalComplete
>
0
const
query
=
togglesRequired
?
MANUSCRIPTS_BY_STATUS
:
USER_MANUSCRIPTS
// determine the query and variables used to get manuscripts
const
showStates
=
params
.
get
(
'
status
'
)
const
query
=
togglesRequired
?
MANUSCRIPTS_BY_STATUS
:
USER_MANUSCRIPTS
const
variables
=
{}
const
params
=
new
URLSearchParams
(
history
.
location
.
search
)
if
(
togglesRequired
)
{
// togglesRequired and on the completed toggle
variables
.
page
=
params
.
get
(
'
page
'
)
?
params
.
get
(
'
page
'
)
-
1
:
0
const
completed
=
params
.
get
(
'
completed
'
)
variables
.
pageSize
=
pageSize
variables
.
query
=
(
showStates
===
'
completed
'
&&
states
.
slice
(
done
).
join
(
'
,
'
))
||
(
showStates
===
'
processing
'
&&
states
.
slice
(
done
)
.
filter
(
s
=>
!
highlight
.
includes
(
s
))
.
join
(
'
,
'
))
||
highlight
.
join
(
'
,
'
)
}
const
searchTitle
=
(
showStates
===
'
completed
'
&&
'
Submission complete
'
)
||
(
showStates
===
'
processing
'
&&
'
In process at Europe PMC
'
)
||
'
Needs attention
'
const
onPageEntered
=
p
=>
{
history
.
push
(
`/dashboard?page=
${
p
}${
showStates
?
`&status=
${
showStates
}
`
:
''
}
`
,
)
}
return
(
<
Query
fetchPolicy
=
"cache-and-network"
query
=
{
query
}
variables
=
{
variables
}
>
{
({
data
,
loading
,
errors
:
dErrors
})
=>
{
if
(
loading
)
{
return
(
<
Loading
>
<
LoadingIcon
/>
</
Loading
>
)
}
if
(
dErrors
)
{
return
dErrors
.
map
(
e
=>
(
<
Notification
type
=
"error"
>
{
e
.
message
}
</
Notification
>
))
}
const
manuscripts
=
togglesRequired
?
data
.
findByStatus
.
manuscripts
:
data
.
manuscripts
const
total
=
togglesRequired
?
data
.
findByStatus
.
total
:
data
.
manuscripts
.
length
const
variables
=
{}
const
toggles
=
togglesRequired
&&
(
if
(
togglesRequired
)
{
<
React
.
Fragment
>
if
(
completed
)
{
<
ToggleBar
>
variables
.
query
=
states
.
slice
(
done
).
join
(
'
,
'
)
<
Link
variables
.
page
=
params
.
get
(
'
page
'
)
?
params
.
get
(
'
page
'
)
-
1
:
0
className
=
{
!
showStates
?
'
current
'
:
''
}
variables
.
pageSize
=
pageSize
to
=
"/dashboard"
}
else
{
>
variables
.
query
=
states
.
slice
(
0
,
done
).
join
(
'
,
'
)
Attention
{
showStates
&&
`(
${
totalAttention
}
)`
}
variables
.
page
=
-
1
</
Link
>
}
<
Link
}
className
=
{
showStates
===
'
processing
'
?
'
current
'
:
''
}
return
(
to
=
"/dashboard?status=processing"
<
Query
>
fetchPolicy
=
"cache-and-network"
In process
{
'
'
}
query
=
{
query
}
{
showStates
!==
'
processing
'
&&
`(
${
totalProcess
}
)`
}
variables
=
{
variables
}
</
Link
>
>
<
Link
{
({
data
,
loading
,
errors
:
dErrors
})
=>
{
className
=
{
if
(
loading
)
{
showStates
===
'
completed
'
?
`current (
${
total
}
)`
:
''
return
(
}
<
Loading
>
to
=
"/dashboard?status=completed"
<
LoadingIcon
/>
>
</
Loading
>
Completed
{
'
'
}
)
{
showStates
!==
'
completed
'
&&
`(
${
totalComplete
}
)`
}
}
</
Link
>
if
(
dErrors
)
{
</
ToggleBar
>
return
dErrors
.
map
(
e
=>
(
<
SearchBoxes
reviewer
/>
<
Notification
type
=
"error"
>
{
e
.
message
}
</
Notification
>
</
React
.
Fragment
>
))
)
}
const
manuscripts
=
togglesRequired
if
(
togglesRequired
)
{
?
data
.
findByStatus
.
manuscripts
const
currentPage
=
params
.
get
(
'
page
'
)
:
data
.
manuscripts
?
parseInt
(
params
.
get
(
'
page
'
),
10
)
const
total
=
togglesRequired
:
1
?
data
.
findByStatus
.
total
:
data
.
manuscripts
.
length
const
toggles
=
togglesRequired
&&
(
const
PageNavigation
=
()
=>
(
<
Pagination
currentPage
=
{
currentPage
}
onPageEntered
=
{
onPageEntered
}
pageSize
=
{
pageSize
}
totalSize
=
{
total
}
/>
)
return
(
<
React
.
Fragment
>
<
React
.
Fragment
>
<
ToggleBar
>
{
toggles
}
<
Link
<
PaginationPane
className
=
{
!
completed
?
'
current
'
:
''
}
style
=
{
{
to
=
"/dashboard"
justifyContent
:
'
space-between
'
,
>
alignItems
:
'
baseline
'
,
In process
}
}
</
Link
>
>
<
Link
<
H3
>
className
=
{
completed
?
`current (
${
total
}
)`
:
''
}
{
searchTitle
}
(
{
total
}
)
to
=
"/dashboard?completed=true"
</
H3
>
>
{
total
>
0
&&
<
PageNavigation
/>
}
Completed
</
PaginationPane
>
</
Link
>
<
DashboardList
</
ToggleBar
>
currentUser
=
{
currentUser
}
<
SearchBoxes
reviewer
/>
listData
=
{
manuscripts
}
/>
{
total
>
0
&&
(
<
PaginationPane
>
<
PageNavigation
/>
</
PaginationPane
>
)
}
</
React
.
Fragment
>
</
React
.
Fragment
>
)
)
}
if
(
completed
)
{
const
attention
=
[]
const
currentPage
=
params
.
get
(
'
page
'
)
const
warning
=
[]
?
parseInt
(
params
.
get
(
'
page
'
),
10
)
const
processing
=
[]
:
1
const
complete
=
[]
manuscripts
.
forEach
(
m
=>
{
const
PageNavigation
=
()
=>
(
const
reviewer
=
m
.
teams
.
find
(
t
=>
t
.
role
===
'
reviewer
'
)
<
PaginationPane
>
const
submitter
=
m
.
teams
.
find
(
t
=>
t
.
role
===
'
submitter
'
)
<
Pagination
if
(
highlight
.
includes
(
m
.
status
))
{
currentPage
=
{
currentPage
}
if
(
onPageEntered
=
{
onPageEntered
}
reviewer
&&
pageSize
=
{
pageSize
}
reviewer
.
teamMembers
[
0
].
user
.
id
===
currentUser
.
id
&&
totalSize
=
{
total
}
highlight
.
slice
(
-
2
).
includes
(
m
.
status
)
)
{
attention
.
push
(
m
)
}
else
if
(
submitter
.
teamMembers
[
0
].
user
.
id
===
currentUser
.
id
&&
highlight
.
slice
(
0
,
3
).
includes
(
m
.
status
)
)
{
attention
.
push
(
m
)
}
else
{
warning
.
push
(
m
)
}
}
else
if
(
!
togglesRequired
&&
states
.
slice
(
done
).
includes
(
m
.
status
)
)
{
complete
.
push
(
m
)
}
else
{
processing
.
push
(
m
)
}
})
return
(
<
React
.
Fragment
>
{
toggles
}
{
manuscripts
.
length
===
0
&&
(
<
Notification
type
=
"info"
>
There are currently no manuscripts connected to this
account.
</
Notification
>
)
}
{
errors
.
map
(
e
=>
(
<
Notification
key
=
"message"
type
=
{
e
.
type
?
e
.
type
:
'
warning
'
}
>
{
e
.
message
}
</
Notification
>
))
}
{
attention
.
length
>
0
&&
(
<
React
.
Fragment
>
<
H2
>
Needs my attention (
{
attention
.
length
}
)
</
H2
>
<
DashboardList
currentUser
=
{
currentUser
}
listData
=
{
attention
}
sectionColor
=
"error"
/>
/>
</
PaginationPane
>
</
React
.
Fragment
>
)
)
}
return
(
{
warning
.
length
>
0
&&
(
<
React
.
Fragment
>
<
React
.
Fragment
>
{
toggles
}
<
H2
>
{
total
&&
<
PageNavigation
/>
}
Waiting for action by another user (
{
warning
.
length
}
)
</
H2
>
<
DashboardList
<
DashboardList
currentUser
=
{
currentUser
}
currentUser
=
{
currentUser
}
listData
=
{
manuscripts
}
listData
=
{
warning
}
sectionColor
=
"warning"
/>
/>
{
total
&&
<
PageNavigation
/>
}
</
React
.
Fragment
>
</
React
.
Fragment
>
)
)
}
}
{
processing
.
length
>
0
&&
(
<
React
.
Fragment
>
const
attention
=
[]
<
H2
>
In process at Europe PMC (
{
processing
.
length
}
)
</
H2
>
const
warning
=
[]
<
DashboardList
const
processing
=
[]
currentUser
=
{
currentUser
}
const
complete
=
[]
listData
=
{
processing
}
const
highlight
=
[
/>
'
INITIAL
'
,
</
React
.
Fragment
>
'
READY
'
,
)
}
'
submission-error
'
,
{
complete
.
length
>
0
&&
(
'
in-review
'
,
<
React
.
Fragment
>
'
xml-review
'
,
<
H2
>
Submission complete (
{
complete
.
length
}
)
</
H2
>
]
<
DashboardList
manuscripts
.
forEach
(
m
=>
{
currentUser
=
{
currentUser
}
const
reviewer
=
m
.
teams
.
find
(
t
=>
t
.
role
===
'
reviewer
'
)
listData
=
{
complete
}
const
submitter
=
m
.
teams
.
find
(
t
=>
t
.
role
===
'
submitter
'
)
/>
if
(
highlight
.
includes
(
m
.
status
))
{
</
React
.
Fragment
>
if
(
)
}
reviewer
&&
</
React
.
Fragment
>
reviewer
.
teamMembers
[
0
].
user
.
id
===
currentUser
.
id
&&
)
highlight
.
slice
(
-
2
).
includes
(
m
.
status
)
}
}
)
{
</
Query
>
attention
.
push
(
m
)
)
}
else
if
(
}
}
submitter
.
teamMembers
[
0
].
user
.
id
===
currentUser
.
id
&&
</
Query
>
highlight
.
slice
(
0
,
3
).
includes
(
m
.
status
)
)
)
{
attention
.
push
(
m
)
}
else
{
warning
.
push
(
m
)
}
}
else
if
(
!
togglesRequired
&&
states
.
slice
(
done
).
includes
(
m
.
status
)
)
{
complete
.
push
(
m
)
}
else
{
processing
.
push
(
m
)
}
})
return
(
<
React
.
Fragment
>
{
toggles
}
{
manuscripts
.
length
===
0
&&
(
<
Notification
type
=
"info"
>
There are currently no manuscripts connected to this
account.
</
Notification
>
)
}
{
errors
.
map
(
e
=>
(
<
Notification
key
=
"message"
type
=
{
e
.
type
?
e
.
type
:
'
warning
'
}
>
{
e
.
message
}
</
Notification
>
))
}
{
attention
.
length
>
0
&&
(
<
React
.
Fragment
>
<
H2
>
Needs my attention (
{
attention
.
length
}
)
</
H2
>
<
DashboardList
currentUser
=
{
currentUser
}
listData
=
{
attention
}
sectionColor
=
"error"
/>
</
React
.
Fragment
>
)
}
{
warning
.
length
>
0
&&
(
<
React
.
Fragment
>
<
H2
>
Waiting for action by another user (
{
warning
.
length
}
)
</
H2
>
<
DashboardList
currentUser
=
{
currentUser
}
listData
=
{
warning
}
sectionColor
=
"warning"
/>
</
React
.
Fragment
>
)
}
{
processing
.
length
>
0
&&
(
<
React
.
Fragment
>
<
H2
>
In process at Europe PMC (
{
processing
.
length
}
)
</
H2
>
<
DashboardList
currentUser
=
{
currentUser
}
listData
=
{
processing
}
/>
</
React
.
Fragment
>
)
}
{
complete
.
length
>
0
&&
(
<
React
.
Fragment
>
<
H2
>
Submission complete (
{
complete
.
length
}
)
</
H2
>
<
DashboardList
currentUser
=
{
currentUser
}
listData
=
{
complete
}
/>
</
React
.
Fragment
>
)
}
</
React
.
Fragment
>
)
}
}
</
Query
>
)
}
}
</
Query
>
)
}
export
default
MyManuscripts
export
default
MyManuscripts
This diff is collapsed.
Click to expand it.
Preview
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Save comment
Cancel
Please
register
or
sign in
to comment