Fix project deletion bug

Always delete the latest project

app/server/static/bundle/projects.js

@@ -460,7 +460,7 @@ eval("var g;\n\n// This works in non-strict mode\ng = (function() {\n\treturn th
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm.js\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! axios */ \"./node_modules/axios/index.js\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_1__);\n\n\n\naxios__WEBPACK_IMPORTED_MODULE_1___default.a.defaults.xsrfCookieName = 'csrftoken';\naxios__WEBPACK_IMPORTED_MODULE_1___default.a.defaults.xsrfHeaderName = 'X-CSRFToken';\nconst baseUrl = window.location.href.split('/').slice(0, 3).join('/');\n\n\nconst vm = new vue__WEBPACK_IMPORTED_MODULE_0__[\"default\"]({\n  el: '#projects_root',\n  delimiters: ['[[', ']]'],\n  data: {\n    items: [],\n    selectedType: 'All',\n    isActive: false,\n    isDelete: false,\n  },\n\n  methods: {\n    getProjects() {\n      axios__WEBPACK_IMPORTED_MODULE_1___default.a.get(`${baseUrl}/api/projects`).then((response) => {\n        this.items = response.data;\n      });\n    },\n\n    deleteProject(project) {\n      axios__WEBPACK_IMPORTED_MODULE_1___default.a.delete(`${baseUrl}/api/projects/${project.id}/`).then((response) => {\n        this.isDelete = false;\n        const index = this.items.indexOf(project);\n        this.items.splice(index, 1);\n      });\n    },\n\n    updateSelectedType(type) {\n      this.selectedType = type;\n    },\n  },\n\n  computed: {\n    uniqueProjectTypes() {\n      const types = [];\n      for (let i = 0; i < this.items.length; i++) {\n        const item = this.items[i];\n        types.push(item.project_type);\n      }\n      const uniqueTypes = Array.from(new Set(types));\n\n      return uniqueTypes;\n    },\n\n    filteredProjects() {\n      // filter projects\n      const projects = [];\n      for (let i = 0; i < this.items.length; i++) {\n        const item = this.items[i];\n        if ((this.selectedType === 'All') || (item.project_type === this.selectedType)) {\n          projects.push(item);\n        }\n      }\n      // create nested projects\n      const nestedProjects = [];\n      for (let i = 0; i < Math.ceil(projects.length / 3); i++) {\n        const p = projects.slice(i * 3, (i + 1) * 3);\n        nestedProjects.push(p);\n      }\n      return nestedProjects;\n    },\n  },\n\n  created() {\n    this.getProjects();\n  },\n});\n\n\n//# sourceURL=webpack:///./static/js/projects.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm.js\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! axios */ \"./node_modules/axios/index.js\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_1__);\n\n\n\naxios__WEBPACK_IMPORTED_MODULE_1___default.a.defaults.xsrfCookieName = 'csrftoken';\naxios__WEBPACK_IMPORTED_MODULE_1___default.a.defaults.xsrfHeaderName = 'X-CSRFToken';\nconst baseUrl = window.location.href.split('/').slice(0, 3).join('/');\n\n\nconst vm = new vue__WEBPACK_IMPORTED_MODULE_0__[\"default\"]({\n  el: '#projects_root',\n  delimiters: ['[[', ']]'],\n  data: {\n    items: [],\n    selectedType: 'All',\n    isActive: false,\n    isDelete: false,\n    project: null,\n  },\n\n  methods: {\n    getProjects() {\n      axios__WEBPACK_IMPORTED_MODULE_1___default.a.get(`${baseUrl}/api/projects`).then((response) => {\n        this.items = response.data;\n      });\n    },\n\n    deleteProject() {\n      axios__WEBPACK_IMPORTED_MODULE_1___default.a.delete(`${baseUrl}/api/projects/${this.project.id}/`).then((response) => {\n        this.isDelete = false;\n        const index = this.items.indexOf(this.project);\n        this.items.splice(index, 1);\n      });\n    },\n\n    setProject(project) {\n      this.project = project;\n      this.isDelete = true;\n    },\n\n    updateSelectedType(type) {\n      this.selectedType = type;\n    },\n  },\n\n  computed: {\n    uniqueProjectTypes() {\n      const types = [];\n      for (let i = 0; i < this.items.length; i++) {\n        const item = this.items[i];\n        types.push(item.project_type);\n      }\n      const uniqueTypes = Array.from(new Set(types));\n\n      return uniqueTypes;\n    },\n\n    filteredProjects() {\n      // filter projects\n      const projects = [];\n      for (let i = 0; i < this.items.length; i++) {\n        const item = this.items[i];\n        if ((this.selectedType === 'All') || (item.project_type === this.selectedType)) {\n          projects.push(item);\n        }\n      }\n      // create nested projects\n      const nestedProjects = [];\n      for (let i = 0; i < Math.ceil(projects.length / 3); i++) {\n        const p = projects.slice(i * 3, (i + 1) * 3);\n        nestedProjects.push(p);\n      }\n      return nestedProjects;\n    },\n  },\n\n  created() {\n    this.getProjects();\n  },\n});\n\n\n//# sourceURL=webpack:///./static/js/projects.js?");
 
 /***/ })
 

app/server/static/js/projects.js

@@ -14,6 +14,7 @@ const vm = new Vue({
     selectedType: 'All',
     isActive: false,
     isDelete: false,
+    project: null,
   },
 
   methods: {
@@ -23,14 +24,19 @@ const vm = new Vue({
       });
     },
 
-    deleteProject(project) {
-      axios.delete(`${baseUrl}/api/projects/${project.id}/`).then((response) => {
+    deleteProject() {
+      axios.delete(`${baseUrl}/api/projects/${this.project.id}/`).then((response) => {
         this.isDelete = false;
-        const index = this.items.indexOf(project);
+        const index = this.items.indexOf(this.project);
         this.items.splice(index, 1);
       });
     },
 
+    setProject(project) {
+      this.project = project;
+      this.isDelete = true;
+    },
+
     updateSelectedType(type) {
       this.selectedType = type;
     },

app/server/templates/projects.html

@@ -108,14 +108,14 @@
                     Are you sure you want to delete project?
                   </section>
                   <footer class="modal-card-foot pt20 pb20 pr20 pl20 has-background-white-ter">
-                    <button class="button is-danger" @click="deleteProject(project)">Delete</button>
+                    <button class="button is-danger" @click="deleteProject()">Delete</button>
                     <button class="button" @click="isDelete=!isDelete">Cancel</button>
                   </footer>
                 </div>
               </div>
               <div class="card-footer">
                 <a v-bind:href="'/projects/' + project.id + '/docs'" class="card-footer-item">Edit</a>
-                <a href="#1" class="card-footer-item has-text-danger has-text-weight-bold" @click="isDelete=!isDelete">Delete</a>
+                <a href="#1" class="card-footer-item has-text-danger has-text-weight-bold" @click="setProject(project)">Delete</a>
               </div>
               {% endif %}
             </div>