Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

🐛 MTA-1997 fix for column layout changing widths upon creation/deletion #1807

Merged
merged 2 commits into from
Apr 16, 2024

Conversation

ibolton336
Copy link
Member

@ibolton336 ibolton336 commented Mar 29, 2024

Resolves https://issues.redhat.com/browse/MTA-1997
Match space allocation between column headers and rows to prevent layout shift when the first / last item is added / removed from the table.
Before:

Screen.Recording.2024-03-29.at.3.43.19.PM.mov

After:

Screen.Recording.2024-03-29.at.3.42.13.PM.mov
  • Also addresses mishandling of TBody resulting in several Tbody elements rendered for each row in the table.

@ibolton336 ibolton336 force-pushed the align-columns branch 3 times, most recently from 798e4a4 to 7b85e5d Compare April 3, 2024 18:06
@ibolton336 ibolton336 marked this pull request as draft April 4, 2024 13:59
@ibolton336 ibolton336 changed the title 🐛 MTA-1997 partial fix for applications 🐛 MTA-1997 fix for column layout changing widths upon creation/deletion Apr 4, 2024
@ibolton336 ibolton336 marked this pull request as ready for review April 9, 2024 13:34
Copy link
Member

@sjd78 sjd78 left a comment

Choose a reason for hiding this comment

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

LGTM

<Td
width={10}
{...getTdProps({ columnKey: "description" })}
<Tbody key={stakeholderGroups?.length}>
Copy link
Member

Choose a reason for hiding this comment

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

I know multiple Tbody tags are allowable, but with PF styling things could get wonky. Good idea to pull it out!

@ibolton336 ibolton336 added the cherry-pick/release-0.3 This PR should be cherry-picked to release-0.3 branch. label Apr 16, 2024
@ibolton336 ibolton336 merged commit d8d1ede into konveyor:main Apr 16, 2024
7 checks passed
ibolton336 added a commit to ibolton336/tackle2-ui that referenced this pull request Apr 16, 2024
…on (konveyor#1807)

Resolves https://issues.redhat.com/browse/MTA-1997
Match space allocation between column headers and rows to prevent layout
shift when the first / last item is added / removed from the table.
Before:

https://github.com/konveyor/tackle2-ui/assets/11218376/e5564ea6-e78c-4fc0-92f2-dea496d6b88f

After:

https://github.com/konveyor/tackle2-ui/assets/11218376/7d12ddbd-c46a-4b06-970d-876fe2f90421

- Also addresses mishandling of TBody resulting in several Tbody
elements rendered for each row in the table.

Signed-off-by: Ian Bolton <[email protected]>
ibolton336 added a commit that referenced this pull request Apr 16, 2024
…1853)

…letion (#1807)

Resolves https://issues.redhat.com/browse/MTA-1997 Match space
allocation between column headers and rows to prevent layout shift when
the first / last item is added / removed from the table. Before:


https://github.com/konveyor/tackle2-ui/assets/11218376/e5564ea6-e78c-4fc0-92f2-dea496d6b88f

After:


https://github.com/konveyor/tackle2-ui/assets/11218376/7d12ddbd-c46a-4b06-970d-876fe2f90421

- Also addresses mishandling of TBody resulting in several Tbody
elements rendered for each row in the table.

<!--
## PR Title Prefix

Every **PR Title** should be prefixed with :text: to indicate its type.

- Breaking change: ⚠️ (`⚠️`)
- Non-breaking feature: ✨ (`✨`)
- Patch fix: 🐛 (`🐛`)
- Docs: 📖 (`📖`)
- Infra/Tests/Other: 🌱 (`🌱`)
- No release note: 👻 (`👻`)

For example, a pull request containing breaking changes might look like
`⚠️ My pull request contains breaking changes`.

Since GitHub supports emoji aliases (ie. `👻`), there is no need to
include
the emoji directly in the PR title -- **please use the alias**. It used
to be
the case that projects using emojis for PR typing had to include the
emoji
directly because GitHub didn't render the alias. Given that `⚠️`
is
easy enough to read as text, easy to parse in release tooling, and
rendered in
GitHub well, we prefer to standardize on the alias.

For more information, please see the Konveyor
[Versioning
Doc](https://github.com/konveyor/release-tools/blob/main/VERSIONING.md).
-->

Signed-off-by: Ian Bolton <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
cherry-pick/release-0.3 This PR should be cherry-picked to release-0.3 branch.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants