feat: plugin sizing updates #902
Merged
Conversation
This file contains 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
amcgee
approved these changes
Jan 22, 2025
shell/src/PluginLoader.jsx
Outdated
Comment on lines
110
to
112
| const [resizePluginHeight, setResizePluginHeight] = useState(null) | ||
| const [resizePluginWidth, setResizePluginWidth] = useState(null) | ||
| const [pluginClientWidth, setPluginClientWidth] = useState(null) |
There was a problem hiding this comment.
Maybe we could add comments explaining the difference between clientWidth, resizePluginWidth, and pluginClientWidth? The names are a bit confusing if you don't have much context
|
dhis2-bot
added a commit
that referenced
this pull request
Jan 23, 2025
# [12.1.0](v12.0.0...v12.1.0) (2025-01-23) ### Features * plugin sizing updates ([#902](#902)) ([1136e0d](1136e0d))
|
🎉 This PR is included in version 12.1.0 🎉 The release is available on:
Your semantic-release bot 📦🚀 |
KaiVandivier
added a commit
that referenced
this pull request
Jan 23, 2025
Supports easier-to-use plugin sizing and improves performance. Should be paired with app-runtime >=3.13.0. See https://dhis2.atlassian.net/browse/LIBS-723 * feat(plugin): simpler sizing; content-driven size without animation loop * fix(plugins): remove scrollbar padding * fix: resize dif references
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.
Address LIBS-723
Requires app-runtime changes (dhis2/app-runtime#1398)
width: autowidth: auto, sowidth: 100%is currently used -- margins don't work as expected in this case thoughwidth: autobehavior could work with a<div>around theiframe, where thedivuses theautowidth and the iframe useswidth: 100%to match that sizePlugincomponent's JSX, but it messes with flex styles, so I wrote up some guidance on how to get the right margin behavior insteadclassNameprop to<Plugin>and the underlying iframecontentWidthprop is used on thePlugincomponent, then the width of the iframe will be based off the contents insideoffsetHeightshould measure a scrollbar heightI used patch-package to make it easier to test this out with app-runtime changes. I made 6 test cases in a component in the simple app to use:
height: 100%Screen.Recording.2024-12-17.at.14.20.12.mov
To do and known issues
Before review:
divaround iframe to get default 'auto' width of divs (and iframe has width(/height?) 100% by default). Update: tried this out, and it makes the right behavior forwidth: auto, but breaks other height behaviors. I don't think it's worth doingAfter review: