webui: Add a clear history button to the execute SQL page

This adds a button to delete the history of recently executed SQL
commands in the execute SQL page. The history is deleted on the server
and on the client side.

Author: MKleusberg

webui/execute.go

@@ -87,6 +87,43 @@ func executePage(w http.ResponseWriter, r *http.Request) {
 	}
 }
 
+// execClearHistory deletes all items in the user's SQL history
+func execClearHistory(w http.ResponseWriter, r *http.Request) {
+	// Retrieve session data (if any)
+	var loggedInUser string
+	var u interface{}
+	var err error
+	if com.Conf.Environment.Environment == "production" {
+		sess, err := store.Get(r, "dbhub-user")
+		if err != nil {
+			w.WriteHeader(http.StatusBadRequest)
+			return
+		}
+		u = sess.Values["UserName"]
+	} else {
+		u = com.Conf.Environment.UserOverride
+	}
+	if u != nil {
+		loggedInUser = u.(string)
+	}
+
+	// Retrieve user and database info
+	dbOwner, dbName, _, err := com.GetODC(2, r) // 2 = Ignore "/x/execlivesql/" at the start of the URL
+	if err != nil {
+		w.WriteHeader(http.StatusBadRequest)
+		fmt.Fprint(w, err)
+		return
+	}
+
+	// Delete items
+	err = com.LiveSqlHistoryDeleteOld(loggedInUser, dbOwner, dbName, 0)	// 0 means "keep 0 items"
+	if err != nil {
+		w.WriteHeader(http.StatusInternalServerError)
+		fmt.Fprint(w, err)
+		return
+	}
+}
+
 // execLiveSQL executes a user provided SQLite statement on a database.
 func execLiveSQL(w http.ResponseWriter, r *http.Request) {
 	// Retrieve session data (if any)

webui/jsx/sql-terminal.js

@@ -172,6 +172,20 @@ export default function SqlTerminal() {
 		}
 	}
 
+	// Clears the SQL history
+	function clearHistory() {
+		fetch("/x/execclearhistory/" + meta.owner + "/" + meta.database, {
+			method: "post",
+		}).then(response => {
+			if (!response.ok) {
+				return Promise.reject(response);
+			}
+
+			setRecentCommands([]);
+		}).catch(error => {
+		});
+	}
+
 	// This effect makes sure we scroll to the bottom of the command history whenever a new entry is added
 	const performScrolldown = React.useRef(false);
 	React.useEffect(() => {
@@ -224,6 +238,8 @@ export default function SqlTerminal() {
 							<li><a href="#" onClick={() => setExecuteOnEnter(!executeOnEnter)}><input type="checkbox" checked={executeOnEnter ? "checked" : null} /> Execute on Enter</a></li>
 							<li role="separator" className="divider"></li>
 							<li><a href="#" onClick={() => formatSql()} data-cy="formatbtn">Format SQL</a></li>
+							<li role="separator" className="divider"></li>
+							<li><a href="#" onClick={() => clearHistory()} data-cy="clearhistorybtn">Clear history</a></li>
 						</ul>
 					</div>
 				</div>

webui/main.go

@@ -3226,6 +3226,7 @@ func main() {
 	http.Handle("/x/diffcommitlist/", gz.GzipHandler(logReq(diffCommitListHandler)))
 	http.Handle("/x/download/", gz.GzipHandler(logReq(downloadHandler)))
 	http.Handle("/x/downloadcsv/", gz.GzipHandler(logReq(downloadCSVHandler)))
+	http.Handle("/x/execclearhistory/", gz.GzipHandler(logReq(execClearHistory)))
 	http.Handle("/x/execlivesql/", gz.GzipHandler(logReq(execLiveSQL)))
 	http.Handle("/x/execsql/", gz.GzipHandler(logReq(visExecuteSQL)))
 	http.Handle("/x/forkdb/", gz.GzipHandler(logReq(forkDBHandler)))