feat(site): rails cracker is Edge and rails, under a tram

Author: dylan-sutton-chavez

site/src/components/ui/icon.astro

@@ -27,6 +27,11 @@ const ICONS = {
     round: true,
     body: `<path d="m21 21-4.34-4.34"/><circle cx="11" cy="11" r="8"/>`
   },
+  tram: {
+    width: 2,
+    round: true,
+    body: `<rect width="16" height="16" x="4" y="3" rx="2"/><path d="M4 11h16"/><path d="M12 3v8"/><path d="m8 19-2 3"/><path d="m18 22-2-3"/><path d="M8 15h.01"/><path d="M16 15h.01"/>`
+  },
   fork: {
     width: 2,
     round: true,

site/src/data/programs.ts

@@ -4,5 +4,5 @@ import { OWNER } from '../lib/account/handle'
 export type Program = { slug: string; name: string; description: string; author: string }
 
 export const programs: Program[] = [
-  { slug: 'rails-cracker', name: 'Rails cracker', description: 'Paste any git repo and follow its code graph to every vulnerability it can reach.', author: OWNER }
+  { slug: 'edge-and-rails', name: 'Edge and rails', description: 'Paste any git repo and follow its code graph to every vulnerability it can reach.', author: OWNER }
 ]

site/src/pages/index.astro

@@ -12,7 +12,7 @@ import { OWNER } from '../lib/account/handle'
 import { count } from '../lib/format'
 import { programs } from '../data/programs'
 
-// Repos a visitor may know, each a tag that opens Rails cracker on it.
+// Repos a visitor may know, each a tag that opens Edge and rails on it.
 const repos = [['rails', 'rails/rails'], ['django', 'django/django'], ['express', 'expressjs/express'], ['flask', 'pallets/flask'], ['next.js', 'vercel/next.js']]
 
 // Publishing needs a token, so signed out the same button opens the sign-in dialog.
@@ -77,12 +77,12 @@ const outline = 'flex items-center gap-2 transition border border-line text-fg-h
 
     <section class="flex flex-col items-center gap-4 rounded-2xl border border-line-strong bg-page px-4 py-10">
       <div class="flex flex-col items-center gap-1">
-        <h2 class="flex items-center gap-2 whitespace-nowrap text-sm"><Icon name="binoculars" size="sm" class="text-fg-hint" />Rails cracker</h2>
+        <h2 class="flex items-center gap-2 whitespace-nowrap text-sm"><Icon name="tram" size="sm" class="text-fg-hint" />Edge and rails</h2>
         <p class="text-2xs text-fg-hint">Trace a repo to its vulnerabilities</p>
       </div>
 
-      {/* A repo sent from here lands on the Rails cracker page. */}
-      <form data-trace action="/programs/rails-cracker" class="w-full max-w-[520px]">
+      {/* A repo sent from here lands on the Edge and rails page. */}
+      <form data-trace action="/programs/edge-and-rails" class="w-full max-w-[520px]">
         <label class="flex h-9 items-center gap-2.5 rounded-full border border-line-emphasis bg-surface px-4 text-sm transition-shadow hover:border-link/60 hover:ring-2 hover:ring-link/20 focus-within:border-link/60 focus-within:ring-2 focus-within:ring-link/20">
           <span class="sr-only">Git repo</span>
           <Icon name="fork" size="sm" class="shrink-0 text-fg-placeholder" />
@@ -92,7 +92,7 @@ const outline = 'flex items-center gap-2 transition border border-line text-fg-h
       </form>
 
       <div class="flex flex-wrap justify-center gap-2">
-        {repos.map(([label, repo]) => <a href={`/programs/rails-cracker?repo=${repo}`} data-repo={repo} class="rounded-full border border-line-strong px-3 py-1 text-xs text-fg-faint transition hover:text-fg">{label}</a>)}
+        {repos.map(([label, repo]) => <a href={`/programs/edge-and-rails?repo=${repo}`} data-repo={repo} class="rounded-full border border-line-strong px-3 py-1 text-xs text-fg-faint transition hover:text-fg">{label}</a>)}
       </div>
     </section>
 

…e/src/pages/programs/rails-cracker.astro …/src/pages/programs/edge-and-rails.astrosite/src/pages/programs/rails-cracker.astro renamed to site/src/pages/programs/edge-and-rails.astro site/src/pages/programs/rails-cracker.astro renamed to site/src/pages/programs/edge-and-rails.astro

@@ -26,7 +26,7 @@ const edge = 'pointer-events-none absolute inset-y-0 w-16 from-page to-transpare
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Rails cracker on Edge Python</title>
+  <title>Edge and rails on Edge Python</title>
   <meta name="robots" content="noindex, nofollow" />
   <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
   <link rel="author" href="/humans.txt" />

site/tests/package.spec.ts

@@ -145,7 +145,7 @@ test('shelves programs beside the packages under Community and sends std to its
   const { name } = await published(request)
 
   await page.goto('/')
-  await expect(page.locator('[data-cards]').getByRole('link', { name: 'Rails cracker' })).toHaveAttribute('href', '/programs/rails-cracker')
+  await expect(page.locator('[data-cards]').getByRole('link', { name: 'Edge and rails' })).toHaveAttribute('href', '/programs/edge-and-rails')
   await expect(page.locator(`[data-cards] a[href="/package/${name}"]`)).toHaveCount(1)
 
   await page.locator('[data-shelf] input').fill('nothing like it')