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

Merge pull request #812 from github/website-update

Browse Source 
Website: remove prompts, add workflows page, fix TypeScript config
This commit is contained in:
Aaron Powell
2026-02-25 16:35:56 +11:00
committed by GitHub
parent a653f34a34 0f42a72a20
commit 14cd2baf3a
20 changed files with 258 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/README.workflows.md
View File

@@ -33,4 +33,4 @@ See [CONTRIBUTING.md](../CONTRIBUTING.md#adding-agentic-workflows) for guideline
| Name | Description | Triggers |
| ---- | ----------- | -------- |
| [Daily Issues Report](../workflows/daily-issues-report.md) | Generates a daily summary of open issues and recent activity as a GitHub issue | N/A |
| [Daily Issues Report](../workflows/daily-issues-report.md) | Generates a daily summary of open issues and recent activity as a GitHub issue | schedule |

11
eng/generate-website-data.mjs
View File

@@ -204,7 +204,6 @@ function generateWorkflowsData(gitDates) {
items: workflows,
filters: {
triggers: [],
tags: [],
},
};
}
@@ -214,7 +213,6 @@ function generateWorkflowsData(gitDates) {
});
const allTriggers = new Set();
const allTags = new Set();
for (const file of workflowFiles) {
const filePath = path.join(WORKFLOWS_DIR, file);
@@ -226,7 +224,6 @@ function generateWorkflowsData(gitDates) {
.replace(/\\/g, "/");
(metadata.triggers || []).forEach((t) => allTriggers.add(t));
(metadata.tags || []).forEach((t) => allTags.add(t));
const id = path.basename(file, ".md");
workflows.push({
@@ -234,7 +231,6 @@ function generateWorkflowsData(gitDates) {
title: metadata.name,
description: metadata.description,
triggers: metadata.triggers || [],
tags: metadata.tags || [],
path: relativePath,
lastUpdated: gitDates.get(relativePath) || null,
});
@@ -248,7 +244,6 @@ function generateWorkflowsData(gitDates) {
items: sortedWorkflows,
filters: {
triggers: Array.from(allTriggers).sort(),
tags: Array.from(allTags).sort(),
},
};
}
@@ -682,9 +677,7 @@ function generateSearchIndex(
lastUpdated: workflow.lastUpdated,
searchText: `${workflow.title} ${
workflow.description
} ${workflow.triggers.join(" ")} ${workflow.tags.join(
" "
)}`.toLowerCase(),
} ${workflow.triggers.join(" ")}`.toLowerCase(),
});
}
@@ -843,7 +836,7 @@ async function main() {
const workflowsData = generateWorkflowsData(gitDates);
const workflows = workflowsData.items;
console.log(
`✓ Generated ${workflows.length} workflows (${workflowsData.filters.triggers.length} triggers, ${workflowsData.filters.tags.length} tags)`
`✓ Generated ${workflows.length} workflows (${workflowsData.filters.triggers.length} triggers)`
);
const instructionsData = generateInstructionsData(gitDates);

11
eng/yaml-parser.mjs
View File

@@ -275,14 +275,19 @@ function parseWorkflowMetadata(filePath) {
return null;
}
// Extract triggers from frontmatter if present
const triggers = frontmatter.triggers || [];
// Extract triggers from the 'on' field (top-level keys)
const onField = frontmatter.on;
const triggers = [];
if (onField && typeof onField === "object") {
triggers.push(...Object.keys(onField));
} else if (typeof onField === "string") {
triggers.push(onField);
}
return {
name: frontmatter.name,
description: frontmatter.description,
triggers,
tags: frontmatter.tags || [],
path: filePath,
};
},

1
website/src/env.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
/// <reference types="astro/client" />

10
website/src/layouts/BaseLayout.astro
View File

@@ -9,7 +9,7 @@ interface Props {
const {
title,
description = "Community-driven collection of custom agents, prompts, and instructions for GitHub Copilot",
description = "Community-driven collection of custom agents, instructions, and skills for GitHub Copilot",
activeNav = "",
} = Astro.props;
const base = import.meta.env.BASE_URL;
@@ -57,10 +57,6 @@ try {
href={`${base}agents/`}
class:list={[{ active: activeNav === "agents" }]}>Agents</a
>
<a
href={`${base}prompts/`}
class:list={[{ active: activeNav === "prompts" }]}>Prompts</a
>
<a
href={`${base}instructions/`}
class:list={[{ active: activeNav === "instructions" }]}
@@ -74,6 +70,10 @@ try {
href={`${base}hooks/`}
class:list={[{ active: activeNav === "hooks" }]}>Hooks</a
>
<a
href={`${base}workflows/`}
class:list={[{ active: activeNav === "workflows" }]}>Workflows</a
>
<a
href={`${base}plugins/`}
class:list={[{ active: activeNav === "plugins" }]}

20
website/src/pages/index.astro
View File

@@ -11,7 +11,7 @@ const base = import.meta.env.BASE_URL;
<section class="hero" aria-labelledby="hero-heading">
<div class="container">
<h1 id="hero-heading">Awesome GitHub Copilot</h1>
<p class="hero-subtitle">Community-contributed instructions, prompts, agents, and skills to enhance your GitHub Copilot experience</p>
<p class="hero-subtitle">Community-contributed agents, instructions, and skills to enhance your GitHub Copilot experience</p>
<div class="hero-search">
<label for="global-search" class="sr-only">Search all resources</label>
<input type="text" id="global-search" placeholder="Search all resources..." autocomplete="off" role="combobox" aria-autocomplete="list" aria-expanded="false" aria-controls="search-results">
@@ -33,14 +33,6 @@ const base = import.meta.env.BASE_URL;
</div>
<div class="card-count" data-count="agents" aria-label="Agent count">-</div>
</a>
<a href={`${base}prompts/`} class="card card-with-count" id="card-prompts">
<div class="card-icon" aria-hidden="true">🎯</div>
<div class="card-content">
<h3>Prompts</h3>
<p>Ready-to-use prompt templates for development tasks</p>
</div>
<div class="card-count" data-count="prompts" aria-label="Prompt count">-</div>
</a>
<a href={`${base}instructions/`} class="card card-with-count" id="card-instructions">
<div class="card-icon" aria-hidden="true">📋</div>
<div class="card-content">
@@ -65,6 +57,14 @@ const base = import.meta.env.BASE_URL;
</div>
<div class="card-count" data-count="hooks" aria-label="Hook count">-</div>
</a>
<a href={`${base}workflows/`} class="card card-with-count" id="card-workflows">
<div class="card-icon" aria-hidden="true">⚡</div>
<div class="card-content">
<h3>Workflows</h3>
<p>AI-powered automations for GitHub Actions</p>
</div>
<div class="card-count" data-count="workflows" aria-label="Workflow count">-</div>
</a>
<a href={`${base}plugins/`} class="card card-with-count" id="card-plugins">
<div class="card-icon" aria-hidden="true">🔌</div>
<div class="card-content">
@@ -103,7 +103,7 @@ const base = import.meta.env.BASE_URL;
<div class="step">
<div class="step-number" aria-hidden="true">1</div>
<h3>Browse</h3>
<p>Explore agents, prompts, instructions, and skills</p>
<p>Explore agents, instructions, skills, and plugins</p>
</div>
<div class="step">
<div class="step-number" aria-hidden="true">2</div>

16
website/src/pages/llms.txt.ts
View File

@@ -1,6 +1,5 @@
import type { APIRoute } from "astro";
import agentsData from "../../public/data/agents.json";
import promptsData from "../../public/data/prompts.json";
import instructionsData from "../../public/data/instructions.json";
import skillsData from "../../public/data/skills.json";
@@ -9,7 +8,6 @@ const GITHUB_RAW_BASE = "https://raw.githubusercontent.com/github/awesome-copilo
export const GET: APIRoute = () => {
const agents = agentsData.items;
const prompts = promptsData.items;
const instructions = instructionsData.items;
const skills = skillsData.items;
@@ -22,7 +20,7 @@ export const GET: APIRoute = () => {
// Summary blockquote (optional but recommended)
content +=
"> A community-driven collection of custom agents, prompts, instructions, and skills to enhance GitHub Copilot experiences across various domains, languages, and use cases.\n\n";
"> A community-driven collection of custom agents, instructions, and skills to enhance GitHub Copilot experiences across various domains, languages, and use cases.\n\n";
// Add overview section
content += "## Overview\n\n";
@@ -30,8 +28,6 @@ export const GET: APIRoute = () => {
"This repository provides resources to customize and enhance GitHub Copilot:\n\n";
content +=
"- **Agents**: Specialized GitHub Copilot agents that integrate with MCP servers\n";
content +=
"- **Prompts**: Task-specific prompts for code generation and problem-solving\n";
content +=
"- **Instructions**: Coding standards and best practices applied to specific file patterns\n";
content +=
@@ -47,16 +43,6 @@ export const GET: APIRoute = () => {
}
content += "\n";
// Process Prompts
content += "## Prompts\n\n";
for (const prompt of prompts) {
const description = (prompt.description || "No description available")
.replace(/\s+/g, " ")
.trim();
content += `- [${prompt.title}](${url(prompt.path)}): ${description}\n`;
}
content += "\n";
// Process Instructions
content += "## Instructions\n\n";
for (const instruction of instructions) {

8
website/src/pages/plugins.astro
View File

@@ -3,12 +3,12 @@ import BaseLayout from '../layouts/BaseLayout.astro';
import Modal from '../components/Modal.astro';
---
<BaseLayout title="Plugins" description="Curated plugins of prompts, agents, and skills for specific workflows" activeNav="plugins">
<BaseLayout title="Plugins" description="Curated plugins of agents, hooks, and skills for specific workflows" activeNav="plugins">
<main id="main-content">
<div class="page-header">
<div class="container">
<h1>🔌 Plugins</h1>
<p>Curated plugins of prompts, agents, and skills for specific workflows</p>
<p>Curated plugins of agents, hooks, and skills for specific workflows</p>
</div>
</div>
@@ -18,7 +18,7 @@ import Modal from '../components/Modal.astro';
<label for="search-input" class="sr-only">Search plugins</label>
<input type="text" id="search-input" placeholder="Search plugins..." autocomplete="off">
</div>
<div class="filters-bar" id="filters-bar">
<div class="filter-group">
<label for="filter-tag">Tag:</label>
@@ -32,7 +32,7 @@ import Modal from '../components/Modal.astro';
</div>
<button id="clear-filters" class="btn btn-secondary btn-small">Clear Filters</button>
</div>
<div class="results-count" id="results-count" aria-live="polite"></div>
<div class="resource-list" id="resource-list" role="list">
<div class="loading" aria-live="polite">Loading plugins...</div>

18
website/src/pages/prompts.astro → website/src/pages/workflows.astro
View File

@@ -3,26 +3,26 @@ import BaseLayout from '../layouts/BaseLayout.astro';
import Modal from '../components/Modal.astro';
---
<BaseLayout title="Prompts" description="Ready-to-use prompt templates for development tasks with GitHub Copilot" activeNav="prompts">
<BaseLayout title="Workflows" description="AI-powered repository automations that run coding agents in GitHub Actions" activeNav="workflows">
<main id="main-content">
<div class="page-header">
<div class="container">
<h1>🎯 Prompts</h1>
<p>Ready-to-use prompt templates for development tasks with GitHub Copilot</p>
<h1>⚡ Agentic Workflows</h1>
<p>AI-powered repository automations that run coding agents in GitHub Actions</p>
</div>
</div>
<div class="page-content">
<div class="container">
<div class="search-bar">
<label for="search-input" class="sr-only">Search prompts</label>
<input type="text" id="search-input" placeholder="Search prompts..." autocomplete="off">
<label for="search-input" class="sr-only">Search workflows</label>
<input type="text" id="search-input" placeholder="Search workflows..." autocomplete="off">
</div>
<div class="filters-bar" id="filters-bar">
<div class="filter-group">
<label for="filter-tool">Tool:</label>
<select id="filter-tool" multiple aria-label="Filter by tool"></select>
<label for="filter-trigger">Trigger:</label>
<select id="filter-trigger" multiple aria-label="Filter by trigger"></select>
</div>
<div class="filter-group">
<label for="sort-select">Sort:</label>
@@ -36,7 +36,7 @@ import Modal from '../components/Modal.astro';
<div class="results-count" id="results-count" aria-live="polite"></div>
<div class="resource-list" id="resource-list" role="list">
<div class="loading" aria-live="polite">Loading prompts...</div>
<div class="loading" aria-live="polite">Loading workflows...</div>
</div>
</div>
</div>
@@ -45,6 +45,6 @@ import Modal from '../components/Modal.astro';
<Modal />
<script>
import '../scripts/pages/prompts';
import '../scripts/pages/workflows';
</script>
</BaseLayout>

2
website/src/scripts/modal.ts
View File

@@ -287,7 +287,7 @@ export function setupInstallDropdown(containerId: string): void {
/**
* Open file viewer modal
* @param filePath - Path to the file
* @param type - Resource type (agent, prompt, instruction, etc.)
* @param type - Resource type (agent, instruction, etc.)
* @param updateUrl - Whether to update the URL hash (default: true)
* @param trigger - The element that triggered the modal (for focus return)
*/

2
website/src/scripts/pages/agents.ts
View File

@@ -2,7 +2,7 @@
* Agents page functionality
*/
import { createChoices, getChoicesValues, type Choices } from '../choices';
import { FuzzySearch, SearchItem } from '../search';
import { FuzzySearch, type SearchItem } from '../search';
import { fetchData, debounce, escapeHtml, getGitHubUrl, getInstallDropdownHtml, setupDropdownCloseHandlers, getActionButtonsHtml, setupActionHandlers, getLastUpdatedHtml } from '../utils';
import { setupModal, openFileModal } from '../modal';

2
website/src/scripts/pages/hooks.ts
View File

@@ -2,7 +2,7 @@
* Hooks page functionality
*/
import { createChoices, getChoicesValues, type Choices } from "../choices";
import { FuzzySearch, SearchItem } from "../search";
import { FuzzySearch, type SearchItem } from "../search";
import {
fetchData,
debounce,

4
website/src/scripts/pages/index.ts
View File

@@ -8,10 +8,10 @@ import { setupModal, openFileModal } from '../modal';
interface Manifest {
counts: {
agents: number;
prompts: number;
instructions: number;
skills: number;
hooks: number;
workflows: number;
plugins: number;
tools: number;
};
@@ -36,7 +36,7 @@ export async function initHomepage(): Promise<void> {
const manifest = await fetchData<Manifest>('manifest.json');
if (manifest && manifest.counts) {
// Populate counts in cards
const countKeys = ['agents', 'prompts', 'instructions', 'skills', 'hooks', 'plugins', 'tools'] as const;
const countKeys = ['agents', 'instructions', 'skills', 'hooks', 'workflows', 'plugins', 'tools'] as const;
countKeys.forEach(key => {
const countEl = document.querySelector(`.card-count[data-count="${key}"]`);
if (countEl && manifest.counts[key] !== undefined) {

2
website/src/scripts/pages/instructions.ts
View File

@@ -2,7 +2,7 @@
* Instructions page functionality
*/
import { createChoices, getChoicesValues, type Choices } from '../choices';
import { FuzzySearch, SearchItem } from '../search';
import { FuzzySearch, type SearchItem } from '../search';
import { fetchData, debounce, escapeHtml, getGitHubUrl, getInstallDropdownHtml, setupDropdownCloseHandlers, getActionButtonsHtml, setupActionHandlers, getLastUpdatedHtml } from '../utils';
import { setupModal, openFileModal } from '../modal';

2
website/src/scripts/pages/plugins.ts
View File

@@ -2,7 +2,7 @@
* Plugins page functionality
*/
import { createChoices, getChoicesValues, type Choices } from '../choices';
import { FuzzySearch, SearchItem } from '../search';
import { FuzzySearch, type SearchItem } from '../search';
import { fetchData, debounce, escapeHtml, getGitHubUrl } from '../utils';
import { setupModal, openFileModal } from '../modal';

149
website/src/scripts/pages/prompts.ts
View File

@@ -1,149 +0,0 @@
/**
* Prompts page functionality
*/
import { createChoices, getChoicesValues, type Choices } from '../choices';
import { FuzzySearch, SearchItem } from '../search';
import { fetchData, debounce, escapeHtml, getGitHubUrl, getInstallDropdownHtml, setupDropdownCloseHandlers, getActionButtonsHtml, setupActionHandlers, getLastUpdatedHtml } from '../utils';
import { setupModal, openFileModal } from '../modal';
interface Prompt extends SearchItem {
path: string;
tools?: string[];
lastUpdated?: string | null;
}
interface PromptsData {
items: Prompt[];
filters: {
tools: string[];
};
}
type SortOption = 'title' | 'lastUpdated';
const resourceType = 'prompt';
let allItems: Prompt[] = [];
let search = new FuzzySearch<Prompt>();
let toolSelect: Choices;
let currentFilters = { tools: [] as string[] };
let currentSort: SortOption = 'title';
function sortItems(items: Prompt[]): Prompt[] {
return [...items].sort((a, b) => {
if (currentSort === '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.title.localeCompare(b.title);
});
}
function applyFiltersAndRender(): void {
const searchInput = document.getElementById('search-input') as HTMLInputElement;
const countEl = document.getElementById('results-count');
const query = searchInput?.value || '';
let results = query ? search.search(query) : [...allItems];
if (currentFilters.tools.length > 0) {
results = results.filter(item =>
item.tools?.some(tool => currentFilters.tools.includes(tool))
);
}
results = sortItems(results);
renderItems(results, query);
let countText = `${results.length} of ${allItems.length} prompts`;
if (currentFilters.tools.length > 0) {
countText += ` (filtered by ${currentFilters.tools.length} tool${currentFilters.tools.length > 1 ? 's' : ''})`;
}
if (countEl) countEl.textContent = countText;
}
function renderItems(items: Prompt[], query = ''): void {
const list = document.getElementById('resource-list');
if (!list) return;
if (items.length === 0) {
list.innerHTML = '<div class="empty-state"><h3>No prompts found</h3><p>Try a different search term or adjust filters</p></div>';
return;
}
list.innerHTML = items.map(item => `
<div class="resource-item" data-path="${escapeHtml(item.path)}">
<div class="resource-info">
<div class="resource-title">${query ? search.highlight(item.title, query) : escapeHtml(item.title)}</div>
<div class="resource-description">${escapeHtml(item.description || 'No description')}</div>
<div class="resource-meta">
${item.tools?.slice(0, 4).map(t => `<span class="resource-tag">${escapeHtml(t)}</span>`).join('') || ''}
${item.tools && item.tools.length > 4 ? `<span class="resource-tag">+${item.tools.length - 4} more</span>` : ''}
${getLastUpdatedHtml(item.lastUpdated)}
</div>
</div>
<div class="resource-actions">
${getInstallDropdownHtml(resourceType, item.path, true)}
${getActionButtonsHtml(item.path, true)}
<a href="${getGitHubUrl(item.path)}" class="btn btn-secondary btn-small" target="_blank" onclick="event.stopPropagation()" title="View on GitHub">
GitHub
</a>
</div>
</div>
`).join('');
// Add click handlers
list.querySelectorAll('.resource-item').forEach(el => {
el.addEventListener('click', () => {
const path = (el as HTMLElement).dataset.path;
if (path) openFileModal(path, resourceType);
});
});
}
export async function initPromptsPage(): Promise<void> {
const list = document.getElementById('resource-list');
const searchInput = document.getElementById('search-input') as HTMLInputElement;
const clearFiltersBtn = document.getElementById('clear-filters');
const sortSelect = document.getElementById('sort-select') as HTMLSelectElement;
const data = await fetchData<PromptsData>('prompts.json');
if (!data || !data.items) {
if (list) list.innerHTML = '<div class="empty-state"><h3>Failed to load data</h3></div>';
return;
}
allItems = data.items;
search.setItems(allItems);
toolSelect = createChoices('#filter-tool', { placeholderValue: 'All Tools' });
toolSelect.setChoices(data.filters.tools.map(t => ({ value: t, label: t })), 'value', 'label', true);
document.getElementById('filter-tool')?.addEventListener('change', () => {
currentFilters.tools = getChoicesValues(toolSelect);
applyFiltersAndRender();
});
sortSelect?.addEventListener('change', () => {
currentSort = sortSelect.value as SortOption;
applyFiltersAndRender();
});
applyFiltersAndRender();
searchInput?.addEventListener('input', debounce(() => applyFiltersAndRender(), 200));
clearFiltersBtn?.addEventListener('click', () => {
currentFilters = { tools: [] };
currentSort = 'title';
toolSelect.removeActiveItems();
if (searchInput) searchInput.value = '';
if (sortSelect) sortSelect.value = 'title';
applyFiltersAndRender();
});
setupModal();
setupDropdownCloseHandlers();
setupActionHandlers();
}
// Auto-initialize when DOM is ready
document.addEventListener('DOMContentLoaded', initPromptsPage);

2
website/src/scripts/pages/skills.ts
View File

@@ -2,7 +2,7 @@
* Skills page functionality
*/
import { createChoices, getChoicesValues, type Choices } from "../choices";
import { FuzzySearch, SearchItem } from "../search";
import { FuzzySearch, type SearchItem } from "../search";
import {
fetchData,
debounce,

198
website/src/scripts/pages/workflows.ts Normal file
View File

@@ -0,0 +1,198 @@
/**
* Workflows page functionality
*/
import { createChoices, getChoicesValues, type Choices } from "../choices";
import { FuzzySearch, type SearchItem } from "../search";
import {
fetchData,
debounce,
escapeHtml,
getGitHubUrl,
getActionButtonsHtml,
setupActionHandlers,
getLastUpdatedHtml,
} from "../utils";
import { setupModal, openFileModal } from "../modal";
interface Workflow extends SearchItem {
id: string;
path: string;
triggers: string[];
lastUpdated?: string | null;
}
interface WorkflowsData {
items: Workflow[];
filters: {
triggers: string[];
};
}
type SortOption = "title" | "lastUpdated";
const resourceType = "workflow";
let allItems: Workflow[] = [];
let search = new FuzzySearch<Workflow>();
let triggerSelect: Choices;
let currentFilters = {
triggers: [] as string[],
};
let currentSort: SortOption = "title";
function sortItems(items: Workflow[]): Workflow[] {
return [...items].sort((a, b) => {
if (currentSort === "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.title.localeCompare(b.title);
});
}
function applyFiltersAndRender(): void {
const searchInput = document.getElementById(
"search-input"
) as HTMLInputElement;
const countEl = document.getElementById("results-count");
const query = searchInput?.value || "";
let results = query ? search.search(query) : [...allItems];
if (currentFilters.triggers.length > 0) {
results = results.filter((item) =>
item.triggers.some((t) => currentFilters.triggers.includes(t))
);
}
results = sortItems(results);
renderItems(results, query);
const activeFilters: string[] = [];
if (currentFilters.triggers.length > 0)
activeFilters.push(
`${currentFilters.triggers.length} trigger${
currentFilters.triggers.length > 1 ? "s" : ""
}`
);
let countText = `${results.length} of ${allItems.length} workflows`;
if (activeFilters.length > 0) {
countText += ` (filtered by ${activeFilters.join(", ")})`;
}
if (countEl) countEl.textContent = countText;
}
function renderItems(items: Workflow[], query = ""): void {
const list = document.getElementById("resource-list");
if (!list) return;
if (items.length === 0) {
list.innerHTML =
'<div class="empty-state"><h3>No workflows found</h3><p>Try a different search term or adjust filters</p></div>';
return;
}
list.innerHTML = items
.map(
(item) => `
<div class="resource-item" data-path="${escapeHtml(item.path)}">
<div class="resource-info">
<div class="resource-title">${
query ? search.highlight(item.title, query) : escapeHtml(item.title)
}</div>
<div class="resource-description">${escapeHtml(
item.description || "No description"
)}</div>
<div class="resource-meta">
${item.triggers
.map(
(t) =>
`<span class="resource-tag tag-trigger">${escapeHtml(t)}</span>`
)
.join("")}
${getLastUpdatedHtml(item.lastUpdated)}
</div>
</div>
<div class="resource-actions">
${getActionButtonsHtml(item.path)}
<a href="${getGitHubUrl(
item.path
)}" class="btn btn-secondary" target="_blank" onclick="event.stopPropagation()" title="View on GitHub">GitHub</a>
</div>
</div>
`
)
.join("");
// Add click handlers for opening modal
list.querySelectorAll(".resource-item").forEach((el) => {
el.addEventListener("click", (e) => {
if ((e.target as HTMLElement).closest(".resource-actions")) return;
const path = (el as HTMLElement).dataset.path;
if (path) openFileModal(path, resourceType);
});
});
}
export async function initWorkflowsPage(): Promise<void> {
const list = document.getElementById("resource-list");
const searchInput = document.getElementById(
"search-input"
) as HTMLInputElement;
const clearFiltersBtn = document.getElementById("clear-filters");
const sortSelect = document.getElementById(
"sort-select"
) as HTMLSelectElement;
const data = await fetchData<WorkflowsData>("workflows.json");
if (!data || !data.items) {
if (list)
list.innerHTML =
'<div class="empty-state"><h3>Failed to load data</h3></div>';
return;
}
allItems = data.items;
search.setItems(allItems);
// Setup trigger filter
triggerSelect = createChoices("#filter-trigger", {
placeholderValue: "All Triggers",
});
triggerSelect.setChoices(
data.filters.triggers.map((t) => ({ value: t, label: t })),
"value",
"label",
true
);
document.getElementById("filter-trigger")?.addEventListener("change", () => {
currentFilters.triggers = getChoicesValues(triggerSelect);
applyFiltersAndRender();
});
sortSelect?.addEventListener("change", () => {
currentSort = sortSelect.value as SortOption;
applyFiltersAndRender();
});
applyFiltersAndRender();
searchInput?.addEventListener(
"input",
debounce(() => applyFiltersAndRender(), 200)
);
clearFiltersBtn?.addEventListener("click", () => {
currentFilters = { triggers: [] };
currentSort = "title";
triggerSelect.removeActiveItems();
if (searchInput) searchInput.value = "";
if (sortSelect) sortSelect.value = "title";
applyFiltersAndRender();
});
setupModal();
setupActionHandlers();
}
// Auto-initialize when DOM is ready
document.addEventListener("DOMContentLoaded", initWorkflowsPage);

15
website/src/scripts/utils.ts
View File

@@ -15,9 +15,9 @@ const VSCODE_INSTALL_CONFIG: Record<
baseUrl: "https://aka.ms/awesome-copilot/install/instructions",
scheme: "chat-instructions",
},
prompt: {
baseUrl: "https://aka.ms/awesome-copilot/install/prompt",
scheme: "chat-prompt",
instruction: {
baseUrl: "https://aka.ms/awesome-copilot/install/instructions",
scheme: "chat-instructions",
},
agent: {
baseUrl: "https://aka.ms/awesome-copilot/install/agent",
@@ -93,7 +93,7 @@ export async function copyToClipboard(text: string): Promise<boolean> {
/**
* Generate VS Code install URL
* @param type - Resource type (agent, prompt, instructions)
* @param type - Resource type (agent, instructions)
* @param filePath - Path to the file
* @param insiders - Whether to use VS Code Insiders
*/
@@ -227,12 +227,13 @@ export function truncate(text: string | undefined, maxLength: number): string {
*/
export function getResourceType(filePath: string): string {
if (filePath.endsWith(".agent.md")) return "agent";
if (filePath.endsWith(".prompt.md")) return "prompt";
if (filePath.endsWith(".instructions.md")) return "instruction";
if (/(^|\/)skills\//.test(filePath) && filePath.endsWith("SKILL.md"))
return "skill";
if (/(^|\/)hooks\//.test(filePath) && filePath.endsWith("README.md"))
return "hook";
if (/(^|\/)workflows\//.test(filePath) && filePath.endsWith(".md"))
return "workflow";
// Check for plugin directories (e.g., plugins/<id>, plugins/<id>/)
if (/(^|\/)plugins\/[^/]+\/?$/.test(filePath)) return "plugin";
// Check for plugin.json files (e.g., plugins/<id>/.github/plugin/plugin.json)
@@ -246,10 +247,10 @@ export function getResourceType(filePath: string): string {
export function formatResourceType(type: string): string {
const labels: Record<string, string> = {
agent: "🤖 Agent",
prompt: "🎯 Prompt",
instruction: "📋 Instruction",
skill: "⚡ Skill",
hook: "🪝 Hook",
workflow: "⚡ Workflow",
plugin: "🔌 Plugin",
};
return labels[type] || type;
@@ -261,10 +262,10 @@ export function formatResourceType(type: string): string {
export function getResourceIcon(type: string): string {
const icons: Record<string, string> = {
agent: "🤖",
prompt: "🎯",
instruction: "📋",
skill: "⚡",
hook: "🪝",
workflow: "⚡",
plugin: "🔌",
};
return icons[type] || "📄";

3
website/tsconfig.json Normal file
View File

@@ -0,0 +1,3 @@
{
"extends": "astro/tsconfigs/base"
}