Skip to content

Commit

Permalink
Functional paradigm shift
Browse files Browse the repository at this point in the history 
Signed-off-by: Christopher Ng <chrng8@gmail.com>
  • Loading branch information
@Pytal
Pytal committed Aug 16, 2021
1 parent c1348c0 commit ad38556
Show file tree
Hide file tree
Showing 3 changed files with 103 additions and 79 deletions.
33 changes: 19 additions & 14 deletions apps/settings/src/components/PersonalInfo/DisplayNameSection/DisplayName.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,30 +76,35 @@ export default {

methods: {
onDisplayNameChange(e) {
this.$emit('update:display-name', e.target.value.trim())
// $nextTick() ensures that references to this.dipslayName further down the chain give the correct non-outdated value
this.$nextTick(() => this.debounceDisplayNameChange())
this.$emit('update:display-name', e.target.value)
this.debounceDisplayNameChange(e.target.value.trim())
},

debounceDisplayNameChange: debounce(async function() {
if (this.$refs.displayName?.checkValidity() && this.isValid()) {
await this.updatePrimaryDisplayName()
debounceDisplayNameChange: debounce(async function(displayName) {
if (this.$refs.displayName?.checkValidity() && this.isValid(displayName)) {
await this.updatePrimaryDisplayName(displayName)
}
}, 500),

async updatePrimaryDisplayName() {
async updatePrimaryDisplayName(displayName) {
try {
const responseData = await savePrimaryDisplayName(this.displayName)
this.handleResponse(responseData.ocs?.meta?.status)
const responseData = await savePrimaryDisplayName(displayName)
this.handleResponse({
displayName,
status: responseData.ocs?.meta?.status,
})
} catch (e) {
this.handleResponse('error', 'Unable to update full name', e)
this.handleResponse({
errorMessage: 'Unable to update full name',
error: e,
})
}
},

handleResponse(status, errorMessage, error) {
handleResponse({ displayName, status, errorMessage, error }) {
if (status === 'ok') {
// Ensure that local initialDiplayName state reflects server state
this.initialDisplayName = this.displayName
this.initialDisplayName = displayName
this.showCheckmarkIcon = true
setTimeout(() => { this.showCheckmarkIcon = false }, 2000)
} else {
Expand All @@ -110,8 +115,8 @@ export default {
}
},

isValid() {
return this.displayName !== ''
isValid(displayName) {
return displayName !== ''
},

onScopeChange(scope) {
Expand Down
89 changes: 57 additions & 32 deletions apps/settings/src/components/PersonalInfo/EmailSection/Email.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ export default {
if (this.primary) {
return this.email === ''
}
return this.email !== '' && !this.isValid()
return this.email !== '' && !this.isValid(this.email)
},

deleteEmailLabel() {
Expand Down Expand Up @@ -159,27 +159,26 @@ export default {

mounted() {
if (this.initialEmail === '') {
this.$nextTick(() => this.$refs.email?.focus())
this.$refs.email?.focus()
}
},

methods: {
onEmailChange(e) {
this.$emit('update:email', e.target.value.trim())
// $nextTick() ensures that references to this.email further down the chain give the correct non-outdated value
this.$nextTick(() => this.debounceEmailChange())
this.$emit('update:email', e.target.value)
this.debounceEmailChange(e.target.value.trim())
},

debounceEmailChange: debounce(async function() {
if (this.$refs.email?.checkValidity() || this.email === '') {
debounceEmailChange: debounce(async function(email) {
if (this.$refs.email?.checkValidity() || email === '') {
if (this.primary) {
await this.updatePrimaryEmail()
await this.updatePrimaryEmail(email)
} else {
if (this.email) {
if (email) {
if (this.initialEmail === '') {
await this.addAdditionalEmail()
await this.addAdditionalEmail(email)
} else {
await this.updateAdditionalEmail()
await this.updateAdditionalEmail(email)
}
}
}
Expand All @@ -189,40 +188,61 @@ export default {
async deleteEmail() {
if (this.primary) {
this.$emit('update:email', '')
this.$nextTick(async() => await this.updatePrimaryEmail())
await this.updatePrimaryEmail('')
} else {
await this.deleteAdditionalEmail()
}
},

async updatePrimaryEmail() {
async updatePrimaryEmail(email) {
try {
const responseData = await savePrimaryEmail(this.email)
this.handleResponse(responseData.ocs?.meta?.status)
const responseData = await savePrimaryEmail(email)
this.handleResponse({
email,
status: responseData.ocs?.meta?.status,
})
} catch (e) {
if (this.email === '') {
this.handleResponse('error', 'Unable to delete primary email address', e)
if (email === '') {
this.handleResponse({
errorMessage: 'Unable to delete primary email address',
error: e,
})
} else {
this.handleResponse('error', 'Unable to update primary email address', e)
this.handleResponse({
errorMessage: 'Unable to update primary email address',
error: e,
})
}
}
},

async addAdditionalEmail() {
async addAdditionalEmail(email) {
try {
const responseData = await saveAdditionalEmail(this.email)
this.handleResponse(responseData.ocs?.meta?.status)
const responseData = await saveAdditionalEmail(email)
this.handleResponse({
email,
status: responseData.ocs?.meta?.status,
})
} catch (e) {
this.handleResponse('error', 'Unable to add additional email address', e)
this.handleResponse({
errorMessage: 'Unable to add additional email address',
error: e,
})
}
},

async updateAdditionalEmail() {
async updateAdditionalEmail(email) {
try {
const responseData = await updateAdditionalEmail(this.initialEmail, this.email)
this.handleResponse(responseData.ocs?.meta?.status)
const responseData = await updateAdditionalEmail(this.initialEmail, email)
this.handleResponse({
email,
status: responseData.ocs?.meta?.status,
})
} catch (e) {
this.handleResponse('error', 'Unable to update additional email address', e)
this.handleResponse({
errorMessage: 'Unable to update additional email address',
error: e,
})
}
},

Expand All @@ -231,22 +251,27 @@ export default {
const responseData = await removeAdditionalEmail(this.initialEmail)
this.handleDeleteAdditionalEmail(responseData.ocs?.meta?.status)
} catch (e) {
this.handleResponse('error', 'Unable to delete additional email address', e)
this.handleResponse({
errorMessage: 'Unable to delete additional email address',
error: e,
})
}
},

handleDeleteAdditionalEmail(status) {
if (status === 'ok') {
this.$emit('delete-additional-email')
} else {
this.handleResponse('error', 'Unable to delete additional email address', {})
this.handleResponse({
errorMessage: 'Unable to delete additional email address',
})
}
},

handleResponse(status, errorMessage, error) {
handleResponse({ email, status, errorMessage, error }) {
if (status === 'ok') {
// Ensure that local initialEmail state reflects server state
this.initialEmail = this.email
this.initialEmail = email
this.showCheckmarkIcon = true
setTimeout(() => { this.showCheckmarkIcon = false }, 2000)
} else {
Expand All @@ -257,8 +282,8 @@ export default {
}
},

isValid() {
return /^\S+$/.test(this.email)
isValid(email) {
return /^\S+$/.test(email)
},

onScopeChange(scope) {
Expand Down
60 changes: 27 additions & 33 deletions apps/settings/src/components/PersonalInfo/shared/FederationControl.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -122,52 +122,46 @@ export default {
async changeScope(scope) {
this.$emit('update:scope', scope)

this.$nextTick(async() => {
if (!this.additional) {
await this.updatePrimaryScope()
} else {
await this.updateAdditionalScope()
}
})
if (!this.additional) {
await this.updatePrimaryScope(scope)
} else {
await this.updateAdditionalScope(scope)
}
},

async updatePrimaryScope() {
async updatePrimaryScope(scope) {
try {
const responseData = await this.handleScopeChange(this.scope)
this.handleResponse(responseData.ocs?.meta?.status)
const responseData = await this.handleScopeChange(scope)
this.handleResponse({
scope,
status: responseData.ocs?.meta?.status,
})
} catch (e) {
this.handleResponse(
'error',
t(
'settings',
'Unable to update federation scope of the primary {accountProperty}',
{ accountProperty: this.accountPropertyLowerCase }
),
e,
)
this.handleResponse({
errorMessage: t('settings', 'Unable to update federation scope of the primary {accountProperty}', { accountProperty: this.accountPropertyLowerCase }),
error: e,
})
}
},

async updateAdditionalScope() {
async updateAdditionalScope(scope) {
try {
const responseData = await this.handleScopeChange(this.additionalValue, this.scope)
this.handleResponse(responseData.ocs?.meta?.status)
const responseData = await this.handleScopeChange(this.additionalValue, scope)
this.handleResponse({
scope,
status: responseData.ocs?.meta?.status,
})
} catch (e) {
this.handleResponse(
'error',
t(
'settings',
'Unable to update federation scope of additional {accountProperty}',
{ accountProperty: this.accountPropertyLowerCase }
),
e,
)
this.handleResponse({
errorMessage: t('settings', 'Unable to update federation scope of additional {accountProperty}', { accountProperty: this.accountPropertyLowerCase }),
error: e,
})
}
},

handleResponse(status, errorMessage, error) {
handleResponse({ scope, status, errorMessage, error }) {
if (status === 'ok') {
this.initialScope = this.scope
this.initialScope = scope
} else {
this.$emit('update:scope', this.initialScope)
showError(errorMessage)
Expand Down

0 comments on commit ad38556

Please sign in to comment.