user account deletion route + user model account deletion method + fo…

…rmatting; updated Bulma to 0.7.5
rastenis · Jun 15, 2019 · bbbb990 · bbbb990
1 parent c543de0
commit bbbb990
Show file tree

Hide file tree

Showing 7 changed files with 113 additions and 67 deletions.
diff --git a/assets/css/bulma.min.css b/assets/css/bulma.min.css
diff --git a/assets/css/main.css b/assets/css/main.css
@@ -45,10 +45,6 @@ mainHeader {
   align-self: center;
 }
 
-.textCentered {
-  text-align: center;
-}
-
 .title {
   color: #000;
   font-weight: 300;

diff --git a/pages/login.vue b/pages/login.vue
@@ -1,25 +1,23 @@
 <template>
   <section class="container">
-    <div class="textCentered">
-      <h1 class="title">
-        LOGIN
-      </h1>
+    <div class="has-text-centered">
+      <h1 class="title">LOGIN</h1>
     </div>
     <hr>
     <form action="/login" method="POST">
       <div class="field">
         <label class="label">Email</label>
         <div class="control">
-          <input class="input" type="text" v-model="form.email" placeholder="Email" value="">
+          <input class="input" type="text" v-model="form.email" placeholder="Email" value>
         </div>
       </div>
       <div class="field">
         <label class="label">Password</label>
         <div class="control">
-          <input class="input" type="password" v-model="form.password" placeholder="Password"  value="">
+          <input class="input" type="password" v-model="form.password" placeholder="Password" value>
         </div>
       </div>
-      
+
       <div class="control">
         <input type="button" class="button is-link" @click="login()" value="Log in">
       </div>
@@ -28,7 +26,7 @@
           <img class="ic" src="/i/google.svg">
           <a href="/auth/google" class="icon-adjusted">Log in with Google</a>
         </div>
-         <div class="button" type="link" style="margin-top:1vh;">
+        <div class="button" type="link" style="margin-top:1vh;">
           <img class="ic" src="/i/twitter.svg">
           <a href="/auth/twitter" class="icon-adjusted">Log in with Twitter</a>
         </div>
@@ -37,13 +35,13 @@
   </section>
 </template>
 
-<script> 
+<script>
 import axios from "~/plugins/axios";
 
 export default {
   head() {
     return {
-      title: "Login",
+      title: "Login"
     };
   },
   data() {
@@ -52,8 +50,7 @@ export default {
         email: "",
         password: "",
         error: null
-      },
-      
+      }
     };
   },
   methods: {
@@ -86,6 +83,4 @@ form {
   width: 15vw;
   margin: auto;
 }
-
-
 </style>
diff --git a/pages/profile.vue b/pages/profile.vue
@@ -33,7 +33,7 @@
               value
             >
             <p v-if="form.newPassword.error" class="help is-danger">{{form.newPassword.errorMsg}}</p>
-          </div> 
+          </div>
         </div>
         <div class="field">
           <label class="label">Repeat New Password</label>

diff --git a/pages/register.vue b/pages/register.vue
@@ -1,23 +1,35 @@
 <template>
   <section class="container">
-    <div class="textCentered">
-      <h1 class="title">
-        REGISTER
-      </h1>
+    <div class="has-text-centered">
+      <h1 class="title">REGISTER</h1>
     </div>
     <hr>
     <form action="/register" method="POST">
       <div class="field">
         <label class="label">Email</label>
         <div class="control">
-          <input v-bind:class="getInputStyle('email')" type="email" name="username" v-model="form.email.value" placeholder="Email" value="">
+          <input
+            v-bind:class="getInputStyle('email')"
+            type="email"
+            name="username"
+            v-model="form.email.value"
+            placeholder="Email"
+            value
+          >
           <p v-if="form.email.error" class="help is-danger">{{form.email.errorMsg}}</p>
         </div>
       </div>
       <div class="field">
         <label class="label">Password</label>
         <div class="control">
-          <input v-bind:class="getInputStyle('password')" type="password" placeholder="Password" name="password" v-model="form.password.value" value="">
+          <input
+            v-bind:class="getInputStyle('password')"
+            type="password"
+            placeholder="Password"
+            name="password"
+            v-model="form.password.value"
+            value
+          >
           <p v-if="form.password.error" class="help is-danger">{{form.password.errorMsg}}</p>
         </div>
       </div>
@@ -29,88 +41,96 @@
 </template>
 
 <script>
-import axios from '~/plugins/axios'
+import axios from "~/plugins/axios";
 
 export default {
-  head () {
+  head() {
     return {
-      title: 'Register'
-    }
+      title: "Register"
+    };
   },
-  data(){
+  data() {
     return {
-      form:{
-        email:{
-          error:false,
-          errorMsg:null,
-          value:""
+      form: {
+        email: {
+          error: false,
+          errorMsg: null,
+          value: ""
         },
-        password:{
-          error:false,
-          errorMsg:null,
-          value:""
+        password: {
+          error: false,
+          errorMsg: null,
+          value: ""
         }
       },
-      error:null
+      error: null
     };
-  }, 
-  created(){
+  },
+  created() {
     console.log(this.$store.state);
     if (this.$store.state.user) {
-      this.$router.replace({ path: '/' });
+      this.$router.replace({ path: "/" });
     }
   },
-  methods:{
-    getInputStyle:function getInputStyle(type){
-      let classes="input ";
+  methods: {
+    getInputStyle: function getInputStyle(type) {
+      let classes = "input ";
       if (this.form[type].error) {
         // setting as error
-        classes+="is-danger";
+        classes += "is-danger";
       }
       return classes;
     },
-    resetErrors(){
+    resetErrors() {
       for (const key in this.form) {
-        if (this.form.hasOwnProperty(key) ||typeof this.form[key].error !=="undefined") {
-          this.form[key].error=false;
+        if (
+          this.form.hasOwnProperty(key) ||
+          typeof this.form[key].error !== "undefined"
+        ) {
+          this.form[key].error = false;
         }
       }
     },
     async register() {
       this.resetErrors();
       // simple local checks first
       // basic email check
-      if (!(/\S+@\S+\.\S+/.test(this.form.email.value))) {
-        this.form.email.error=true;
-        this.form.email.errorMsg="Enter a valid email address.";
+      if (!/\S+@\S+\.\S+/.test(this.form.email.value)) {
+        this.form.email.error = true;
+        this.form.email.errorMsg = "Enter a valid email address.";
         return;
-      }else if (this.form.password.value.length<5 || this.form.password.value.length>100) { // arbitrary
-        this.form.password.error=true;
-        this.form.password.errorMsg="Password must be between 5 and a 100 characters.";
+      } else if (
+        this.form.password.value.length < 5 ||
+        this.form.password.value.length > 100
+      ) {
+        // arbitrary
+        this.form.password.error = true;
+        this.form.password.errorMsg =
+          "Password must be between 5 and a 100 characters.";
         return;
       }
 
       // attempting to proceed with the registration
       try {
-        await this.$store.dispatch('register', {
+        await this.$store.dispatch("register", {
           email: this.form.email.value,
           password: this.form.password.value
         });
-        this.form.email.value = '';
-        this.form.password.value = '';
+        this.form.email.value = "";
+        this.form.password.value = "";
         this.error = null;
-        this.msg( 'info', true, "You have successfully created an account!");
-        this.$nuxt._router.push('/');
+        this.msg("info", true, "You have successfully created an account!");
+        this.$nuxt._router.push("/");
       } catch (err) {
-        this.msg( 'error', true,err.meta.msg);
+        this.msg("error", true, err.meta.msg);
       }
     },
-    msg(type,state,msg){
+    msg(type, state, msg) {
       // TODO: clean this call up
-      this.$parent.$parent.$children[1].msgOn(type,true, msg)
+      this.$parent.$parent.$children[1].msgOn(type, true, msg);
     }
-  },
-}
+  }
+};
 </script>
 
 <style scoped>

diff --git a/src/controllers/user.js b/src/controllers/user.js
@@ -176,6 +176,23 @@ class User {
     });
   }
 
+  deleteUser() {
+    return new Promise((resolve, reject) => {
+      db.users.remove(
+        {
+          _id: this.data._id
+        },
+        err => {
+          if (err) {
+            console.error(err);
+            return reject(err);
+          }
+          return resolve();
+        }
+      );
+    });
+  }
+
   comparePassword(candidatePassword, cb) {
     bcrypt.compare(candidatePassword, this.data.password, (err, isMatch) => {
       cb(err, isMatch);

diff --git a/src/server.js b/src/server.js
@@ -313,6 +313,24 @@ app.post("/unlink", (req, res) => {
   });
 });
 
+// route to delete account
+app.post("/deleteAccount", (req, res) => {
+  if (typeof req.user === "undefined") {
+    return;
+  }
+
+  let user = new User(req.user.data);
+
+  user.deleteUser().then(r => {
+    return res.json({
+      meta: {
+        error: false,
+        msg: `You have successfully deleted your account!`
+      }
+    });
+  });
+});
+
 /*
 Sample Passportjs routes
 */
-Original file line number
+Diff line change
@@ Expand Up / @@ -33,7 +33,7 @@ @@
                   value
                 >
                 <p v-if="form.newPassword.error" class="help is-danger">{{form.newPassword.errorMsg}}</p>
-              </div>
+              </div>
             </div>
             <div class="field">
               <label class="label">Repeat New Password</label>
@@ Expand Down @@