registration: checkbox agree to emails

Author: razbakov

components/TField.vue

@@ -29,9 +29,11 @@
           v-bind="$attrs"
           :item="item"
           :value.sync="computedValue"
+          :label="label"
+          :name="name"
           :class="{ 'border-red-500': error }"
           v-on="$attrs.listeners"
-          @input="(val) => $emit('input', set(val))"
+          @input="onInput"
         />
       </slot>
       <div v-if="error" class="field-error text-red-500 text-sm mt-2">
@@ -59,7 +61,7 @@ export default {
   inheritAttrs: false,
   props: {
     value: {
-      type: [String, Object, Array, Number, Date],
+      type: [String, Object, Array, Number, Date, Boolean],
       default: '',
     },
     item: {
@@ -70,6 +72,10 @@ export default {
       type: String,
       default: '',
     },
+    name: {
+      type: String,
+      default: '',
+    },
     description: {
       type: String,
       default: '',
@@ -154,11 +160,16 @@ export default {
     },
   },
   mounted() {
-    this.elementId = camelize(this.label)
+    this.elementId = this.name || camelize(this.label)
 
     if (!this.value && this.default) {
       this.$emit('input', this.default)
     }
   },
+  methods: {
+    onInput(val) {
+      this.$emit('input', this.set(val))
+    },
+  },
 }
 </script>

components/TInput/TCheckbox.vue

@@ -0,0 +1,42 @@
+<template>
+  <label>
+    <vt-checkbox v-model="input" v-bind="$attrs" v-on="$listeners" />
+    <span class="text-sm mx-2 text-gray-700">{{ label }}</span>
+  </label>
+</template>
+
+<script>
+import { sanitize } from '~/utils'
+
+export default {
+  name: 'TInput',
+  props: {
+    value: {
+      type: [String, Number, Object, Date, Boolean],
+      default: '',
+    },
+    defaultValue: {
+      type: String,
+      default: '',
+    },
+    item: {
+      type: Object,
+      default: () => ({}),
+    },
+    label: {
+      type: String,
+      default: '',
+    },
+  },
+  computed: {
+    input: {
+      get() {
+        return this.value
+      },
+      set(val) {
+        this.$emit('input', val)
+      },
+    },
+  },
+}
+</script>

locales/de.yml

@@ -366,6 +366,7 @@ account:
   name: Vollständiger Name
   phone: Telefon
   zone: Timezone
+  emailConsent: Ich stimme zu, wesentliche E-Mails von WeDance zu erhalten, einschließlich Veranstaltungsaktualisierungen und Benachrichtigungen. Ich kann mich jederzeit von nicht wesentlichen E-Mails abmelden.
   newsletter:
     label: What kind of updated would you like to receive weekly?
     options:

locales/en.yml

@@ -423,6 +423,8 @@ account:
   name: Full Name
   phone: Phone
   zone: Timezone
+  emailConsent: I agree to receive emails from WeDance. I can unsubscribe from non-essential emails at any time.
+  emailConsentError: Please agree to receive emails to proceed.
   newsletter:
     label: What kind of updated would you like to receive weekly?
     options:

pages/demo/check.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <div class="p-4">
+      <TField component="TCheckbox" :value.sync="data" @input="onInput" />
+      <pre>{{ data }}</pre>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data: () => ({
+    data: '',
+  }),
+  methods: {
+    onInput(val) {
+      this.data = val
+    },
+  },
+}
+</script>

plugins/vue-tailwind.js

@@ -4,11 +4,24 @@ import {
   TRichSelect,
   TRadioGroup,
   TCheckboxGroup,
+  TCheckbox,
   TInput,
   TPagination,
 } from 'vue-tailwind/dist/components'
 
 const settings = {
+  VtCheckbox: {
+    component: TCheckbox,
+    props: {
+      classes: {
+        label: '',
+        input:
+          'h-4 w-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-600',
+        inputWrapper: '',
+        wrapper: '',
+      },
+    },
+  },
   TPagination: {
     component: TPagination,
     props: {

services/firebase/src/index.ts

@@ -22,6 +22,7 @@ import { getFacebookEvent } from './lib/facebook_import'
 import { syncCalendar } from './lib/ical_import'
 import { getSchemaEvent } from './lib/schema_import'
 import { isFacebookEvent } from './lib/linguist'
+import { uniq } from 'lodash'
 
 require('dotenv').config()
 
@@ -610,12 +611,10 @@ export const commentNotification = functions.firestore
         .get()
     ).data()
 
-    if (!post.watch) {
-      return
-    }
-
-    const watchList = post.watch.list
-    const watchUsernames = Object.keys(watchList)
+    const watchUsernames = uniq([
+      ...Object.keys(post?.watch?.list),
+      post?.star.usernames,
+    ])
 
     const recipients: RecipientList = {}
 
@@ -626,32 +625,36 @@ export const commentNotification = functions.firestore
         continue
       }
 
-      if (comment.createdBy === account.id) {
-        continue
-      }
-
       recipients[account.id] = {
         name: username,
         email: account.email,
       }
     }
 
-    const content = `
-**${comment.username} replied:**
+    let content = ''
+
+    if (post.type === 'event') {
+      content = `
+**${comment.username} wrote:**
 
 ${comment.body}
 
-**on post ${post.title || ''}**
+[View event](https://wedance.vip/events/${post.id}#comments)
+`
+    } else {
+      content = `
+**${comment.username} wrote:**
 
-${post.description}
+${comment.body}
 
-[View comment](https://wedance.vip/posts/${post.id}#comment-${commentId})
+[View post](https://wedance.vip/posts/${post.id}#comment-${commentId})
 `
+    }
 
     const email = {
       from: 'WeDance <[email protected]>',
       recipients,
-      subject: 'New comment on post you are watching',
+      subject: post.name || post.title || 'New comment',
       content,
       type: 'commentNotification',
       id: commentId,

use/accounts.js

@@ -43,6 +43,17 @@ export const useAccounts = () => {
       component: 'TRichSelect',
       options: moment.tz.names(),
     },
+    {
+      name: 'emailConsent',
+      label: t('account.emailConsent'),
+      component: 'TCheckbox',
+      register: true,
+      hideLabel: true,
+      validate(value) {
+        return value
+      },
+      validationError: t('account.emailConsentError'),
+    },
   ]
 
   return {

use/auth.js

@@ -476,7 +476,10 @@ export const useAuth = () => {
       ls('username', username)
       ls('place', place)
       ls('gender', gender)
-      await firebase.auth().createUserWithEmailAndPassword(email, password)
+      const firebaseUser = await firebase
+        .auth()
+        .createUserWithEmailAndPassword(email, password)
+      firebaseUser.sendEmailVerification()
     } catch (e) {
       state.error = e
     }

use/profiles.js

@@ -623,8 +623,8 @@ export const useProfiles = () => {
   const profileDetailFields = profileFields.filter((f) => !f.poster)
 
   const registerFields = [
-    ...accountFields.filter((f) => f.register),
     ...profileFields.filter((f) => f.register),
+    ...accountFields.filter((f) => f.register),
   ]
 
   const profileFilters = [