Conversation
Preview deployments |
When a non-.gts file or non-card .json file is open in CodeMode, the preview pane's format chooser now includes a "Metadata" option that displays a read-only, syntax-highlighted JSON-API representation of the FileDef instance. Key changes: - Add serializeFileDef() to card-serialization.ts, sharing internal serialization logic with serializeCard() via a widened serializeCardResource() - Move [meta] property from CardDef to BaseDef to support clean serialization of any BaseDef subclass - Add MetadataPanel component with JSON syntax highlighting - Add 'metadata' to Format type and expose it for FileDef instances Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
lukemelia
force-pushed
the
cs-10197-metadata-pane-for-non-module-files-in-module-inspector
branch
from
1224a16 to
6dc7925
Compare
Fix JSON syntax highlighting so numbers/booleans/nulls inside strings are not re-highlighted. Use placeholder strategy to protect key and string spans from subsequent regex passes. Add visual divider before the metadata button in the format chooser and widen the container to prevent overflow. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Contributor
There was a problem hiding this comment.
Pull request overview
This pull request adds metadata viewing capability for non-module files in the module inspector. When a non-card, non-module file (like an image or markdown file) is opened in CodeMode, users can now select a "Metadata" format option to view a syntax-highlighted JSON-API representation of the FileDef instance.
Changes:
- Added 'metadata' as a new Format type and made it available only for FileDef instances in the preview panel
- Implemented
serializeFileDef()function to generate JSON-API representations of FileDef instances, sharing internal logic withserializeCard()via a widenedserializeCardResource() - Moved
[meta]property from CardDef to BaseDef to enable serialization of any BaseDef subclass including FileDef
Reviewed changes
Copilot reviewed 10 out of 10 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/runtime-common/resource-types.ts | Added LooseFileMetaResource type definition |
| packages/runtime-common/index.ts | Added LooseSingleFileMetaDocument interface for file metadata documents |
| packages/runtime-common/formats.ts | Added 'metadata' as a new Format option |
| packages/host/app/services/store.ts | Added serializeFileDefAsDocument() method to serialize FileDef instances |
| packages/host/app/components/operator-mode/preview-panel/metadata-panel.gts | New component that displays syntax-highlighted JSON-API metadata with proper HTML escaping and error handling |
| packages/host/app/components/operator-mode/preview-panel/index.gts | Integrated MetadataPanel component and made 'metadata' format available only for FileDef instances |
| packages/host/app/components/operator-mode/code-submode/format-chooser.gts | Added visual divider before metadata format option and adjusted width to accommodate new format |
| packages/base/card-serialization.ts | Implemented serializeFileDef() function and widened serializeCardResource() to support both CardDef and FileDef serialization |
| packages/base/card-api.gts | Moved [meta] property from CardDef to BaseDef and exported serializeFileDef function |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Fixes TS2366 glint error caused by 'metadata' being added to the Format union without a corresponding case in the switch statement. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
lukemelia
force-pushed
the
cs-10197-metadata-pane-for-non-module-files-in-module-inspector
branch
from
e9c996f to
422f58f
Compare
- Add blank line between @ember/@Glimmer imports and ember-resources/ tracked-built-ins to satisfy import/order rule - Replace \x00 (NUL control character) sentinel with \uE000 (Unicode private use area) to fix no-control-regex rule Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…sues Use String.fromCharCode(0xe000) to build the placeholder sentinel at runtime rather than a literal escape sequence. This avoids: - no-control-regex: ESLint flags control chars in regex literals/patterns - content-tag parse failure: regex literal with \uE000 confused the GTS parser, causing glint to fail to parse the entire file Also converts PLACEHOLDER_RE to new RegExp() constructor per the file's existing pattern for regex literals in .gts files. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Fix error message variable name: use possibleURL (the parameter) instead of maybeRelativeURL (the function being defined) - Widen serializeCardResource return type to LooseCardResource | LooseFileMetaResource to accurately reflect what the function produces when called with FileMetaResourceType Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
added 2 commits
February 25, 2026 21:57
- Integration tests for serializeFileDef in file-def-serialization-test.gts
covering: type 'file-meta', id inclusion, adoptsFrom, attributes, type guard,
URL handling, and full document shape
- Export serializeFileDef from base-realm test helpers
- Acceptance tests in code-submode-test.ts:
- non-card files show 'metadata' format button (and not 'edit')
- clicking metadata shows the panel with file-meta JSON content
- switching away from metadata hides the panel
- card instances do not show 'metadata' format button (assertion added
to existing test)
- Collapse single-item type import to one line (prettier) - Use assert.notEqual instead of assert.ok with != null (qunit/no-ok-equality) - Simplify subdirectory URL test to avoid accessing CodeRef.module (TS2339)
Contributor
|
This is unrelated to your PR but should there be a head format preview for images? 
|
backspace
approved these changes
Feb 26, 2026
Contributor
backspace
left a comment
backspace
left a comment
There was a problem hiding this comment.
I tried this locally, worked as expected
| --boxel-button-text-color: var(--boxel-dark); | ||
| } | ||
|
|
||
| .format-chooser__divider { |
Contributor
There was a problem hiding this comment.
No need for BEM with scoping, could just be divider, but I see __buttons and __button already exist, so…
habdelra
approved these changes
Feb 26, 2026
Contributor
Author
Should there be? There should definitely be a preview, since you can view a file's isolated view in host mode and presumably that should show its head format. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
.gts/ non-card.jsonfile is open in CodeModeserializeFileDef()tocard-serialization.ts, sharing internal serialization logic withserializeCard()via a widenedserializeCardResource()[meta]property fromCardDeftoBaseDefto enable clean serialization of anyBaseDefsubclassTest plan
Closes CS-10197
🤖 Generated with Claude Code