raystack / raystack/chronicle

feat: add response syntax highlighting to API playground

Open Beginner friendly
#131 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
2
Forks
1
Avg merge
12h 29m
Merged PRs (30d)
12

Description

Problem

The API playground dialog (`src/components/api/playground-dialog.tsx`) displays raw JSON responses without syntax highlighting. The response body tab shows plain monospace text, making it hard to read large responses.

Suggested Fix

  • Use the existing Shiki setup or CodeMirror (already imported for the request body editor) to highlight the response JSON
  • Apply the same dark/light theme as the rest of the site

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in src/components/api/playground-dialog.tsx and inspect how the request body editor uses the existing CodeMirror setup or how the site's Shiki setup is applied. Add highlighting to the response body tab while preserving the site's dark/light theme, then verify that JSON responses are readable in both themes.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
72/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.