From 180ae12f4dee35fd062b344dd2c46fa968536e85 Mon Sep 17 00:00:00 2001
From: Vito Sansevero <vito.sansevero@gmail.com>
Date: Wed, 4 Jun 2025 06:52:04 -0700
Subject: [PATCH 1/2] feat(web): add sort and star hover functionality

---
 web/admin.html | 101 +++++++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 97 insertions(+), 4 deletions(-)

diff --git a/web/admin.html b/web/admin.html
index 55c576a..c62a577 100644
--- a/web/admin.html
+++ b/web/admin.html
@@ -120,7 +120,7 @@
             <div class="px-6 py-4">
                 <div class="max-w-7xl mx-auto">
                     <div class="bg-gradient-to-br from-gray-800 to-gray-850 rounded-xl p-6 border border-gray-700">
-                    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-4 mb-6">
+                    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-6 gap-4 mb-6">
                         <div class="lg:col-span-2">
                             <label class="block text-sm font-medium text-gray-400 mb-2">Search Text</label>
                             <input type="text" id="searchText" placeholder="Search prompt content..." 
@@ -138,6 +138,18 @@
                             <input type="text" id="searchTags" placeholder="tag1, tag2..." 
                                    class="w-full px-4 py-3 bg-gray-700 border border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-gray-100 placeholder-gray-400">
                         </div>
+                        <div>
+                            <label class="block text-sm font-medium text-gray-400 mb-2">Sort By</label>
+                            <select id="sortBy" 
+                                    class="w-full px-4 py-3 bg-gray-700 border border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-gray-100">
+                                <option value="created_desc">Newest First</option>
+                                <option value="created_asc">Oldest First</option>
+                                <option value="rating_desc">Highest Rated</option>
+                                <option value="rating_asc">Lowest Rated</option>
+                                <option value="text_asc">A-Z</option>
+                                <option value="text_desc">Z-A</option>
+                            </select>
+                        </div>
                         <div class="flex items-end">
                             <button id="searchBtn" 
                                     class="w-full bg-gradient-to-r from-blue-600 to-purple-600 hover:from-blue-700 hover:to-purple-700 text-white font-medium py-3 px-6 rounded-lg transition-all duration-200 flex items-center justify-center space-x-2">
@@ -919,6 +931,9 @@
                 ["searchCategory"].forEach((id) => {
                     document.getElementById(id).addEventListener("change", () => this.search());
                 });
+                
+                // Sort dropdown change
+                document.getElementById("sortBy").addEventListener("change", () => this.renderPrompts());
             }
 
             bindModalEvents() {
@@ -1162,6 +1177,38 @@
                 }
             }
 
+            sortPrompts(prompts) {
+                const sortBy = document.getElementById("sortBy")?.value || "created_desc";
+                const [field, direction] = sortBy.split("_");
+                
+                return [...prompts].sort((a, b) => {
+                    let aVal, bVal;
+                    
+                    switch (field) {
+                        case "rating":
+                            aVal = a.rating || 0;
+                            bVal = b.rating || 0;
+                            break;
+                        case "created":
+                            aVal = new Date(a.created_at);
+                            bVal = new Date(b.created_at);
+                            break;
+                        case "text":
+                            aVal = a.text.toLowerCase();
+                            bVal = b.text.toLowerCase();
+                            break;
+                        default:
+                            return 0;
+                    }
+                    
+                    if (direction === "asc") {
+                        return aVal > bVal ? 1 : aVal < bVal ? -1 : 0;
+                    } else {
+                        return aVal < bVal ? 1 : aVal > bVal ? -1 : 0;
+                    }
+                });
+            }
+
             renderPrompts() {
                 const container = document.getElementById("resultsList");
                 const count = document.getElementById("resultsCount");
@@ -1181,9 +1228,16 @@
                     return;
                 }
 
-                container.innerHTML = this.prompts.map((prompt) => this.renderPromptItem(prompt)).join("");
+                // Sort prompts before rendering
+                const sortedPrompts = this.sortPrompts(this.prompts);
+                container.innerHTML = sortedPrompts.map((prompt) => this.renderPromptItem(prompt)).join("");
                 this.selectedPrompts.clear();
                 this.updateBulkActionButtons();
