Show list of databases and allow switching by clicking on current database name

pkg/api/api.go

@@ -127,6 +127,9 @@ func SwitchDb(c *gin.Context) {
 	}
 
 	name := c.Request.URL.Query().Get("db")
+	if name == "" {
+		name = c.Request.FormValue("db")
+	}
 	if name == "" {
 		c.JSON(400, Error{"Database name is not provided"})
 		return
@@ -168,6 +171,8 @@ func SwitchDb(c *gin.Context) {
 		}
 	}
 
+	conn.Close()
+
 	c.JSON(200, info.Format()[0])
 }
 

static/index.html

@@ -241,5 +241,11 @@
       <li><a href="#" data-action="delete">Delete table</a></li>
     </ul>
   </div>
+  <div id="databases_context_menu">
+    <ul class="dropdown-menu" role="menu">
+      <li><a href="#">Database A</a></li>
+      <li><a href="#">Database B</a></li>
+    </ul>
+  </div>
 </body>
 </html>

static/js/app.js

@@ -744,6 +744,20 @@ function bindContextMenus() {
       }
     });
   });
+
+  $("#current_database").contextmenu({
+    target: "#databases_context_menu",
+    onItem: function(context, e) {
+      var name = $(e.target).text();
+      apiCall("post", "/switchdb", { db: name }, function(resp) {
+        if (resp.error) {
+          alert(resp.error);
+          return;
+        }
+        window.location.reload();
+      });
+    }
+  });
 }
 
 $(document).ready(function() {
@@ -929,6 +943,16 @@ $(document).ready(function() {
     }
   });
 
+  $("#current_database").on("click", function(e) {
+    apiCall("get", "/databases", {}, function(resp) {
+      $("#databases_context_menu > ul > li").remove();
+      resp.forEach(function(name) {
+        $("<li><a href='#'>" + name + "</a></li>").appendTo("#databases_context_menu > ul");
+      });
+      $("#current_database").triggerHandler("contextmenu");
+    });
+  });
+
   $("#edit_connection").on("click", function() {
     if (connected) {
       $("#close_connection_window").show();