Skip to content

Conversation

@kmcgrady
Copy link
Collaborator

@kmcgrady kmcgrady commented Dec 29, 2022

📚 Context

  • What kind of change does this PR introduce?

    • Feature

🧠 Description of Changes

  • This is a visible (user-facing) change

Revised:

Insert screenshot of your updated UI/code here

Current:

Insert screenshot of existing UI/code here

🧪 Testing Done

  • Screenshots included
  • Added/Updated unit tests
  • Added/Updated e2e tests

🌐 References

Does this depend on other work, documents, or tickets?

  • Issue: Closes #XXXX

Contribution License Agreement

By submitting this pull request you agree that all contributions to this project are made under the Apache 2.0 license.

@kmcgrady kmcgrady mentioned this pull request Dec 29, 2022
4 tasks
cbensimon and others added 7 commits December 29, 2022 19:38
* Made sure iframe resizer is loaded when only embedded
* Make block container not grow when embedded
* Make footer removal more explicit when embedded
* Some clean up of tests
@kmcgrady kmcgrady added the security-assessment-completed Security assessment has been completed for PR label Dec 30, 2022
@cbensimon
Copy link
Contributor

cbensimon commented Jan 4, 2023

@kmcgrady I didn't look at the implementation details too much but I tested it in several environments (Hugging Face Spaces, embed mode in Streamlit blog, etc.) and it works like a charm !

@kmcgrady
Copy link
Collaborator Author

kmcgrady commented Jan 6, 2023

Hey @cbensimon ! Just keeping you updated. I got some tests in and I think it's about ready for the code review. We'll see if it makes our CI happy. The cutoff for the next release is supposed to be Sunday night, so we might get this in time. That being said, I want to make sure it's quality and we tested all scenarios. If not, the next release should be about end of the month.

Feel free to test again. I made some tweaks but mostly cosmetic.

@kmcgrady kmcgrady marked this pull request as ready for review January 6, 2023 19:08
Copy link
Contributor

@tconkling tconkling left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good - most of my feedback is just asking for little explanatory comments in places where I felt a bit lost.

One other thing: the syntax_highlighting snapshot changes - are those intentionally part of this PR? Why did they change?

Comment on lines +103 to +108
export const StyledAppViewBlockSpacer = styled.div(({ theme }) => {
return {
width: theme.sizes.full,
flexGrow: 1,
}
})
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks like we don't really add docstrings for these little styled visual elements, but could we start? Like: what does this element do, and where/why do we use it?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm happy to though convention/nomenclature explains this. Let me know if you feel it's worth explicitly saying.

  • Spacer is a common term for just an element for the sole purpose to take up space.
  • convention shows that the use of this is to provide a spacer in the AppView. Perhaps it makes sense for the comment to be in there to see why this Spacer is included here?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I assumed this was an AppView-specific element - a "block spacer that we only use in AppView". But if it's just a generic spacer that we'd use in a bunch of places, should it instead live in the top-level styled-components (as just StyledBlockSpacer)?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think there's a reason to look into writing up some generic styled components, but this might not be the best example to put there at the moment. In a way, these are spacers that fit in the flexbox framework where other spacers might require different layout engines, which adds more complexity for this case.

@kmcgrady
Copy link
Collaborator Author

kmcgrady commented Jan 6, 2023

To answer the question, yes, the syntax highlighting screenshots are added intentionally. Before the Vertical Block took up so much space because it grew to fit the screen. This change makes the height natural (reflecting the goal to get the actual height. A spacer is included to fill up the space, which keeps the same desired look. The Screenshot is over the div that no longer shows the "grow-to-fit"

@kmcgrady kmcgrady merged commit 2e2dc27 into streamlit:develop Jan 6, 2023
@kmcgrady kmcgrady deleted the fix/iframe-resizer branch January 6, 2023 22:37
tconkling added a commit that referenced this pull request Jan 9, 2023
* develop:
  Bump mheap/github-action-required-labels from 2.2.3 to 3.0.0 (#5901)
  Add Iframe resizing ability (#5894)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

security-assessment-completed Security assessment has been completed for PR

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants