Merge pull request #75 from LlamaEnjoyer/model_search_and_add_tweaks

feat: Improve model search and add debouncing

Author: turboderp

server.py

@@ -498,7 +498,8 @@ def api_reset_to_app_defaults():
             sampling_params = [
                 "temperature", "top_k", "top_p", "min_p", "tfs",
                 "mirostat", "mirostat_tau", "mirostat_eta", "typical",
-                "repp", "repr", "repd", "quad_sampling", "temperature_last", "skew"
+                "repp", "repr", "repd", "quad_sampling", "temperature_last", "skew",
+                "dry_base", "dry_multiplier", "dry_range"
             ]
 
             # Reset only sampling parameters to defaults

static/chatsettings.js

@@ -138,7 +138,10 @@ export class SessionSettings {
             mirostat: this.sss_i_mirostat.element,
             mirostat_tau: this.sss_i_mirostat_tau.element.querySelector(".sss-item-left"),
             mirostat_eta: this.sss_i_mirostat_eta.element.querySelector(".sss-item-left"),
-            temperature_last: this.sss_i_temperature_last.element
+            temperature_last: this.sss_i_temperature_last.element,
+            dry_base: this.sss_i_dry_base.element.querySelector(".sss-item-left"),
+            dry_multiplier: this.sss_i_dry_multiplier.element.querySelector(".sss-item-left"),
+            dry_range: this.sss_i_dry_range.element.querySelector(".sss-item-left")
         };
 
         // Helper function to toggle label highlights
@@ -193,7 +196,8 @@ export class SessionSettings {
                 const samplingParams = [
                     "temperature", "top_k", "top_p", "min_p", "tfs",
                     "mirostat", "mirostat_tau", "mirostat_eta", "typical",
-                    "repp", "repr", "quad_sampling", "temperature_last", "skew"
+                    "repp", "repr", "quad_sampling", "temperature_last", "skew",
+                    "dry_base", "dry_multiplier", "dry_range"
                 ];
 
                 const diffParams = {};
@@ -255,7 +259,8 @@ export class SessionSettings {
             this.sss_i_minP, this.sss_i_quadSampling, this.sss_i_tfs,
             this.sss_i_typical, this.sss_i_skew, this.sss_i_repPenalty,
             this.sss_i_repRange, this.sss_i_mirostat, this.sss_i_mirostat_tau,
-            this.sss_i_mirostat_eta, this.sss_i_temperature_last
+            this.sss_i_mirostat_eta, this.sss_i_temperature_last,
+            this.sss_i_dry_base, this.sss_i_dry_multiplier, this.sss_i_dry_range
         ];
 
         // Helper function to update button states

static/models.css

@@ -11,12 +11,16 @@
 }
 
 .model-search-box {
-    flex-grow: 1;
+    width: 215px;
+    min-width: 215px;
     background-color: var(--textbox-background);
     color: var(--textcolor-text);
     border-radius: 5px;
     border: 1px solid var(--textbox-border);
-    padding: 5px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    padding-left: 5px;
+    padding-right: 25px; /* Space for clear button */
     font-size: var(--font-size-medium);
 }
 

static/models.js

@@ -52,10 +52,10 @@ export class Models {
             this.searchBox.tb.value = "";
             this.populateModelList();
         });
-        this.searchBox.tb.addEventListener("input", () => {
+        this.searchBox.tb.addEventListener("input", util.debounce(() => {
             this.searchState = this.searchBox.tb.value;
             this.populateModelList();
-        });
+        }, 400)); // delay in ms
         this.searchBox.tb.addEventListener("keydown", () => {
             if (event.key === 'Escape' || event.keyCode === 27) {
                 this.searchState = this.textbox_initial;
@@ -191,6 +191,14 @@ export class ModelView {
         this.error_message = "";
     }
 
+    getFolderName(path) {
+        if (!path) return null;
+        // Remove trailing slash if present
+        path = path.replace(/[/\\]$/, '');
+        // Get the last part of the path (the folder name)
+        return path.split(/[/\\]/).pop();
+    }
+
     updateView() {
         if (!this.modelID || this.modelID == "new") {
             let model_info = {};
@@ -218,6 +226,12 @@ export class ModelView {
     send(post = null) {
         let packet = {};
         packet.model_info = this.modelInfo;
+        if (this.modelID == "new") {
+            let folderName = this.getFolderName(this.modelInfo.model_directory);
+            if (folderName) {
+                this.modelInfo.name = folderName;
+            }
+        }
         fetch("/api/update_model", { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify(packet) })
         .then(response => response.json())
         .then(response => {
@@ -346,7 +360,15 @@ export class ModelView {
         this.element.appendChild(util.newDiv(null, "model-view-text divider", ""));
         this.element.appendChild(util.newDiv(null, "model-view-text spacer", ""));
 
-        this.tb_model_directory = new controls.LabelTextbox("model-view-item-left", "Model directory", "model-view-item-textbox wide", "~/models/my_model/", this.modelInfo, "model_directory", null, () => { this.send() } );
+        this.tb_model_directory = new controls.LabelTextbox("model-view-item-left", "Model directory", "model-view-item-textbox wide", "~/models/my_model/", this.modelInfo, "model_directory", null, () => {
+            if (this.modelID == "new") {
+                let folderName = this.getFolderName(this.modelInfo.model_directory);
+                if (folderName) {
+                    this.modelInfo.name = folderName;
+                }
+            }
+            this.send();
+        });
         this.element.appendChild(this.tb_model_directory.element);
 
         this.element_model = util.newHFlex();

static/util.js

@@ -1,4 +1,3 @@
-
 export function assert(condition, message) {
     if (!condition) {
         throw new Error(message || "Assertion failed");
@@ -209,3 +208,13 @@ export function saveStringDialog(textString, filename) {
     document.body.removeChild(downloadLink);
     URL.revokeObjectURL(textUrl);
 }
+
+export function debounce(func, delay) {
+  let timeoutId;
+  return function(...args) {
+    clearTimeout(timeoutId);
+    timeoutId = setTimeout(() => {
+      func.apply(this, args);
+    }, delay);
+  };
+}