+                
+                // Add hover behavior to all star ratings
+                sortedPrompts.forEach(prompt => {
+                    this.addStarHoverBehavior(prompt.id);
+                });
             }
 
             renderPromptItem(prompt) {
@@ -1259,11 +1313,48 @@
                     const starNum = i + 1;
                     const isActive = starNum <= rating;
                     console.log(`Star ${starNum}: ${isActive ? 'active' : 'inactive'}`);
-                    const color = isActive ? '#fbbf24' : '#6b7280'; // yellow-400 : gray-500
-                    return `<button style="font-size: 1.125rem; color: ${color}; background: none; border: none; cursor: pointer; transition: color 0.2s;" onmouseover="this.style.color='#fcd34d'" onmouseout="this.style.color='${color}'" onclick="window.admin.setRating(${promptId}, ${starNum})">⭐</button>`;
+                    const starIcon = isActive ? '⭐' : '☆'; // filled star vs outline star
+                    const color = isActive ? '#fbbf24' : '#9ca3af'; // yellow-400 : gray-400
+                    return `<button class="star-btn" data-star="${starNum}" data-prompt-id="${promptId}" style="font-size: 1.125rem; color: ${color}; background: none; border: none; cursor: pointer; transition: all 0.2s;" onclick="window.admin.setRating(${promptId}, ${starNum})">${starIcon}</button>`;
                 }).join("");
             }
 
+            addStarHoverBehavior(promptId) {
+                const starButtons = document.querySelectorAll(`[data-prompt-id="${promptId}"].star-btn`);
+                const ratingElement = document.querySelector(`[data-id="${promptId}"][data-rating]`);
+                const currentRating = parseInt(ratingElement?.dataset.rating || 0);
+
+                starButtons.forEach((starBtn, index) => {
+                    const starNum = index + 1;
+                    
+                    starBtn.addEventListener('mouseenter', () => {
+                        // Light up all stars up to this one on hover
+                        starButtons.forEach((btn, i) => {
+                            if (i < starNum) {
+                                btn.textContent = '⭐';
+                                btn.style.color = '#fcd34d'; // bright yellow on hover
+                            } else {
+                                btn.textContent = '☆';
+                                btn.style.color = '#9ca3af'; // gray
+                            }
+                        });
+                    });
+                    
+                    starBtn.addEventListener('mouseleave', () => {
+                        // Reset to current rating
+                        starButtons.forEach((btn, i) => {
+                            if (i < currentRating) {
+                                btn.textContent = '⭐';
+                                btn.style.color = '#fbbf24'; // yellow
+                            } else {
+                                btn.textContent = '☆';
+                                btn.style.color = '#9ca3af'; // gray
+                            }
+                        });
+                    });
+                });
+            }
+
             escapeHtml(text) {
                 const div = document.createElement("div");
                 div.textContent = text;
@@ -1376,6 +1467,8 @@
                 if (ratingElement) {
                     ratingElement.dataset.rating = rating;
                     ratingElement.innerHTML = this.renderStars(rating, promptId);
+                    // Add hover behavior to new stars
+                    this.addStarHoverBehavior(promptId);
                 }
 
                 try {

From b7649754bd6309c33a249975c887893aa51486f6 Mon Sep 17 00:00:00 2001
From: Vito Sansevero <vito.sansevero@gmail.com>
Date: Wed, 4 Jun 2025 06:53:19 -0700
Subject: [PATCH 2/2] chore: bump version to 3.0.3 in pyproject.toml

---
 pyproject.toml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pyproject.toml b/pyproject.toml
index a2fe09a..57ea585 100644
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -1,7 +1,7 @@
 [project]
 name = "promptmanager"
 description = "A powerful ComfyUI custom node that extends the standard text encoder with persistent prompt storage, advanced search capabilities, and an automatic image gallery system using SQLite."
-version = "3.0.2"
+version = "3.0.3"
 license = {file = "LICENSE"}
 dependencies = ["# Core dependencies for PromptManager", "# Note: Most dependencies are already included with ComfyUI", "# Already included with Python standard library:", "# - sqlite3", "# - hashlib", "# - json", "# - datetime", "# - os", "# - typing", "# - threading", "# - uuid", "# Required for gallery functionality:", "watchdog>=2.1.0              # For file system monitoring", "Pillow>=8.0.0                # For image metadata extraction (usually included with ComfyUI)", "# Optional dependencies for enhanced search functionality:", "# fuzzywuzzy[speedup]>=0.18.0  # For fuzzy string matching (optional)", "# sqlalchemy>=1.4.0            # For advanced ORM features (optional)", "# Development dependencies (optional):", "# pytest>=6.0.0                # For running tests", "# black>=22.0.0                # For code formatting", "# flake8>=4.0.0                # For linting", "# mypy>=0.910                   # For type checking"]