From 855caf78e9090b985c9d224a47802802243f271f Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Tue, 15 Oct 2019 13:05:51 +0200
Subject: [PATCH 1/3] reference to terms of use, data protection, minimum age
 at added

---
 webapp/components/Registration/Signup.vue | 10 ++++++++++
 webapp/locales/de.json                    |  3 +++
 webapp/locales/en.json                    |  3 +++
 3 files changed, 16 insertions(+)

diff --git a/webapp/components/Registration/Signup.vue b/webapp/components/Registration/Signup.vue
index 00309b1c6..cbed5b9f8 100644
--- a/webapp/components/Registration/Signup.vue
+++ b/webapp/components/Registration/Signup.vue
@@ -30,6 +30,16 @@
         name="email"
         icon="envelope"
       />
+      <ds-list size="base">
+        <ds-list-item>
+          <ds-text v-html="$t('components.registration.signup.form.terms-and-condition')"></ds-text>
+        </ds-list-item>
+        <ds-list-item>
+          <ds-text v-html="$t('components.registration.signup.form.data-privacy')"></ds-text>
+        </ds-list-item>
+        <ds-list-item>{{ $t('components.registration.signup.form.minimum-age') }}</ds-list-item>
+      </ds-list>
+
       <ds-button
         :disabled="disabled"
         :loading="$apollo.loading"
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index 96c1cd322..36d99ace3 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -30,6 +30,9 @@
         "title": "Mach mit bei Human Connection!",
         "form": {
           "description": "Um loszulegen, gib deine E-Mail Adresse ein:",
+          "terms-and-condition": "Es gelten unsere <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > Nutzungsbedingungen!</ds-text></a>",
+          "data-privacy": "Es gelten unsere <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" >Datenschutzerklärungen!",
+          "minimum-age": "Du musst das 18 Lebensjahr abgeschlossen haben!",
           "invitation-code": "Dein Einladungscode lautet: <b>{code}</b>",
           "errors": {
             "email-exists": "Es gibt schon ein Benutzerkonto mit dieser E-Mail Adresse!",
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index 90bb84c37..a22f7a4a4 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -31,6 +31,9 @@
         "title": "Join Human Connection!",
         "form": {
           "description": "To get started, enter your email address:",
+          "terms-and-condition": "Our <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > terms of conditions!</ds-text></a> apply!",
+          "data-privacy": "Our <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" > Data privacy </ds-text></a> apply!",
+          "minimum-age": "You must be at least 18 years old!",
           "invitation-code": "Your invitation code is: <b>{code}</b>",
           "errors": {
             "email-exists": "There is already a user account with this email address!",

From 461defd4606dd2f4a68c0133e1dd528c164f09a5 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Tue, 15 Oct 2019 15:43:31 +0200
Subject: [PATCH 2/3] WITH CHECKBOXES

---
 webapp/components/Registration/Signup.vue | 36 ++++++++++++++++-------
 webapp/locales/de.json                    |  6 ++--
 webapp/locales/en.json                    |  6 ++--
 3 files changed, 32 insertions(+), 16 deletions(-)

diff --git a/webapp/components/Registration/Signup.vue b/webapp/components/Registration/Signup.vue
index cbed5b9f8..18750b300 100644
--- a/webapp/components/Registration/Signup.vue
+++ b/webapp/components/Registration/Signup.vue
@@ -30,15 +30,24 @@
         name="email"
         icon="envelope"
       />
-      <ds-list size="base">
-        <ds-list-item>
-          <ds-text v-html="$t('components.registration.signup.form.terms-and-condition')"></ds-text>
-        </ds-list-item>
-        <ds-list-item>
-          <ds-text v-html="$t('components.registration.signup.form.data-privacy')"></ds-text>
-        </ds-list-item>
-        <ds-list-item>{{ $t('components.registration.signup.form.minimum-age') }}</ds-list-item>
-      </ds-list>
+      <p>
+        <label class="add-checkbox">
+          <input @change="handleInputValid" type="checkbox" v-model="checkbox1" />
+          <span v-html="$t('components.registration.signup.form.terms-and-condition')"></span>
+        </label>
+      </p>
+      <p>
+        <label class="add-checkbox">
+          <input@change="handleInputValid" type="checkbox" v-model="checkbox2"/>
+          <span v-html="$t('components.registration.signup.form.data-privacy')"></span>
+        </label>
+      </p>
+      <p>
+        <label class="add-checkbox">
+          <input @change="handleInputValid" type="checkbox" v-model="checkbox3" />
+          <span v-html="$t('components.registration.signup.form.minimum-age')"></span>
+        </label>
+      </p>
 
       <ds-button
         :disabled="disabled"
@@ -112,6 +121,9 @@ export default {
       disabled: true,
       success: false,
       error: null,
+      checkbox1: false,
+      checkbox2: false,
+      checkbox3: false,
     }
   },
   computed: {
@@ -125,7 +137,11 @@ export default {
       this.disabled = true
     },
     handleInputValid() {
-      this.disabled = false
+      if (this.checkbox1 && this.checkbox2 && this.checkbox3) {
+        this.disabled = false
+      } else {
+        this.disabled = true
+      }
     },
     async handleSubmit() {
       const mutation = this.token ? SignupByInvitationMutation : SignupMutation
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index 36d99ace3..39549a6a2 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -30,9 +30,9 @@
         "title": "Mach mit bei Human Connection!",
         "form": {
           "description": "Um loszulegen, gib deine E-Mail Adresse ein:",
-          "terms-and-condition": "Es gelten unsere <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > Nutzungsbedingungen!</ds-text></a>",
-          "data-privacy": "Es gelten unsere <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" >Datenschutzerklärungen!",
-          "minimum-age": "Du musst das 18 Lebensjahr abgeschlossen haben!",
+          "terms-and-condition": "Ich stimme den <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > Nutzungsbedingungen!</ds-text></a>zu.",
+          "data-privacy": "Ich habe die  <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" >Datenschutzerklärungen!</ds-text></a> gelesen und verstanden",
+          "minimum-age": "Ich bin 18 Jahre oder älter.",
           "invitation-code": "Dein Einladungscode lautet: <b>{code}</b>",
           "errors": {
             "email-exists": "Es gibt schon ein Benutzerkonto mit dieser E-Mail Adresse!",
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index a22f7a4a4..a97a84a73 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -31,9 +31,9 @@
         "title": "Join Human Connection!",
         "form": {
           "description": "To get started, enter your email address:",
-          "terms-and-condition": "Our <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > terms of conditions!</ds-text></a> apply!",
-          "data-privacy": "Our <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" > Data privacy </ds-text></a> apply!",
-          "minimum-age": "You must be at least 18 years old!",
+          "terms-and-condition": "I confirm to the <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > Terms and conditions</ds-text></a>.",
+          "data-privacy": " I have read and understood the <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" >Privacy Statement</ds-text></a> ",
+          "minimum-age": "I'm 18 years or older.",
           "invitation-code": "Your invitation code is: <b>{code}</b>",
           "errors": {
             "email-exists": "There is already a user account with this email address!",

From d7dc0646e002263920b2feadfe638052ae7074a2 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Tue, 15 Oct 2019 19:21:05 +0200
Subject: [PATCH 3/3] Confirm, privacy policy, minimum age at registration

---
 .../Registration/CreateUserAccount.spec.js    |  4 ++-
 .../Registration/CreateUserAccount.vue        | 18 ++++++++++--
 webapp/components/Registration/Signup.vue     | 28 +------------------
 webapp/locales/de.json                        |  2 +-
 4 files changed, 21 insertions(+), 31 deletions(-)

diff --git a/webapp/components/Registration/CreateUserAccount.spec.js b/webapp/components/Registration/CreateUserAccount.spec.js
index 67a14b3c5..3bea5a975 100644
--- a/webapp/components/Registration/CreateUserAccount.spec.js
+++ b/webapp/components/Registration/CreateUserAccount.spec.js
@@ -61,7 +61,9 @@ describe('CreateUserAccount', () => {
             wrapper.find('input#password').setValue('hellopassword')
             wrapper.find('textarea#about').setValue('Hello I am the `about` attribute')
             wrapper.find('input#passwordConfirmation').setValue('hellopassword')
-            wrapper.find('input#checkbox').setChecked()
+            wrapper.find('input#checkbox0').setChecked()
+            wrapper.find('input#checkbox1').setChecked()
+            wrapper.find('input#checkbox2').setChecked()
             await wrapper.find('form').trigger('submit')
             await wrapper.html()
           }
diff --git a/webapp/components/Registration/CreateUserAccount.vue b/webapp/components/Registration/CreateUserAccount.vue
index be01e0bb0..7fc64a545 100644
--- a/webapp/components/Registration/CreateUserAccount.vue
+++ b/webapp/components/Registration/CreateUserAccount.vue
@@ -64,7 +64,7 @@
 
         <ds-text>
           <input
-            id="checkbox"
+            id="checkbox0"
             type="checkbox"
             v-model="termsAndConditionsConfirmed"
             :checked="termsAndConditionsConfirmed"
@@ -74,12 +74,24 @@
             v-html="$t('termsAndConditions.termsAndConditionsConfirmed')"
           ></label>
         </ds-text>
+        <p>
+          <label>
+            <input id="checkbox1" type="checkbox" v-model="dataPrivacy" :checked="dataPrivacy" />
+            <span v-html="$t('components.registration.signup.form.data-privacy')"></span>
+          </label>
+        </p>
+        <p>
+          <label>
+            <input id="checkbox2" type="checkbox" v-model="minimumAge" :checked="minimumAge" />
+            <span v-html="$t('components.registration.signup.form.minimum-age')"></span>
+          </label>
+        </p>
         <ds-button
           style="float: right;"
           icon="check"
           type="submit"
           :loading="$apollo.loading"
-          :disabled="errors || !termsAndConditionsConfirmed"
+          :disabled="errors || !termsAndConditionsConfirmed || !dataPrivacy || !minimumAge"
           primary
         >
           {{ $t('actions.save') }}
@@ -129,6 +141,8 @@ export default {
       // Integrate termsAndConditionsConfirmed into `this.formData` once we
       // have checkmarks available.
       termsAndConditionsConfirmed: false,
+      dataPrivacy: false,
+      minimumAge: false,
     }
   },
   props: {
diff --git a/webapp/components/Registration/Signup.vue b/webapp/components/Registration/Signup.vue
index 18750b300..00309b1c6 100644
--- a/webapp/components/Registration/Signup.vue
+++ b/webapp/components/Registration/Signup.vue
@@ -30,25 +30,6 @@
         name="email"
         icon="envelope"
       />
-      <p>
-        <label class="add-checkbox">
-          <input @change="handleInputValid" type="checkbox" v-model="checkbox1" />
-          <span v-html="$t('components.registration.signup.form.terms-and-condition')"></span>
-        </label>
-      </p>
-      <p>
-        <label class="add-checkbox">
-          <input@change="handleInputValid" type="checkbox" v-model="checkbox2"/>
-          <span v-html="$t('components.registration.signup.form.data-privacy')"></span>
-        </label>
-      </p>
-      <p>
-        <label class="add-checkbox">
-          <input @change="handleInputValid" type="checkbox" v-model="checkbox3" />
-          <span v-html="$t('components.registration.signup.form.minimum-age')"></span>
-        </label>
-      </p>
-
       <ds-button
         :disabled="disabled"
         :loading="$apollo.loading"
@@ -121,9 +102,6 @@ export default {
       disabled: true,
       success: false,
       error: null,
-      checkbox1: false,
-      checkbox2: false,
-      checkbox3: false,
     }
   },
   computed: {
@@ -137,11 +115,7 @@ export default {
       this.disabled = true
     },
     handleInputValid() {
-      if (this.checkbox1 && this.checkbox2 && this.checkbox3) {
-        this.disabled = false
-      } else {
-        this.disabled = true
-      }
+      this.disabled = false
     },
     async handleSubmit() {
       const mutation = this.token ? SignupByInvitationMutation : SignupMutation
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index 39549a6a2..154dc67b6 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -30,7 +30,7 @@
         "title": "Mach mit bei Human Connection!",
         "form": {
           "description": "Um loszulegen, gib deine E-Mail Adresse ein:",
-          "terms-and-condition": "Ich stimme den <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > Nutzungsbedingungen!</ds-text></a>zu.",
+          "terms-and-condition": "Ich stimme den <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > Nutzungsbedingungen</ds-text></a>zu.",
           "data-privacy": "Ich habe die  <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" >Datenschutzerklärungen!</ds-text></a> gelesen und verstanden",
           "minimum-age": "Ich bin 18 Jahre oder älter.",
           "invitation-code": "Dein Einladungscode lautet: <b>{code}</b>",