[github-actions]

What changed

• Workshop file: workshop/side-quest-06-03c-copilot-github-token-ui-only.md
• Type of change: creates a new concept diagram (the file previously had no images)
• SVG files added:
  • workshop/images/side-quest-06-03c-token-secret-flow-light.svg
  • workshop/images/side-quest-06-03c-token-secret-flow-dark.svg

Why this diagram helps learners

This side quest walks learners through four sequential actions — generate a fine-grained PAT, store it as the COPILOT_GITHUB_TOKEN repository secret, and have the workflow engine read that secret at run time to authenticate to the Copilot API — but the relationship between the one-time setup steps (1–2) and the automatic run-time steps (3–4) was only explained in prose across two separate sub-exercises. A single numbered left-to-right diagram makes that split explicit at a glance, reinforces the token-rotation reminder with a dashed annotation callout, and gives learners a mental model they can reuse when troubleshooting authentication issues later in the workshop.

Implementation details

• Followed the 1200x560 canvas, GitHub-inspired light/dark palette, and Mona Sans typography conventions used by existing workshop diagrams (e.g. 25-audit-lifecycle).
• Used the play Octicon for the Workflow Run node per the GitHub visual language system guidance; other nodes (key, lock, spark) represent non-GitHub-entity concepts so they use plain accent-colored glyphs, not Octicons.
• Added data-visual-kind="diagram", a stable data-visual-id, role="img", and matching aria-label to both SVG roots, plus data-node attributes on each stage.
• Inserted the minimal theme-aware <picture> block (light variant as <img> fallback, alt text only on <img>) right after the intro paragraph, with two short introductory sentences.
• Ran node scripts/check-svg-visual-language.js against both files — no violations.

QA performed

• Served the repo locally and used playwright-cli to render the exact <picture> block in both colorScheme: "light" and colorScheme: "dark", confirming currentSrc correctly resolves to -light.svg and -dark.svg respectively.
• Captured screenshots of both variants and visually confirmed all labels, chips, and callout text stay inside their boxes with no clipping or overlap.
• Markdown-only edit is smaller (8 lines) than the combined SVG additions (250 lines).

No other files were modified.

Warning

Firewall blocked 7 domains

The following domains were blocked by the firewall during workflow execution:

• accounts.google.com
• android.clients.google.com
• clients2.google.com
• registry.npmjs.org
• update.googleapis.com
• www.google.com
• www.gstatic.com

To allow these domains, add them to the network.allowed list in your workflow frontmatter:

network:
  allowed:
    - defaults
    - "accounts.google.com"
    - "android.clients.google.com"
    - "clients2.google.com"
    - "registry.npmjs.org"
    - "update.googleapis.com"
    - "www.google.com"
    - "www.gstatic.com"

See Network Configuration for more information.

Generated by 🧠 Workshop Explanatory Diagram Generator · copilot · auto · 111.3 AIC · ⌖ 17.7 AIC · ⊞ 10.7K · ◷

• expires on Oct 2, 2026, 2:49 AM UTC

[github-actions]

This pull request was automatically closed because it expired on 2026-10-02T02:49:52.628Z.

Closed by Workflow