Allow embedded code in posts permanent in database

backend/src/models/User.js

@@ -104,4 +104,8 @@ module.exports = {
     target: 'Location',
     direction: 'out',
   },
+  allowEmbedIframes: {
+    type: 'boolean',
+    default: false,
+  },
 }

backend/src/schema/resolvers/users.js

@@ -175,6 +175,7 @@ export default {
         'about',
         'termsAndConditionsAgreedVersion',
         'termsAndConditionsAgreedAt',
+        'allowEmbedIframes',
       ],
       boolean: {
         followedByCurrentUser:

backend/src/schema/resolvers/users.spec.js

@@ -86,6 +86,7 @@ describe('UpdateUser', () => {
       name: 'John Doe',
       termsAndConditionsAgreedVersion: null,
       termsAndConditionsAgreedAt: null,
+      allowEmbedIframes: false,
     }
 
     variables = {

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

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 = {

webapp/locales/en.json

@@ -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": {

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

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)
+      }
     },
   },
 }

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