feat: add Base64 to Image Converter utility #138
Merged
+324
−0
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
Adds a new Base64 to Image Converter utility that allows users to paste Base64-encoded image data and instantly see a preview of the decoded image. This is the reverse operation of the existing Image to Base64 converter.
The new utility:
data:image/png;base64,...)Also adds cross-references from the Image to Base64 utility back to this new tool, as users often need both directions.
Updates since last revision
Base64ToImageSEO.tsxmb-4tomt-6margins) to prevent layout jumping when error messages appear/disappearReview & Testing Checklist for Human
/utilities/svg-viewer) to ensure consistency.atob()to validate Base64 strings. When raw Base64 is provided (without data URI prefix), it defaults toimage/pngMIME type - verify this works for JPEG, GIF, WebP images as well since browsers typically auto-detect the format./utilities/base64-to-imageand test with various Base64-encoded images (PNG, JPEG, etc.) to ensure the preview displays correctly.Suggested test plan:
npm run devand navigate to/utilities/base64-to-imagedata:image/...prefix)/utilities/svg-viewerfor consistencyNotes
Link to Devin run: https://app.devin.ai/sessions/0ac4a7a18a95449aa9b022d163d3396f
Requested by: @peckz