Add delete user function, fix profile loading

server/routes/auth.js

@@ -14,7 +14,7 @@ router.get('/auth', function (req, res) {
   }
 })
 
-router.get('/logout', function (req, res, next) {
+router.get('/logout', function (req, res) {
   req.logout()
   res.sendStatus(200)
 })

server/routes/profiles.js

@@ -2,13 +2,11 @@ const express = require('express')
 const db = require('../db')
 const router = express.Router()
 
-router.post('/profiles', function (req, res, next) {
+router.post('/profiles', function (req, res) {
   if (!req.user) {
     return res.sendStatus(401)
   }
 
-  console.log(req.body)
-
   db.run(`INSERT INTO profiles (
     name,
     user,
@@ -46,7 +44,6 @@ router.post('/profiles', function (req, res, next) {
   ],
   function (err) {
     if (err) {
-      console.log(err)
       return res.sendStatus(500)
     }
 
@@ -55,52 +52,37 @@ router.post('/profiles', function (req, res, next) {
   )
 })
 
-router.get('/profiles', function (req, res, next) {
+router.get('/profiles', function (req, res) {
   if (!req.user) {
     return res.sendStatus(401)
   }
 
   const profiles = []
 
-  db.all('SELECT name FROM profiles WHERE user = ?', [req.user.id], (err, rows) => {
+  db.all('SELECT id, name FROM profiles WHERE user = ?', [req.user.id], (err, rows) => {
     if (err) {
-      console.log('Error getting profiles')
-      console.log(err)
       return res.sendStatus(500)
     }
 
     rows.forEach((row) => {
-      profiles.push(row.name)
+      const profile = {}
-      console.log(row.name)
+
+      profile.id = row.id
+      profile.text = row.name
+
+      profiles.push(profile)
     })
 
-    console.log('PROFILES: ')
     res.json({ profiles: profiles })
   })
 })
 
-router.get('/profiles/:profileId', function (req, res, next) {
+router.get('/profiles/:profileId', function (req, res) {
   if (!req.user) {
     return res.sendStatus(401)
   }
 
-  // TODO: I'm guessing there's a better way to marshal this data
+  const profile = {}
-  const profile = {
-    name: null,
-    isTimerEnabled: null,
-    duration: null,
-    volume: null,
-    noiseColor: null,
-    isFilterEnabled: null,
-    filterType: null,
-    isLFOFilterCutoffEnabled: null,
-    lfoFilterCutoffFrequency: null,
-    lfoFilterCutoffLow: null,
-    lfoFilterCutoffHigh: null,
-    isTremoloEnabled: null,
-    tremoloFrequency: null,
-    tremoloDepth: null
-  }
 
   db.get(`SELECT
     name,
@@ -120,11 +102,10 @@ router.get('/profiles/:profileId', function (req, res, next) {
     tremolo_depth as tremoloDepth
     FROM profiles WHERE id = ?`, [req.params.profileId], (err, row) => {
     if (err) {
-      console.log('Error getting profile')
-      console.log(err)
       return res.sendStatus(500)
     }
 
+    // TODO: Should return 'true' or 'false' rather than 1 or 0 for bool values
     profile.name = row.name
     profile.isTimerEnabled = row.isTimerEnabled
     profile.duration = row.duration
@@ -140,7 +121,6 @@ router.get('/profiles/:profileId', function (req, res, next) {
     profile.tremoloFrequency = row.tremoloFrequency
     profile.tremoloDepth = row.tremoloDepth
 
-    console.log('PROFILES: ')
     res.json({ profile: profile })
   })
 })

server/routes/users.js

@@ -3,28 +3,22 @@ const crypto = require('crypto')
 const db = require('../db')
 const router = express.Router()
 
-router.get('/users', function (req, res, next) {
+router.get('/users', function (req, res) {
   if (!req.user) {
     return res.sendStatus(401)
   }
 
-  // TODO: I'm guessing there's a better way to marshal this data
   const users = []
 
-  db.all('SELECT username, name, is_admin as isAdmin FROM users', (err, rows) => {
+  db.all('SELECT id, username, name, is_admin as isAdmin FROM users', (err, rows) => {
     if (err) {
-      console.log('Error getting profiles')
-      console.log(err)
       return res.sendStatus(500)
     }
 
     rows.forEach((row) => {
-      const user = {
+      const user = {}
-        username: null,
-        name: null,
-        isAdmin: null
-      }
 
+      user.id = row.id
       user.username = row.username
       user.name = row.name
       user.isAdmin = row.isAdmin === 1
@@ -36,11 +30,10 @@ router.get('/users', function (req, res, next) {
   })
 })
 
-router.post('/users', function (req, res, next) {
+router.post('/users', function (req, res) {
   const salt = crypto.randomBytes(16)
   crypto.pbkdf2(req.body.password, salt, 10000, 32, 'sha256', function (err, hashedPassword) {
     if (err) {
-      console.log(err)
       res.sendStatus(500)
     }
 
@@ -52,7 +45,6 @@ router.post('/users', function (req, res, next) {
       req.body.isAdmin
     ], function (err) {
       if (err) {
-        console.log(err)
         res.sendStatus(500)
       }
 
@@ -63,7 +55,6 @@ router.post('/users', function (req, res, next) {
       }
       req.login(user, function (err) {
         if (err) {
-          console.log(err)
           res.sendStatus(500)
         }
       })
@@ -72,19 +63,49 @@ router.post('/users', function (req, res, next) {
   res.sendStatus(200)
 })
 
-router.put('/users', function (req, res, next) {
+router.patch('/users/:userId', function (req, res) {
   if (!req.user) {
     return res.sendStatus(401)
   }
 
-  db.run('UPDATE users SET is_admin = ? WHERE username = ?', [req.body.isAdmin, req.body.username], (err) => {
+  db.get('SELECT is_admin FROM users WHERE id = ?', [req.user.id], (err, row) => {
     if (err) {
-      console.log('Error getting profiles')
-      console.log(err)
       return res.sendStatus(500)
     }
 
-    console.log(`Row(s) updated: ${this.changes}`)
+    if (row.is_admin === 0) {
+      return res.sendStatus(401)
+    }
+
+    db.run('UPDATE users SET is_admin = ? WHERE id = ?', [req.body.isAdmin, req.params.userId], (err) => {
+      if (err) {
+        return res.sendStatus(500)
+      }
+    })
+  })
+
+  res.sendStatus(200)
+})
+
+router.delete('/users/:userId', function (req, res) {
+  if (!req.user) {
+    return res.sendStatus(401)
+  }
+
+  db.get('SELECT is_admin FROM users WHERE id = ?', [req.user.id], (err, row) => {
+    if (err) {
+      return res.sendStatus(500)
+    }
+
+    if (row.is_admin === 0) {
+      return res.sendStatus(401)
+    }
+
+    db.run('DELETE FROM users WHERE id = ?', [req.params.userId], (err) => {
+      if (err) {
+        return res.sendStatus(500)
+      }
+    })
   })
 
   res.sendStatus(200)

src/components/Admin.vue

@@ -10,6 +10,9 @@
       <v-simple-table>
         <thead>
           <tr>
+            <th class="text-left">
+              ID
+            </th>
             <th class="text-left">
               Username
             </th>
@@ -26,17 +29,18 @@
             v-for="user in users"
             :key="user.username"
           >
+            <td>{{ user.id }}</td>
             <td>{{ user.username }}</td>
             <td>
               <v-switch
                 v-model="user.isAdmin"
                 :label="`${user.isAdmin ? 'True' : 'False'}`"
-                @change="updateUser(user.username, user.isAdmin); snackbar = true"
+                @change="updateUser(user.id, user.isAdmin); snackbar = true"
               />
             </td>
             <td>
               <v-btn
-                @click="updateUser(user.username)"
+                @click="deleteUser(user.id)"
               >
                 Delete
               </v-btn>
@@ -88,14 +92,12 @@ export default {
           console.error(error.response)
         })
     },
-    updateUser (username, isAdmin) {
+    updateUser (id, isAdmin) {
-      this.$http.put('https://localhost:3000/users', {
+      this.$http.patch('https://localhost:3000/users/'.concat(id), {
-        username: username,
         isAdmin: isAdmin ? 1 : 0
       })
         .then(response => {
           if (response.status === 200) {
-            console.log('User updated')
             this.updateText = 'User updated'
           }
         })
@@ -103,6 +105,17 @@ export default {
           console.error(error.response)
           this.updateText = 'Error updating user'
         })
+    },
+    deleteUser (id) {
+      this.$http.delete('https://localhost:3000/users/'.concat(id))
+        .then(response => {
+          if (response.status === 200) {
+            this.getUsers()
+          }
+        })
+        .catch(function (error) {
+          console.error(error.response)
+        })
     }
   }
 }

src/components/AppBar.vue

@@ -2,7 +2,7 @@
   <v-container>
     <v-app-bar
       app
-      color="secondary"
+      color="primary"
       dark
       dense
     >

src/components/Noise.vue

@@ -25,9 +25,9 @@
           <v-select
             v-model="selectedProfile"
             :items="profileItems"
+            return-object
             label="Profiles"
             class="mx-3"
-            @click="populateProfileItems"
           />
 
           <v-btn

src/components/noise.js

@@ -4,8 +4,8 @@ export default {
   name: 'Noise',
 
   data: () => ({
-    selectedProfile: '',
+    selectedProfile: {},
-    profileItems: [''],
+    profileItems: [],
     profileDialog: false,
     profileName: '',
     playDisabled: false,
@@ -33,6 +33,7 @@ export default {
     this.filter = new Filter()
     this.tremolo = new Tremolo()
     this.lfo = new LFO()
+    this.populateProfileItems()
   },
   methods: {
     play () {
@@ -159,20 +160,16 @@ export default {
         isTremoloEnabled: this.isTremoloEnabled ? 1 : 0,
         tremoloFrequency: this.tremoloFrequency,
         tremoloDepth: this.tremoloDepth
-      })
-        .then(response => {
-          if (response.status === 200) {
-            console.log('Profile saved')
-          }
       })
         .catch(function (error) {
           console.error(error.response)
         })
 
       this.profileDialog = false
+      this.populateProfileItems()
     },
     loadProfile () {
-      this.$http.get('https://localhost:3000/profiles/'.concat(this.profileItems.indexOf(this.selectedProfile) + 1))
+      this.$http.get('https://localhost:3000/profiles/'.concat(this.selectedProfile.id))
         .then(response => {
           if (response.status === 200) {
             const profile = response.data.profile
@@ -188,7 +185,7 @@ export default {
             this.lfoFilterCutoffFrequency = profile.lfoFilterCutoffFrequency
             this.lfoFilterCutoffRange[0] = profile.lfoFilterCutoffLow
             this.lfoFilterCutoffRange[1] = profile.lfoFilterCutoffHigh
-            this.isTremoloEnabled = profile.isTimerEnabled === 1
+            this.isTremoloEnabled = profile.isTremoloEnabled === 1
             this.tremoloFrequency = profile.tremoloFrequency
             this.tremoloDepth = profile.tremoloDepth
           }