diff --git a/frontend/views/containers/access/PasswordForm.vue b/frontend/views/containers/access/PasswordForm.vue
index 6dd8efffb6..52e90f69ba 100644
--- a/frontend/views/containers/access/PasswordForm.vue
+++ b/frontend/views/containers/access/PasswordForm.vue
@@ -74,8 +74,8 @@ export default ({
diff --git a/frontend/views/containers/access/SignupForm.vue b/frontend/views/containers/access/SignupForm.vue
index 47521f17ff..3344f0f52d 100644
--- a/frontend/views/containers/access/SignupForm.vue
+++ b/frontend/views/containers/access/SignupForm.vue
@@ -31,6 +31,18 @@ form(data-test='signup' @submit.prevent='')
password-form(:label='L("Confirm Password")' name='passwordConfirm' :$v='$v')
+ label.checkbox
+ input.input(
+ type='checkbox'
+ name='terms'
+ v-model='form.terms'
+ data-test='signTerms'
+ @click.stop=''
+ )
+ i18n(
+ :args='{ a_: ``, _a: ""}'
+ ) I agree to the {a_}terms and conditions{_a}
+
banner-scoped(ref='formMsg' allow-a)
.buttons.is-centered
@@ -63,6 +75,7 @@ import {
noUppercase,
noWhitespace
} from '@model/contracts/shared/validators.js'
+import ALLOWED_URLS from '@view-utils/allowedUrls.js'
// Returns a function that returns the function's argument
const wrapValueInFunction = (v) => () => v
@@ -107,11 +120,13 @@ export default ({
return {
form: {
username: '',
+ email: '',
password: '',
passwordConfirm: '',
- email: '',
+ terms: false,
pictureBase64: ''
},
+ linkToTerms: ALLOWED_URLS.TERMS_PAGE,
usernameAsyncValidation: {
timer: null,
resolveFn: null
@@ -186,6 +201,11 @@ export default ({
email: {
[L('An email is required.')]: required,
[L('Please enter a valid email.')]: email
+ },
+ terms: {
+ [L('You need to agree to the terms and conditions.')]: (value) => {
+ return Boolean(value)
+ }
}
}
}
@@ -207,5 +227,9 @@ export default ({
align-items: flex-start;
gap: 1.5rem;
}
+
+ @include phone {
+ margin-bottom: 1.5rem;
+ }
}
diff --git a/frontend/views/utils/allowedUrls.js b/frontend/views/utils/allowedUrls.js
index 849d6f9dab..183bd4996a 100644
--- a/frontend/views/utils/allowedUrls.js
+++ b/frontend/views/utils/allowedUrls.js
@@ -14,6 +14,7 @@ const ALLOWED_URLS: Object = Object.freeze(Object.fromEntries([
['DONATE_PAGE', 'https://groupincome.org/donate'],
['FAQ_PAGE', 'https://groupincome.org/faq'],
['COMMUNITY_PAGE', 'https://groupincome.org/community'],
+ ['TERMS_PAGE', 'https://groupincome.org/terms-and-conditions'],
['WIKIPEDIA_DUNBARS_NUMBER', "https://en.wikipedia.org/wiki/Dunbar's_number"]
]))
diff --git a/test/cypress/integration/signup-and-login.spec.js b/test/cypress/integration/signup-and-login.spec.js
index 33be3df570..ecf8b649a5 100644
--- a/test/cypress/integration/signup-and-login.spec.js
+++ b/test/cypress/integration/signup-and-login.spec.js
@@ -56,7 +56,7 @@ describe('Signup, Profile and Login', () => {
cy.giLogout()
})
- it('sign up button remains disabled if passwords are not the same', () => {
+ it('sign up button remains disabled if passwords are not the same or terms are not agreed', () => {
const user2 = `user2-${userId}`
const password = '123456789'
const wrongPassword = 'wRoNgPaSsWoRd123'
@@ -67,9 +67,14 @@ describe('Signup, Profile and Login', () => {
cy.getByDT('signEmail').type(`${user2}@email.com`)
cy.getByDT('password').type(password)
cy.getByDT('passwordConfirm').type(wrongPassword)
+ cy.getByDT('signTerms').check({ force: true }).should('be.checked')
cy.getByDT('signSubmit').should('be.disabled')
cy.getByDT('passwordConfirm').clear().type(password)
+ cy.getByDT('signTerms').uncheck({ force: true }).should('not.be.checked')
+ cy.getByDT('signSubmit').should('be.disabled')
+
+ cy.getByDT('signTerms').check({ force: true }).should('be.checked')
cy.getByDT('signSubmit').should('not.be.disabled')
cy.closeModal()
diff --git a/test/cypress/support/commands.js b/test/cypress/support/commands.js
index dc3b459556..befe4c9467 100644
--- a/test/cypress/support/commands.js
+++ b/test/cypress/support/commands.js
@@ -178,6 +178,7 @@ Cypress.Commands.add('giSignup', (username, {
cy.getByDT('signEmail').clear().type(email)
cy.getByDT('password').type(password)
cy.getByDT('passwordConfirm').type(password)
+ cy.getByDT('signTerms').check({ force: true }).should('be.checked')
cy.getByDT('signSubmit').click()
cy.getByDT('closeModal').should('not.exist')