feat: migrate skills review desk to astro
This commit is contained in:
Marcos Paulo
@@ -0,0 +1,158 @@
|
||||
---
|
||||
import { getCollection } from 'astro:content';
|
||||
import BaseLayout from '../layouts/BaseLayout.astro';
|
||||
import reviewStylesheet from '../../skills-review/styles.css?url';
|
||||
import changeLensStylesheet from '../../skills-review/change-lens.css?url';
|
||||
|
||||
const reviews = await getCollection('reviews');
|
||||
const reviewOrder = [
|
||||
'code-style-review',
|
||||
'sql-injection-audit',
|
||||
'confectionary-skill-hub',
|
||||
'angular-access-modifiers',
|
||||
'codebase-map',
|
||||
'angular-accessibility-root',
|
||||
'angular-accessibility',
|
||||
'copy-quote-info-to-payload',
|
||||
'generated-code-explanation',
|
||||
'ndo-repro',
|
||||
'duplicate-code-check',
|
||||
'am-i-free',
|
||||
'back-to-work',
|
||||
'long-day-start',
|
||||
'lunch-time',
|
||||
'backend-code-reviewer',
|
||||
'gfiber-logging',
|
||||
'confluence-page',
|
||||
'diagram-plantuml',
|
||||
'page-reviewer',
|
||||
'unslop',
|
||||
'spanish-naturalizer',
|
||||
'draft-mr',
|
||||
'semantic-diff-review',
|
||||
];
|
||||
const reviewPosition = new Map(reviewOrder.map((id, index) => [id, index]));
|
||||
const catalog = reviews
|
||||
.sort((left, right) => reviewPosition.get(left.id)! - reviewPosition.get(right.id)!)
|
||||
.map((review) => ({
|
||||
...review.data,
|
||||
improved: review.body,
|
||||
}));
|
||||
const serializedCatalog = JSON.stringify(catalog).replace(/</g, '\\u003c');
|
||||
---
|
||||
|
||||
<BaseLayout
|
||||
title="Submitted Skills — Review Desk"
|
||||
description="Friendly reviews and improved drafts for submitted Agent Skills."
|
||||
>
|
||||
<link slot="styles" rel="stylesheet" href={reviewStylesheet} />
|
||||
<link slot="styles" rel="stylesheet" href={changeLensStylesheet} />
|
||||
<main>
|
||||
<header class="topbar">
|
||||
<a href={import.meta.env.BASE_URL} class="back">← field guide</a><span
|
||||
>SUBMITTED SKILLS / REVIEW DESK</span
|
||||
><a href="#catalog" id="submission-count">submissions</a>
|
||||
</header>
|
||||
<section class="hero">
|
||||
<p class="eyebrow">A friendly path from draft to dependable</p>
|
||||
<h1>Every skill deserves<br /><em>a clear job.</em></h1>
|
||||
<p>
|
||||
Read the original, understand what already works, and compare a safer, leaner draft. Nothing
|
||||
here overwrites a submission; revisions live in their own review output.
|
||||
</p>
|
||||
</section>
|
||||
<section class="principles" aria-label="Review principles">
|
||||
<article>
|
||||
<b>01</b><strong>Discoverable</strong><span
|
||||
>A precise description tells an agent when to load the skill.</span
|
||||
>
|
||||
</article>
|
||||
<article>
|
||||
<b>02</b><strong>Useful in context</strong><span
|
||||
>Core workflow stays short; conditional detail loads only when needed.</span
|
||||
>
|
||||
</article>
|
||||
<article>
|
||||
<b>03</b><strong>Safe by design</strong><span
|
||||
>Commands, secrets, and shared systems have explicit boundaries.</span
|
||||
>
|
||||
</article>
|
||||
<article>
|
||||
<b>04</b><strong>Proven in use</strong><span
|
||||
>Real prompts and observable checks turn a draft into a reliable tool.</span
|
||||
>
|
||||
</article>
|
||||
</section>
|
||||
<section class="method">
|
||||
<div>
|
||||
<p class="eyebrow">How to use this desk</p><h2>Compare.<br /><em>Then choose.</em></h2>
|
||||
</div>
|
||||
<ol>
|
||||
<li>Select a submission, or open an author URL.</li><li>
|
||||
Read the gentle review before judging the draft.
|
||||
</li><li>
|
||||
Choose <strong>Preview Markdown</strong> in the file toolbar to render either version.
|
||||
</li><li>Copy or download the version you want, then vote for the draft you would ship.</li>
|
||||
</ol>
|
||||
</section>
|
||||
<section class="catalog" id="catalog">
|
||||
<aside>
|
||||
<p class="eyebrow">The catalog</p><label for="skill-filter">Find a skill</label><input
|
||||
id="skill-filter"
|
||||
type="search"
|
||||
placeholder="author, skill, topic"
|
||||
autocomplete="off"
|
||||
/><p class="count" id="count"></p><div
|
||||
id="skill-list"
|
||||
role="listbox"
|
||||
aria-label="Submitted skills"
|
||||
>
|
||||
</div>
|
||||
</aside>
|
||||
<article class="detail" id="detail" aria-live="polite"></article>
|
||||
</section>
|
||||
<section class="research">
|
||||
<p class="eyebrow">Why these reviews look this way</p>
|
||||
<p>
|
||||
The recommendations follow the open Agent Skills format: valid frontmatter for discovery,
|
||||
progressive disclosure for context economy, deterministic scripts for fragile repeated
|
||||
mechanics, and behavioral evaluation rather than a checklist of pretty headings.
|
||||
</p>
|
||||
<div>
|
||||
<a href="https://agentskills.io/specification" target="_blank" rel="noreferrer"
|
||||
>Format specification ↗</a
|
||||
><a
|
||||
href="https://agentskills.io/skill-creation/best-practices"
|
||||
target="_blank"
|
||||
rel="noreferrer">Writing practices ↗</a
|
||||
><a
|
||||
href="https://agentskills.io/skill-creation/evaluating-skills"
|
||||
target="_blank"
|
||||
rel="noreferrer">Evaluation loop ↗</a
|
||||
><a
|
||||
href="https://agentskills.io/skill-creation/using-scripts"
|
||||
target="_blank"
|
||||
rel="noreferrer">Scripts guide ↗</a
|
||||
>
|
||||
</div>
|
||||
</section>
|
||||
<footer>
|
||||
Share an author with <code>?author=Name</code>, or one review with <code
|
||||
>?author=Name&skill=skill-id&view=improved</code
|
||||
>. To add a submission later: drop a package under <code>submitted-skills/</code>, add an
|
||||
entry under <code>src/content/reviews/{'{'}new-id{'}'}.md</code> (and mirror it into <code
|
||||
>skills-review/catalog.js</code
|
||||
> until task 16 rewires the page to read the collection), then run <code
|
||||
>node scripts/build-skill-review.mjs</code
|
||||
>. Votes call a separate service — see <code>vote-service/</code> — one per visitor, tracked by
|
||||
network source.
|
||||
</footer>
|
||||
</main>
|
||||
<script is:inline define:vars={{ serializedCatalog }}>
|
||||
window.SKILLS_REVIEW_VOTE_API = 'https://ai-for-dummies-vote.marcospaulo.dev.br';
|
||||
window.__SKILLS_REVIEW_CATALOG = JSON.parse(serializedCatalog);
|
||||
</script>
|
||||
<script>
|
||||
import '../../skills-review/app.js';
|
||||
</script>
|
||||
</BaseLayout>
|
||||
Reference in New Issue
Block a user