Awesome/awesome-copilot
1
0
Fork 0
mirror of https://github.com/github/awesome-copilot.git synced 2026-02-24 04:15:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(website): use Choices.js wrapper for samples tag filter

Browse Source 
Use the same createChoices/getChoicesValues helpers as other pages
for consistent multi-select behavior.
This commit is contained in:
Aaron Powell
2026-02-02 15:14:45 +11:00
parent b8d93a0344
commit 9eab4ec6e7
2 changed files with 21 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
website/public/data/manifest.json
View File

@@ -1,5 +1,5 @@
{ {
"generated": "2026-02-02T04:05:33.889Z", "generated": "2026-02-02T04:12:40.822Z",
"counts": { "counts": {
"agents": 145, "agents": 145,
"prompts": 138, "prompts": 138,

63
website/src/scripts/pages/samples.ts
View File

@@ -3,7 +3,8 @@
*/ */
import { FuzzySearch, type SearchableItem } from '../search'; import { FuzzySearch, type SearchableItem } from '../search';
import { fetchData, fetchFileContent, escapeHtml } from '../utils'; import { fetchData, escapeHtml } from '../utils';
import { createChoices, getChoicesValues, type Choices } from '../choices';
// Types // Types
interface Language { interface Language {
@@ -52,6 +53,7 @@ let search: FuzzySearch<Recipe & { title: string; cookbookId: string }> | null =
let selectedLanguage: string | null = null; let selectedLanguage: string | null = null;
let selectedTags: string[] = []; let selectedTags: string[] = [];
let expandedRecipes: Set<string> = new Set(); let expandedRecipes: Set<string> = new Set();
let tagChoices: Choices | null = null;
/** /**
* Initialize the samples page * Initialize the samples page
@@ -135,41 +137,23 @@ function setupFilters(): void {
}); });
} }
// Tag filter (multi-select with Choices.js if available) // Tag filter (multi-select with Choices.js)
const tagSelect = document.getElementById('filter-tag') as HTMLSelectElement; const tagSelect = document.getElementById('filter-tag') as HTMLSelectElement;
if (tagSelect && samplesData.filters.tags.length > 0) { if (tagSelect && samplesData.filters.tags.length > 0) {
tagSelect.innerHTML = ''; // Initialize Choices.js
samplesData.filters.tags.forEach(tag => { tagChoices = createChoices('#filter-tag', { placeholderValue: 'All Tags' });
const option = document.createElement('option'); tagChoices.setChoices(
option.value = tag; samplesData.filters.tags.map(tag => ({ value: tag, label: tag })),
option.textContent = tag; 'value',
tagSelect.appendChild(option); 'label',
true
);
tagSelect.addEventListener('change', () => {
selectedTags = getChoicesValues(tagChoices!);
renderCookbooks();
updateResultsCount();
}); });
// Initialize Choices.js if available
if (typeof window !== 'undefined' && (window as any).Choices) {
const choices = new (window as any).Choices(tagSelect, {
removeItemButton: true,
placeholder: true,
placeholderValue: 'Filter by tags...',
searchPlaceholderValue: 'Search tags...',
noResultsText: 'No tags found',
noChoicesText: 'No tags available',
});
tagSelect.addEventListener('change', () => {
selectedTags = choices.getValue(true) as string[];
renderCookbooks();
updateResultsCount();
});
} else {
tagSelect.multiple = true;
tagSelect.addEventListener('change', () => {
selectedTags = Array.from(tagSelect.selectedOptions).map(o => o.value);
renderCookbooks();
updateResultsCount();
});
}
} }
// Clear filters button // Clear filters button
@@ -204,16 +188,9 @@ function clearFilters(): void {
const languageSelect = document.getElementById('filter-language') as HTMLSelectElement; const languageSelect = document.getElementById('filter-language') as HTMLSelectElement;
if (languageSelect) languageSelect.value = ''; if (languageSelect) languageSelect.value = '';
const tagSelect = document.getElementById('filter-tag') as HTMLSelectElement; // Clear Choices.js selection
if (tagSelect && (window as any).Choices) { if (tagChoices) {
// Clear Choices.js selection tagChoices.removeActiveItems();
const choicesInstance = tagSelect.closest('.choices');
if (choicesInstance) {
const choices = (tagSelect as any).choices;
if (choices) choices.removeActiveItems();
}
} else if (tagSelect) {
Array.from(tagSelect.options).forEach(o => o.selected = false);
} }
const searchInput = document.getElementById('search-input') as HTMLInputElement; const searchInput = document.getElementById('search-input') as HTMLInputElement;