github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-07 20:31:06 -05:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #766 from sharelatex/ja-affiliations-ui-state

Browse source 
Update affiliations UI to show specific errors for conflicting emails
This commit is contained in:
James Allen 2018-07-26 10:58:37 +01:00 committed by GitHub
commit 20cd723df2
2 changed files with 107 additions and 88 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

57
services/web/app/views/user/settings/user-affiliations.pug
View file

@ -11,9 +11,7 @@ form.row(
th.affiliations-table-email #{translate("email")}
th.affiliations-table-institution #{translate("institution_and_role")}
th.affiliations-table-inline-actions
tbody(
ng-if="!ui.hasError"
)
tbody
tr(
ng-repeat="userEmail in userEmails"
)
@ -59,7 +57,7 @@ form.row(
.affiliation-change-actions.small
a(
href
ng-click="saveAffiliationChange();"
ng-click="saveAffiliationChange(userEmail);"
) #{translate("save_or_cancel-save")}
|  #{translate("save_or_cancel-or" )} 
a(
@ -71,30 +69,26 @@ form.row(
// so create a wrapper for the tooltip
div.affiliations-table-inline-action-disabled-wrapper(
tooltip=translate("please_confirm_your_email_before_making_it_default")
ng-if="!userEmail.default && !userEmail.confirmedAt"
tooltip-enable="!ui.isMakingRequest"
ng-if="!userEmail.default && (!userEmail.confirmedAt || ui.isMakingRequest)"
)
button.btn.btn-sm.btn-success.affiliations-table-inline-action(
disabled
) #{translate("make_default")}
button.btn.btn-sm.btn-success.affiliations-table-inline-action(
ng-if="!userEmail.default && userEmail.confirmedAt"
ng-if="!userEmail.default && (userEmail.confirmedAt && !ui.isMakingRequest)"
ng-click="setDefaultUserEmail(userEmail)"
) #{translate("make_default")}
|  
button.btn.btn-sm.btn-danger.affiliations-table-inline-action(
ng-if="!userEmail.default"
ng-click="removeUserEmail(userEmail)"
ng-disabled="ui.isMakingRequest"
tooltip=translate("remove")
)
i.fa.fa-fw.fa-trash
tr.affiliations-table-highlighted-row(
ng-if="ui.isLoadingEmails"
)
td.text-center(colspan="3")
i.fa.fa-fw.fa-spin.fa-refresh
|  #{translate("loading")}...
tr.affiliations-table-highlighted-row(
ng-if="!ui.showAddEmailUI && !ui.isLoadingEmails"
ng-if="!ui.showAddEmailUI && !ui.isMakingRequest"
)
td(colspan="3")
a(
@ -103,7 +97,7 @@ form.row(
) #{translate("add_another_email")}
tr.affiliations-table-highlighted-row(
ng-if="ui.showAddEmailUI"
ng-if="ui.showAddEmailUI && !ui.isLoadingEmails"
)
td
.affiliations-form-group
@ -149,31 +143,30 @@ form.row(
)
td
button.btn.btn-sm.btn-primary(
ng-disabled="affiliationsForm.$invalid || ui.isAddingNewEmail"
ng-disabled="affiliationsForm.$invalid || ui.isMakingRequest"
ng-click="addNewEmail()"
)
span(
ng-if="!ui.isAddingNewEmail"
) #{translate("add_new_email")}
span(
ng-if="ui.isAddingNewEmail"
)
i.fa.fa-fw.fa-spin.fa-refresh
|  #{translate("adding")}...
tbody(
ng-if="ui.hasError"
)
| #{translate("add_new_email")}
tr.affiliations-table-highlighted-row(
ng-if="ui.isMakingRequest"
)
td.text-center(colspan="3", ng-if="ui.isLoadingEmails")
i.fa.fa-fw.fa-spin.fa-refresh
|  #{translate("loading")}...
td.text-center(colspan="3", ng-if="ui.isResendingConfirmation")
i.fa.fa-fw.fa-spin.fa-refresh
|  #{translate("sending")}...
td.text-center(colspan="3", ng-if="!ui.isLoadingEmails && !ui.isResendingConfirmation")
i.fa.fa-fw.fa-spin.fa-refresh
|  #{translate("saving")}...
tr.affiliations-table-error-row(
ng-if="true"
ng-if="ui.hasError"
)
td.text-center(colspan="3")
div
i.fa.fa-fw.fa-exclamation-triangle
|  #{translate("error_performing_request")}
div
button.btn.btn-xs(
ng-click="acknowledgeError();"
) #{translate("reload_emails_and_affiliations")}
span(ng-if="!ui.errorMessage")  #{translate("error_performing_request")}
span(ng-if="ui.errorMessage")  {{ui.errorMessage}}
hr

138
services/web/public/coffee/main/affiliations/controllers/UserAffiliationsController.coffee
View file

@ -55,25 +55,23 @@ define [
$scope.affiliationToChange.role = userEmail.affiliation.role
$scope.affiliationToChange.department = userEmail.affiliation.department
$scope.saveAffiliationChange = () ->
$scope.ui.isLoadingEmails = true
UserAffiliationsDataService
.addRoleAndDepartment(
$scope.affiliationToChange.email,
$scope.affiliationToChange.role,
$scope.affiliationToChange.department
)
$scope.saveAffiliationChange = (userEmail) ->
userEmail.affiliation.role = $scope.affiliationToChange.role
userEmail.affiliation.department = $scope.affiliationToChange.department
_resetAffiliationToChange()
_monitorRequest(
UserAffiliationsDataService
.addRoleAndDepartment(
userEmail.email,
userEmail.affiliation.role,
userEmail.affiliation.department
)
)
.then () ->
_reset()
_getUserEmails()
.catch () ->
$scope.ui.hasError = true
setTimeout () -> _getUserEmails()
$scope.cancelAffiliationChange = (email) ->
$scope.affiliationToChange.email = ""
$scope.affiliationToChange.university = null
$scope.affiliationToChange.role = null
$scope.affiliationToChange.department = null
_resetAffiliationToChange()
$scope.isChangingAffiliation = (email) ->
$scope.affiliationToChange.email == email
@ -82,7 +80,6 @@ define [
$scope.ui.showAddEmailUI = true
$scope.addNewEmail = () ->
$scope.ui.isAddingNewEmail = true
if !$scope.newAffiliation.university?
addEmailPromise = UserAffiliationsDataService
.addUserEmail $scope.newAffiliation.email
@ -104,75 +101,104 @@ define [
$scope.newAffiliation.role,
$scope.newAffiliation.department
)
addEmailPromise
.then () ->
_reset()
_getUserEmails()
.catch () ->
$scope.ui.hasError = true
$scope.ui.isAddingNewEmail = true
$scope.ui.showAddEmailUI = false
_monitorRequest(addEmailPromise)
.then () ->
_resetNewAffiliation()
_resetAddingEmail()
setTimeout () -> _getUserEmails()
.finally () ->
$scope.ui.isAddingNewEmail = false
$scope.setDefaultUserEmail = (userEmail) ->
$scope.ui.isLoadingEmails = true
UserAffiliationsDataService
.setDefaultUserEmail userEmail.email
.then () -> _getUserEmails()
.catch () -> $scope.ui.hasError = true
_monitorRequest(
UserAffiliationsDataService
.setDefaultUserEmail userEmail.email
)
.then () ->
for email in $scope.userEmails or []
email.default = false
userEmail.default = true
$scope.removeUserEmail = (userEmail) ->
$scope.ui.isLoadingEmails = true
userEmailIdx = _.indexOf $scope.userEmails, userEmail
if userEmailIdx > -1
$scope.userEmails.splice userEmailIdx, 1
UserAffiliationsDataService
.removeUserEmail userEmail.email
.then () -> _getUserEmails()
.catch () -> $scope.ui.hasError = true
$scope.userEmails = $scope.userEmails.filter (ue) -> ue != userEmail
_monitorRequest(
UserAffiliationsDataService
.removeUserEmail userEmail.email
)
$scope.resendConfirmationEmail = (userEmail) ->
$scope.ui.isLoadingEmails = true
UserAffiliationsDataService
.resendConfirmationEmail userEmail.email
.then () -> _getUserEmails()
.catch () -> $scope.ui.hasError = true
$scope.ui.isResendingConfirmation = true
_monitorRequest(
UserAffiliationsDataService
.resendConfirmationEmail userEmail.email
)
.finally () ->
$scope.ui.isResendingConfirmation = false
$scope.acknowledgeError = () ->
_reset()
_getUserEmails()
_reset = () ->
_resetAffiliationToChange = () ->
$scope.affiliationToChange =
email: ""
university: null
role: null
department: null
_resetNewAffiliation = () ->
$scope.newAffiliation =
email: ""
country: null
university: null
role: null
department: null
_resetAddingEmail = () ->
$scope.ui.showAddEmailUI = false
$scope.ui.isValidEmail = false
$scope.ui.isBlacklistedEmail = false
$scope.ui.showManualUniversitySelectionUI = false
_reset = () ->
$scope.ui =
hasError: false
errorMessage: ""
showChangeAffiliationUI: false
showManualUniversitySelectionUI: false
isMakingRequest: false
isLoadingEmails: false
isAddingNewEmail: false
showAddEmailUI: false
isValidEmail: false
isBlacklistedEmail: false
$scope.affiliationToChange =
email: ""
university: null
role: null
department: null
isResendingConfirmation: false
_resetAffiliationToChange()
_resetNewAffiliation()
_resetAddingEmail()
_reset()
_monitorRequest = (promise) ->
$scope.ui.hasError = false
$scope.ui.isMakingRequest = true
promise
.catch (response) ->
$scope.ui.hasError = true
$scope.ui.errorMessage = response?.data?.message
.finally () ->
$scope.ui.isMakingRequest = false
return promise
# Populates the emails table
_getUserEmails = () ->
$scope.ui.isLoadingEmails = true
UserAffiliationsDataService
.getUserEmails()
_monitorRequest(
UserAffiliationsDataService
.getUserEmails()
)
.then (emails) ->
$scope.userEmails = emails
.finally () ->
$scope.ui.isLoadingEmails = false
.catch () ->
$scope.ui.hasError = true
_getUserEmails()
]