From 044e2bfed958e2dc1c4654f1897f66235d16a7d5 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Mon, 23 Sep 2019 20:08:45 +0200
Subject: [PATCH] Allow embedded code in posts permanent in database

---
 backend/src/models/User.js                 |  4 ++
 backend/src/schema/resolvers/users.js      |  1 +
 backend/src/schema/resolvers/users.spec.js |  1 +
 backend/src/schema/types/type/User.gql     |  3 +
 backend/src/seed/factories/users.js        |  1 +
 webapp/locales/en.json                     | 16 +++++-
 webapp/middleware/termsAndConditions.js    |  1 +
 webapp/pages/settings/allow-embeds.vue     | 64 +++++++++++++++++++---
 webapp/store/auth.js                       |  5 ++
 9 files changed, 85 insertions(+), 11 deletions(-)

diff --git a/backend/src/models/User.js b/backend/src/models/User.js
index 72cef4093..736b7b1ab 100644
--- a/backend/src/models/User.js
+++ b/backend/src/models/User.js
@@ -104,4 +104,8 @@ module.exports = {
     target: 'Location',
     direction: 'out',
   },
+  allowEmbedIframes: {
+    type: 'boolean',
+    default: false,
+  },
 }
diff --git a/backend/src/schema/resolvers/users.js b/backend/src/schema/resolvers/users.js
index ea9220d5e..7ec6d6d46 100644
--- a/backend/src/schema/resolvers/users.js
+++ b/backend/src/schema/resolvers/users.js
@@ -175,6 +175,7 @@ export default {
         'about',
         'termsAndConditionsAgreedVersion',
         'termsAndConditionsAgreedAt',
+        'allowEmbedIframes',
       ],
       boolean: {
         followedByCurrentUser:
diff --git a/backend/src/schema/resolvers/users.spec.js b/backend/src/schema/resolvers/users.spec.js
index 784a48c06..986f4a41f 100644
--- a/backend/src/schema/resolvers/users.spec.js
+++ b/backend/src/schema/resolvers/users.spec.js
@@ -86,6 +86,7 @@ describe('UpdateUser', () => {
       name: 'John Doe',
       termsAndConditionsAgreedVersion: null,
       termsAndConditionsAgreedAt: null,
+      allowEmbedIframes: false,
     }
 
     variables = {
diff --git a/backend/src/schema/types/type/User.gql b/backend/src/schema/types/type/User.gql
index f1c38b8d6..d9084dd90 100644
--- a/backend/src/schema/types/type/User.gql
+++ b/backend/src/schema/types/type/User.gql
@@ -27,6 +27,8 @@ type User {
 	termsAndConditionsAgreedVersion: String
 	termsAndConditionsAgreedAt: String
 
+	allowEmbedIframes: Boolean
+
 	friends: [User]! @relation(name: "FRIENDS", direction: "BOTH")
 	friendsCount: Int! @cypher(statement: "MATCH (this)<-[: FRIENDS]->(r: User) RETURN COUNT(DISTINCT r)")
 
@@ -166,6 +168,7 @@ type Mutation {
 	about: String
 	termsAndConditionsAgreedVersion: String
 	termsAndConditionsAgreedAt: String
+	allowEmbedIframes: Boolean
 	): User
 
 	DeleteUser(id: ID!, resource: [Deletable]): User
diff --git a/backend/src/seed/factories/users.js b/backend/src/seed/factories/users.js
index 962f92781..b65be795d 100644
--- a/backend/src/seed/factories/users.js
+++ b/backend/src/seed/factories/users.js
@@ -16,6 +16,7 @@ export default function create() {
         about: faker.lorem.paragraph(),
         termsAndConditionsAgreedVersion: '0.0.1',
         termsAndConditionsAgreedAt: '2019-08-01T10:47:19.212Z',
+        allowEmbedIframes: false,
       }
       defaults.slug = slugify(defaults.name, { lower: true })
       args = {
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index 39220d318..e97360b55 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -2,7 +2,7 @@
   "maintenance": {
     "title": "Human Connection is under maintenance",
     "explanation": "At the moment we are doing some scheduled maintenance, please try again later.",
-    "questions": "Any Questions or concerns, send an email to" 
+    "questions": "Any Questions or concerns, send an email to"
   },
   "index": {
     "no-results": "No contributions found.",
@@ -307,6 +307,18 @@
       "submit": "Comment",
       "submitted": "Comment Submitted",
       "updated": "Changes Saved"
+    },
+    "allowEmbeds": {
+      "name": "Third party providers",
+      "description": "In our contributions can / will be included from the following list of providers foreign code from other providers (third parties) in the form of embedded videos, images or text.",
+      "statustext": "At the moment this is automatic embedding:",
+      "statuschange": "Change setting",
+      "false": "Turned off",
+      "true": "Admitted",
+      "button-tofalse": "turn-off",
+      "button-totrue": "allow permanently",
+      "third-party-false": "It automatically integrates <b style='color:red'>no </b> third-party providers' service.",
+      "third-party-true": "The inclusion of third-party services is <b style='color:red'>permanently allowed</b> and stored for future sessions."
     }
   },
   "comment": {
@@ -593,4 +605,4 @@
     "have-fun": "Now have fun with the alpha version of Human Connection! For the first universal peace. ♥︎",
     "closing": "Thank you very much <br> <br> your Human Connection Team"
   }
-}
+}
\ No newline at end of file
diff --git a/webapp/middleware/termsAndConditions.js b/webapp/middleware/termsAndConditions.js
index 64141eed0..68ad49bf8 100644
--- a/webapp/middleware/termsAndConditions.js
+++ b/webapp/middleware/termsAndConditions.js
@@ -6,6 +6,7 @@ export default async ({ store, env, route, redirect }) => {
   if (publicPages.indexOf(route.name) >= 0) {
     return true
   }
+
   if (route.name === 'terms-and-conditions-confirm') return true // avoid endless loop
 
   if (store.getters['auth/termsAndConditionsAgreed']) return true
diff --git a/webapp/pages/settings/allow-embeds.vue b/webapp/pages/settings/allow-embeds.vue
index 31380380d..61f544af9 100644
--- a/webapp/pages/settings/allow-embeds.vue
+++ b/webapp/pages/settings/allow-embeds.vue
@@ -12,12 +12,12 @@
       <ds-container width="large">
         <ds-flex>
           <ds-flex-item>
-            <ds-button @click="toFalse" primary :disabled="disabled">
+            <ds-button @click="toFalse" primary :disabled="!disabled">
               {{ $t('post.allowEmbeds.button-tofalse') }}
             </ds-button>
           </ds-flex-item>
           <ds-flex-item>
-            <ds-button @click="toTrue" danger :disabled="!disabled">
+            <ds-button @click="toTrue" danger :disabled="disabled">
               {{ $t('post.allowEmbeds.button-totrue') }}
             </ds-button>
           </ds-flex-item>
@@ -27,7 +27,7 @@
     <ds-space />
     <ds-space />
 
-    <div v-show="!disabled">
+    <div v-show="disabled">
       <p>{{ $t('post.allowEmbeds.description') }}</p>
       <ds-container>
         <ds-placeholder>
@@ -45,13 +45,33 @@
 
 <script>
 import axios from 'axios'
-
+import gql from 'graphql-tag'
+import { mapGetters, mapMutations } from 'vuex'
+const mutation = gql`
+  mutation($id: ID!, $allowEmbedIframes: Boolean) {
+    UpdateUser(id: $id, allowEmbedIframes: $allowEmbedIframes) {
+      id
+      allowEmbedIframes
+    }
+  }
+`
 export default {
+  head() {
+    return {
+      title: this.$t('post.allowEmbeds.name'),
+    }
+  },
+  computed: {
+    ...mapGetters({
+      currentUser: 'auth/user',
+      allowEmbedIframes: 'auth/allowEmbedIframes',
+    }),
+  },
   data() {
     return {
       allowEmbeds_h3: this.$t('post.allowEmbeds.false'),
       allowEmbeds_desc: this.$t('post.allowEmbeds.third-party-false'),
-      disabled: true,
+      disabled: null,
       providers: [],
     }
   },
@@ -59,17 +79,43 @@ export default {
     axios.get('../api/providers.json').then(response => {
       this.providers = response.data
     })
+    this.disabled = this.currentUser.allowEmbedIframes
   },
   methods: {
-    toFalse: function() {
+    ...mapMutations({
+      setCurrentUser: 'auth/SET_USER',
+    }),
+    toFalse() {
       this.allowEmbeds_h3 = this.$t('post.allowEmbeds.false')
       this.allowEmbeds_desc = this.$t('post.allowEmbeds.third-party-false')
-      this.disabled = true
+      this.submit()
     },
-    toTrue: function() {
+    toTrue() {
       this.allowEmbeds_h3 = this.$t('post.allowEmbeds.true')
       this.allowEmbeds_desc = this.$t('post.allowEmbeds.third-party-true')
-      this.disabled = false
+      this.submit()
+    },
+    async submit() {
+      try {
+        await this.$apollo.mutate({
+          mutation,
+          variables: {
+            id: this.currentUser.id,
+            allowEmbedIframes: !this.disabled,
+          },
+          update: (store, { data: { UpdateUser } }) => {
+            const { allowEmbedIframes } = UpdateUser
+            this.setCurrentUser({
+              ...this.currentUser,
+              allowEmbedIframes,
+            })
+          },
+        })
+        this.$toast.success(this.$t('site.thanks') + ' ' + this.allowEmbeds_h3)
+        this.disabled = !this.disabled
+      } catch (err) {
+        this.$toast.error(err.message)
+      }
     },
   },
 }
diff --git a/webapp/store/auth.js b/webapp/store/auth.js
index 498477660..ce4d877bf 100644
--- a/webapp/store/auth.js
+++ b/webapp/store/auth.js
@@ -6,6 +6,7 @@ export const state = () => {
     user: null,
     token: null,
     pending: false,
+    allowEmbedIframes: false,
   }
 }
 
@@ -46,6 +47,9 @@ export const getters = {
   termsAndConditionsAgreed(state) {
     return state.user && state.user.termsAndConditionsAgreedVersion === VERSION
   },
+  allowEmbedIframes(state) {
+    return state.allowEmbedIframes
+  },
 }
 
 export const actions = {
@@ -86,6 +90,7 @@ export const actions = {
             locationName
             contributionsCount
             commentedCount
+            allowEmbedIframes
             termsAndConditionsAgreedVersion
             socialMedia {
               id