feat(devstar home): delete dev container by repo id

test/home.html

@@ -536,7 +536,9 @@ header("Allow: GET, POST, OPTIONS, PUT, DELETE");
                 
                     cell1.textContent = repoFullName;
                     cell2.textContent = repoURL;
-                    cell3.innerHTML = `<button onclick="openProject('${repoID}')">Open Project</button>`; 
+                    cell3.innerHTML = `<button onclick="openProject('${repoID}')">Open Project</button>
+                    <button onclick="deleteDevContainer('${repoID}')">Delete</button>
+                    `; 
 
                 });
             })
@@ -777,8 +779,32 @@ header("Allow: GET, POST, OPTIONS, PUT, DELETE");
 
         // TODO: delete container
         function deleteDevContainer(repoId) {
-            return new Promise((resolve, reject) => {
+            var url = DEVSTAR_HOME + "/api/devcontainer"  
+            var token = USERTOKEN
 
+            const queryParams = new URLSearchParams({
+                repoId: repoId,
+            }).toString();
+            const urlWithParams = `${url}?${queryParams}`;
+
+            fetch(urlWithParams, {
+                method: 'DELETE',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'Authorization': 'token ' + token 
+                },
+            })
+            .then(response => {
+                if (!response.ok) {
+                    throw new Error('Network response was not ok when DELETEING devContainer by repoId' + response.statusText);
+                }
+                return response.json();
+            })
+            .then(data => {
+                console.log('Successfully delete dev container belong to repoId:', repoId, data)
+            })
+            .catch(error => {
+                console.error(`Failed to delete dev container belong to repoId: ${repoId}`)
             })
         }