feat(app): expand-to-read for long requirement descriptions#3132
Merged
Conversation
Long framework requirement descriptions (e.g. NIST SP800-53 PL-2) were truncated to a single line in the customer app's Requirements view with only a clipped native tooltip — no way to read the full text. The framework editor already has expand arrows; this brings the same affordance (read-only) to the app. Adds a shared ExpandableDescription cell: truncated inline text plus a hover maximize button that opens a read-only dialog with the full description. Used by both the grouped and flat requirements tables. Full text is already on the client, so no new fetch. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
Contributor
|
🎉 This PR is included in version 3.82.0 🎉 The release is available on GitHub release Your semantic-release bot 📦🚀 |
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
2 participants
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.
What
Adds a read-only "expand to read" affordance to requirement Descriptions in the customer app's framework Requirements view — the same idea as the framework editor's expand arrows, but read-only.
Why
Long requirement descriptions (e.g. NIST SP800-53 PL-2) are truncated to a single line in the app, and even the native tooltip is clipped — there was no way to read the full, verbose text. The framework editor already solved this; the app didn't.
Changes
ExpandableDescriptioncell: shows the truncated text inline (keeps the nativetitletooltip) plus a hover maximize button that opens a read-only dialog with the full description. Heading isidentifier · name(e.g.PL-2 · System Security and Privacy Plans).GroupedRequirementRow(grouped by family) andFrameworkRequirements(flat list).stopPropagations so it doesn't trigger the row's navigate-to-requirement click.item.description) — no new fetch.Read-only by design (customers view their framework instance; they don't edit the template), so it's a viewer dialog — no textarea/save.
Design system
Uses
@trycompai/design-systemDialog+ the CarbonMaximizeicon. No@trycompai/ui/lucide-react.DialogContentsized via thesize="3xl"variant (it omitsclassName); the body scrolls (max-h-[70vh] overflow-y-auto,whitespace-pre-wrappreserves the a./1./2. structure).Testing
ExpandableDescription.test.tsx(4 tests): inline render + button, opens dialog with heading + full text, em-dash + no button when empty, and doesn't bubble to the clickable parent row.turbo typecheck --filter=@trycompai/app: clean for the changed files.Frontend-only, no API/DB changes. Worth a visual check on the preview (open a long NIST requirement).
🤖 Generated with Claude Code
Summary by cubic
Adds a read-only expand-to-read for long requirement descriptions in the app’s Requirements view, so users can read full text without leaving the table. Introduces a shared
ExpandableDescriptioncell used in both grouped and flat tables.@trycompai/design-systemDialogandMaximizeicon; body scrolls and preserves formatting.Written for commit 2988a8e. Summary will update on new commits.