feat: add type selector and limit results based on set type

src/templates/index.html

@@ -14,6 +14,7 @@
         <input type="text" id="searchInput" placeholder="Search..." />
         <div class="selectors">
             <div class="autocomplete">
+
                 <input type="text" id="genreInput" placeholder="Select genres..." readonly
                     oninput="filterSuggestions('genre')" onclick="showDropdown('genre')">
                 <button onclick="resetGenres()" class="reset">Reset</button>
@@ -30,6 +31,14 @@
                     <!-- Tag suggestions will be dynamically populated here -->
                 </div>
             </div>
+            <div class="type-select">
+                <label for="typeSelect">Type:</label>
+                <select id="typeSelect">
+                    <option value="ALL">All</option>
+                    <option value="MANGA">Manga</option>
+                    <option value="NOVEL">Novel</option>
+                </select>
+            </div>
         </div>
         <button onclick="performSearch()">Search</button>
         <div style="margin-bottom: 1em;">
@@ -256,13 +265,14 @@
             const searchTerm = document.getElementById("searchInput").value.trim();
             const selectedGenres = document.getElementById("genreInput").value.split(',').map(v => v.trim()).filter(v => v);
             const selectedTags = document.getElementById("tagInput").value.split(',').map(v => v.trim()).filter(v => v);
-
-
+            const selectedType = document.getElementById("typeSelect").value;
 
             const query = {
                 query: searchTerm,
                 genres: selectedGenres,
-                tags: selectedTags
+                tags: selectedTags,
+                type: selectedType // Include the selected type in the query
+                
             };
 
             const loadingElement = document.getElementById("loading");