feat(layout): add patternfly to layout #13
Merged
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.
tldr: This PR implements SECURESIGN-586 to add PatternFly to the layout, leaving subcomponents alone (to follow in a separate PR shortly). Feel free to leave unmerged until the second PR with subcomponents if you do not want to merge it partially implemented (see screenshots below).
Context:
I was originally wanting to follow an approach where we can map to the upstream code by wrapping the components, such that they can support modifications, to make diffing clearer and maintenance easier when changes are inevitably made upstream, but this was taking too much time and ultimately was not as clean as I had hoped and would otherwise be over-engineered. There might also have a performance hit given that the components are not leveraging React server-components and would need to be rendered by the browser, so manually swapping out Material UI for PatternFly seems to be the best solution (for now).
Changes:
A future PR can improve on this code by adding unit (and e2e?) tests, which upstream does not have, and possibly mapping components to sections in the upstream UI rather than 1:1 component mapping.
Screenshots
Empty state:
Search results:
Settings: