Implement 'enter-nonce' db query

This commit is contained in:
Wolfgang Huß 2021-03-02 19:06:52 +01:00
parent 393a05c358
commit 7e3c812ac5
7 changed files with 109 additions and 50 deletions

View File

@ -180,6 +180,15 @@ export default {
setButtonValues() {
this.sliderData.setSliderValuesCallback(this.validInput, this.buttonValues())
},
isVariablesRequested(variables) {
return (
this.sliderData.sliders[this.sliderIndex].data.request &&
this.sliderData.sliders[this.sliderIndex].data.request.variables &&
this.sliderData.sliders[this.sliderIndex].data.request.variables.email === variables.email
// Wolle &&
// this.sliderData.sliders[this.sliderIndex].data.request.variables.token === variables.code
)
},
async onNextClick() {
const mutation = this.token ? SignupByInvitationMutation : SignupMutation
const { token } = this
@ -190,24 +199,12 @@ export default {
return true
}
if (
this.sendEmailAgain ||
!this.sliderData.sliders[this.sliderIndex].data.request ||
(this.sliderData.sliders[this.sliderIndex].data.request &&
(!this.sliderData.sliders[this.sliderIndex].data.request.variables ||
(this.sliderData.sliders[this.sliderIndex].data.request.variables &&
!this.sliderData.sliders[this.sliderIndex].data.request.variables === variables)))
) {
this.sliderData.setSliderValuesCallback(
this.sliderData.sliders[this.sliderIndex].validated,
{ sliderData: { request: { variables }, response: null } },
)
if (this.sendEmailAgain || !this.isVariablesRequested(variables)) {
try {
const response = await this.$apollo.mutate({ mutation, variables }) // e-mail is send in emailMiddleware of backend
this.sliderData.setSliderValuesCallback(
this.sliderData.sliders[this.sliderIndex].validated,
{ sliderData: { response: response.data } },
{ sliderData: { request: { variables }, response: response.data } },
)
if (this.sliderData.sliders[this.sliderIndex].data.response) {

View File

@ -76,12 +76,14 @@ export default {
async sendValidation() {
const { inviteCode } = this.formData
this.sliderData.setSliderValuesCallback(null, { collectedInputData: { inviteCode } })
let dbValidated = false
if (this.validInput) {
await this.handleSubmitVerify()
dbValidated = this.sliderData.sliders[this.sliderIndex].data.response.isValidInviteCode
}
this.sliderData.setSliderValuesCallback(dbValidated, { collectedInputData: { inviteCode } })
this.sliderData.setSliderValuesCallback(dbValidated)
},
async handleInput() {
this.sendValidation()
@ -89,28 +91,26 @@ export default {
async handleInputValid() {
this.sendValidation()
},
isVariablesRequested(variables) {
return (
this.sliderData.sliders[this.sliderIndex].data.request &&
this.sliderData.sliders[this.sliderIndex].data.request.variables &&
this.sliderData.sliders[this.sliderIndex].data.request.variables.code === variables.code
)
},
async handleSubmitVerify() {
const { inviteCode } = this.formData
const { inviteCode } = this.sliderData.collectedInputData
const variables = { code: inviteCode }
if (
!this.sliderData.sliders[this.sliderIndex].data.request ||
(this.sliderData.sliders[this.sliderIndex].data.request &&
(!this.sliderData.sliders[this.sliderIndex].data.request.variables ||
(this.sliderData.sliders[this.sliderIndex].data.request.variables &&
!this.sliderData.sliders[this.sliderIndex].data.request.variables === variables)))
) {
this.sliderData.setSliderValuesCallback(
this.sliderData.sliders[this.sliderIndex].validated,
{ sliderData: { request: { variables }, response: null } },
)
if (!this.isVariablesRequested(variables)) {
try {
const response = await this.$apollo.query({ query: isValidInviteCodeQuery, variables })
this.sliderData.setSliderValuesCallback(
this.sliderData.sliders[this.sliderIndex].validated,
{ sliderData: { response: response.data } },
)
this.sliderData.setSliderValuesCallback(null, {
sliderData: {
request: { variables },
response: response.data,
},
})
if (
this.sliderData.sliders[this.sliderIndex].data.response &&

View File

@ -27,6 +27,13 @@
</template>
<script>
import gql from 'graphql-tag'
export const verifyNonceQuery = gql`
query($email: String!, $nonce: String!) {
VerifyNonce(email: $email, nonce: $nonce)
}
`
export default {
name: 'RegistrationSlideNonce',
props: {
@ -64,26 +71,25 @@ export default {
})
},
computed: {
sliderIndex() {
return this.sliderData.sliderIndex // to have a shorter notation
},
validInput() {
return this.formData.nonce.length === 5
},
},
methods: {
sendValidation() {
async sendValidation() {
const { nonce } = this.formData
// Wolle shall the nonce be validated in the database?
// let dbValidated = false
// if (this.validInput) {
// await this.handleSubmitVerify()
// dbValidated = this.sliderData.sliders[this.sliderIndex].data.response.isValidInviteCode
// }
// this.sliderData.setSliderValuesCallback(dbValidated, {
this.sliderData.setSliderValuesCallback(this.validInput, {
collectedInputData: {
nonce,
},
})
this.sliderData.setSliderValuesCallback(null, { collectedInputData: { nonce } })
let dbValidated = false
if (this.validInput) {
await this.handleSubmitVerify()
dbValidated = this.sliderData.sliders[this.sliderIndex].data.response.VerifyNonce
}
this.sliderData.setSliderValuesCallback(dbValidated)
},
async handleInput() {
this.sendValidation()
@ -91,7 +97,46 @@ export default {
async handleInputValid() {
this.sendValidation()
},
handleSubmitVerify() {},
isVariablesRequested(variables) {
return (
this.sliderData.sliders[this.sliderIndex].data.request &&
this.sliderData.sliders[this.sliderIndex].data.request.variables &&
this.sliderData.sliders[this.sliderIndex].data.request.variables.email ===
variables.email &&
this.sliderData.sliders[this.sliderIndex].data.request.variables.nonce === variables.nonce
)
},
async handleSubmitVerify() {
const { email, nonce } = this.sliderData.collectedInputData
const variables = { email, nonce }
if (!this.isVariablesRequested(variables)) {
try {
const response = await this.$apollo.query({ query: verifyNonceQuery, variables })
this.sliderData.setSliderValuesCallback(
this.sliderData.sliders[this.sliderIndex].validated,
{ sliderData: { request: { variables }, response: response.data } },
)
if (
this.sliderData.sliders[this.sliderIndex].data.response &&
this.sliderData.sliders[this.sliderIndex].data.response.VerifyNonce
) {
this.$toast.success(
this.$t('components.registration.email-nonce.form.success', { email, nonce }),
)
}
} catch (err) {
this.sliderData.setSliderValuesCallback(
this.sliderData.sliders[this.sliderIndex].validated,
{ sliderData: { response: { VerifyNonce: false } } },
)
const { message } = err
this.$toast.error(message)
}
}
},
onNextClick() {
return true
},

View File

@ -26,6 +26,9 @@ const plugins = [
if (JSON.stringify(data).includes('isValidInviteCode')) {
return { data: { isValidInviteCode: true } }
}
if (JSON.stringify(data).includes('VerifyNonce')) {
return { data: { VerifyNonce: true } }
}
throw new Error(`Query name not found!`)
},
}

View File

@ -118,7 +118,7 @@ export default {
name: 'enter-nonce',
title: 'E-Mail Confirmation', // Wolle
validated: false,
data: { request: null, response: null },
data: { request: null, response: { VerifyNonce: false } },
button: {
title: 'Confirm', // Wolle
icon: 'arrow-right',
@ -198,11 +198,15 @@ export default {
},
},
methods: {
setSliderValuesCallback(isValid, { collectedInputData, sliderData, sliderSettings }) {
setSliderValuesCallback(
isValid = null,
{ collectedInputData, sliderData, sliderSettings } = {},
) {
// all changes of 'this.sliders' has to be filled in from the top to be spread to the component slider and all slider components in the slot
this.sliderData.sliders[this.sliderIndex].validated = isValid
if (isValid !== null) {
this.sliderData.sliders[this.sliderIndex].validated = isValid
}
if (collectedInputData) {
this.sliderData.collectedInputData = {
...this.sliderData.collectedInputData,

View File

@ -167,6 +167,11 @@
"success": "Verifikations-E-Mail gesendet an <b>{email}</b>!"
}
},
"email-nonce": {
"form": {
"success": "Gültiger Bestätigungs-Code <b>{nonce}</b> für E-Mail <b>{email}</b>!"
}
},
"invite-code": {
"form": {
"success": "Gültiger Einladungs-Code <b>{inviteCode}</b>!"

View File

@ -167,6 +167,11 @@
"success": "Verification e-mail send to <b>{email}</b>!"
}
},
"email-nonce": {
"form": {
"success": "Valid verification code <b>{nonce}</b> for e-mail <b>{email}</b>!"
}
},
"invite-code": {
"form": {
"success": "Valid invite code <b>{inviteCode}</b>!"