juliethecao opened a new pull request, #5675:
URL: https://github.com/apache/texera/pull/5675
⚠️ This PR is stacked on #5568. Until that lands, the diff below may also
include earlier PRs' property editor changes depending on which base GitHub is
showing. The new code in this PR is the media-type detection helpers, inline
media rendering in the result table and row detail modal, and the backend
string truncation fix. Once #5568 merges and this PR is retargeted to main, the
diff should auto-clean to the PR 8 result-media changes only.
### What changes were proposed in this PR?
Render image, audio, and video outputs from HuggingFace tasks inline in the
workflow result panel instead of displaying raw data URLs as text.
**New file — `media-type.util.ts`:**
- `isImageUrl` — detects `data:image/` data URLs and common image extensions
(`.png`, `.jpg`, `.jpeg`, `.gif`, `.webp`)
- `isAudioUrl` — detects `data:audio/` data URLs and common audio extensions
(`.mp3`, `.wav`, `.ogg`, `.m4a`, `.flac`)
- `isVideoUrl` — detects `data:video/` data URLs, common video extensions
(`.mp4`, `.webm`, `.ogg`), and the `fal.media` CDN host used by fal.ai
text-to-video outputs
**Changes to `result-table-frame.component.{ts,html}`:**
- Add `isImageCell` / `isAudioCell` / `isVideoCell` methods that delegate to
the detection helpers
- Render `<img>`, `<audio controls>`, `<video controls>` tags conditionally
in the table cell template; non-media cells fall through to existing text
rendering unchanged
**Changes to `result-panel-modal.component.{ts,html}`:**
- Build `rowEntries` with per-field media metadata on modal open
- Render media fields inline in the row detail view with a copy-to-clipboard
fallback for the raw URL
**Changes to `result-panel-model.component.scss`:**
- Add modal-toolbar and row-detail styles for media display
**New file — `media-type.util.spec.ts`:**
- 19 unit tests covering all three helpers across data URL prefixes, file
extensions (including case-insensitivity and query strings), the `fal.media`
CDN URL, cross-type rejection, and empty/plain-string inputs
### Any related issues, documentation, discussions?
- Tracking issue: #5674
- Closes: #5674
- Stacked on: #5568
- Parent issue: #5041
### How was this PR tested?
Unit tests in `media-type.util.spec.ts` (19 cases) and
`result-table-frame.component.spec.ts`. Run with `ng test`.
### Was this PR authored or co-authored using generative AI tooling?
Co-authored with Claude Sonnet 4.6 in compliance with ASF guidelines
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
