Added logic to truncate the file and folder name to 30 characters.

js/textUploadWidget.js

@@ -3,13 +3,13 @@ import { app } from "../../scripts/app.js";
 // This is the "correct" way to add frontend logic
 app.registerExtension({
 	name: "Rathius.TextUploader", // Unique name for our extension
-	
+
 	async beforeRegisterNodeDef(nodeType, nodeData, app) {
 		// This runs for every node *before* it's added
-		
+
 		// Check if this is our node by its Python class name
 		if (nodeData.name === "LoadTextFile_Rathius") {
-			
+
 			// This function will be called *after* the node is created on the canvas
 			const onNodeCreated = nodeType.prototype.onNodeCreated;
 			nodeType.prototype.onNodeCreated = function () {
@@ -23,7 +23,7 @@ app.registerExtension({
 				fileInput.type = "file";
 				fileInput.accept = "text/plain,.txt";
 				fileInput.style.display = "none";
-				
+
 				// Create the button widget
 				const uploadButton = this.addWidget("button", "Choose .txt File", "None", () => {
 					fileInput.click(); // Open the file picker when clicked
@@ -40,15 +40,15 @@ app.registerExtension({
 				// Create the upload function
 				const uploadFile = async (file) => {
 					const body = new FormData();
-					
+
 					// 'input' is the default folder, but we can specify a subfolder
-					body.append("subfolder", "text_prompts"); 
+					body.append("subfolder", "text_prompts");
 					body.append("overwrite", "true"); // Overwrite existing files
 					// The server's /upload/image endpoint handles *any* file
-					body.append("image", file, file.name); 
+					body.append("image", file, file.name);
 
 					uploadButton.name = "Uploading...";
-					
+
 					try {
 						// Send the file to the server
 						const response = await fetch("/upload/image", {
@@ -60,9 +60,21 @@ app.registerExtension({
 							const data = await response.json();
 							// Set the value of the *original* (hidden) widget
 							// This is what Python will receive
-							const filePath = data.name; // e.g., "text_prompts/my_prompt.txt"
+							let filePath = data.name;
+							if (data.subfolder) {
+								filePath = data.subfolder + "/" + filePath;
+							}
+
+							filePath = filePath.replace(/\\/g, "/"); // e.g., "text_prompts/my_prompt.txt"
 							widget.value = filePath;
-							uploadButton.name = `Loaded: ${filePath}`;
+
+							// Truncate for display if too long
+							let displayName = filePath;
+							if (displayName.length > 30) {
+								displayName = displayName.substring(0, 20) + "..." + displayName.substring(displayName.length - 10);
+							}
+
+							uploadButton.name = `Loaded: ${displayName}`;
 						} else {
 							alert(response.status + " - " + response.statusText);
 							uploadButton.name = "Choose .txt File";
@@ -72,10 +84,10 @@ app.registerExtension({
 						uploadButton.name = "Choose .txt File";
 					}
 				};
-				
+
 				// Add the hidden file input to the document
 				document.body.appendChild(fileInput);
-				
+
 				// Hide the original string widget
 				widget.type = "hidden"; // We don't want to see the text box
 				widget.serialize = true; // We *do* want to save its value