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

Simplify website search and listing controls (#1553)

Browse Source 
* Removing search from the home pageThis was a little confusing because there are two searches, but the overall site search is a lot more powerful

* Prefilter website search by resource page

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

* small error handling and formatting

* Simplify website listing controls

Remove per-page text search, trim page-specific controls, and move remaining sort/filter controls into compact flyouts.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

---------

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
Aaron Powell
2026-04-29 16:03:08 +10:00
committed by GitHub
parent 0d7a5ad4c2
commit 76ac13a9b8
29 changed files with 1166 additions and 1331 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
website/src/scripts/pages/plugins-render.ts
View File

@@ -1,4 +1,8 @@
import { escapeHtml, getGitHubUrl, sanitizeUrl } from '../utils';
import {
escapeHtml,
getGitHubUrl,
sanitizeUrl,
} from '../utils';
interface PluginAuthor {
name: string;
@@ -17,6 +21,7 @@ export interface RenderablePlugin {
path: string;
tags?: string[];
itemCount: number;
lastUpdated?: string | null;
external?: boolean;
repository?: string | null;
homepage?: string | null;
@@ -24,6 +29,23 @@ export interface RenderablePlugin {
source?: PluginSource | null;
}
export type PluginSortOption = 'title' | 'lastUpdated';
export function sortPlugins<T extends RenderablePlugin>(
items: T[],
sort: PluginSortOption
): T[] {
return [...items].sort((a, b) => {
if (sort === 'lastUpdated') {
const dateA = a.lastUpdated ? new Date(a.lastUpdated).getTime() : 0;
const dateB = b.lastUpdated ? new Date(b.lastUpdated).getTime() : 0;
return dateB - dateA;
}
return a.name.localeCompare(b.name);
});
}
function getExternalPluginUrl(plugin: RenderablePlugin): string {
if (plugin.source?.source === 'github' && plugin.source.repo) {
const base = `https://github.com/${plugin.source.repo}`;
@@ -33,20 +55,12 @@ function getExternalPluginUrl(plugin: RenderablePlugin): string {
return sanitizeUrl(plugin.repository || plugin.homepage);
}
export function renderPluginsHtml(
items: RenderablePlugin[],
options: {
query?: string;
highlightTitle?: (title: string, query: string) => string;
} = {}
): string {
const { query = '', highlightTitle } = options;
export function renderPluginsHtml(items: RenderablePlugin[]): string {
if (items.length === 0) {
return `
<div class="empty-state">
<h3>No plugins found</h3>
<p>Try a different search term or adjust filters</p>
<p>Try different tags or clear the current filters</p>
</div>
`;
}
@@ -64,16 +78,11 @@ export function renderPluginsHtml(
const githubHref = isExternal
? escapeHtml(getExternalPluginUrl(item))
: getGitHubUrl(item.path);
const titleHtml =
query && highlightTitle
? highlightTitle(item.name, query)
: escapeHtml(item.name);
return `
<article class="resource-item${isExternal ? ' resource-item-external' : ''}" data-path="${escapeHtml(item.path)}" role="listitem">
<button type="button" class="resource-preview">
<div class="resource-info">
<div class="resource-title">${titleHtml}</div>
<div class="resource-title">${escapeHtml(item.name)}</div>
<div class="resource-description">${escapeHtml(item.description || 'No description')}</div>
<div class="resource-meta">
${metaTag}