Confirm popups (#135)

* Added confirmation popup for account deletion
(I nearly deleted my account twice, please help me)
Added component for easy adding of new confirmation popups.

* Add confirmation popup for mod deleting

* Add confirmation popup for version & file deletion

* Changed the placeholder to a generic value

pages/dashboard/settings.vue

@@ -1,6 +1,16 @@
 /* eslint-disable vue/attribute-hyphenation */
 <template>
   <DashboardPage>
+    <ConfirmPopup
+      ref="delete_popup"
+      title="Are you sure you want to delete your account?"
+      description="If you proceed, your user and all attached data will be removed from our
+        servers. This cannot be reversed, so be careful!"
+      proceed-label="Delete Account"
+      :confirmation-text="username"
+      :has-to-type="true"
+      @proceed="deleteAccount"
+    />
     <div class="section-header columns">
       <h3 class="column-grow-1">Settings</h3>
       <button class="brand-button column" @click="editProfile">Save</button>
@@ -93,7 +103,7 @@
           will be removed from our servers. This cannot be reversed, so be
           careful!</span
         >
-        <div type="button" class="button" @click="deleteAccount">
+        <div type="button" class="button" @click="showPopup">
           Delete Account
         </div>
       </label>
@@ -123,6 +133,7 @@ export default {
       email: '',
       bio: '',
       token: '',
+      confirm_delete: false,
     }
   },
   methods: {
@@ -192,6 +203,9 @@ export default {
 
       this.$nuxt.$loading.finish()
     },
+    showPopup() {
+      this.$refs.delete_popup.show()
+    },
   },
 }
 </script>