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

Use NL DS components (where possible) for edit grid component #570

Merged
merged 5 commits into from
Oct 31, 2023

Conversation

sergei-maertens
Copy link
Member

@sergei-maertens sergei-maertens commented Oct 19, 2023

Partially closes #454
Depends on open-formulieren/design-tokens#36

The markup is now more accessible and the theming of the edit grid can be done through design tokens. I tried to go shopping in the utrecht component library but couldn't find any appropriate existing components.

Tasks:

  • Use ButtonGroup component for button row
  • Refactor appointments product step to use broken out edit grid components
  • Refactor markup + classnames of formio edit grid template

@codecov
Copy link

codecov bot commented Oct 19, 2023

Codecov Report

All modified and coverable lines are covered by tests ✅

Comparison is base (418efd4) 55.59% compared to head (d59125d) 71.31%.
Report is 4 commits behind head on main.

Additional details and impacted files
@@             Coverage Diff             @@
##             main     #570       +/-   ##
===========================================
+ Coverage   55.59%   71.31%   +15.72%     
===========================================
  Files         205      212        +7     
  Lines        3745     4295      +550     
  Branches      682     1162      +480     
===========================================
+ Hits         2082     3063      +981     
+ Misses       1471     1199      -272     
+ Partials      192       33      -159     
Files Coverage Δ
src/components/EditGrid/EditGrid.js 100.00% <100.00%> (ø)
src/components/EditGrid/EditGridButtonGroup.js 100.00% <100.00%> (ø)
src/components/EditGrid/EditGridItem.js 100.00% <100.00%> (ø)
...components/appointments/steps/ChooseProductStep.js 100.00% <100.00%> (+11.11%) ⬆️

... and 132 files with indirect coverage changes

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@sergei-maertens sergei-maertens marked this pull request as ready for review October 19, 2023 15:07
@sergei-maertens sergei-maertens force-pushed the refactor/454-nlds-based-editgrid branch from 6536008 to 6c35647 Compare October 23, 2023 12:13
@SilviaAmAm SilviaAmAm self-assigned this Oct 23, 2023
src/components/EditGrid/EditGrid.js Outdated Show resolved Hide resolved
src/components/EditGrid/EditGrid.stories.js Outdated Show resolved Hide resolved
src/components/EditGrid/EditGridItem.stories.js Outdated Show resolved Hide resolved
src/components/appointments/steps/ChooseProductStep.js Outdated Show resolved Hide resolved
src/formio/templates/editGrid.ejs Outdated Show resolved Hide resolved
src/formio/templates/editGrid.ejs Outdated Show resolved Hide resolved
src/formio/templates/editGrid.ejs Outdated Show resolved Hide resolved
src/formio/templates/editGridRow.ejs Outdated Show resolved Hide resolved
@SilviaAmAm SilviaAmAm removed their assignment Oct 23, 2023
@sergei-maertens sergei-maertens force-pushed the refactor/454-nlds-based-editgrid branch 5 times, most recently from 9c855e7 to 38751c4 Compare October 26, 2023 09:08
@sergei-maertens sergei-maertens marked this pull request as draft October 27, 2023 10:29
@sergei-maertens
Copy link
Member Author

Marked as draft again, let's get the button refactor wrapped up first.

@sergei-maertens sergei-maertens force-pushed the refactor/454-nlds-based-editgrid branch from 38751c4 to bc9d4bc Compare October 31, 2023 08:18
@sergei-maertens sergei-maertens marked this pull request as ready for review October 31, 2023 08:52
This release contains the (correct) design token values for the edit
grid
This sets up the edit grid as a proper themable component using
design tokens.
* Replaced the ChooseProductStep React component to use the new
  EditGrid component
* Updated the templates for formio edit grid to emit valid markup and
  make use of our edit grid component classes
@sergei-maertens sergei-maertens force-pushed the refactor/454-nlds-based-editgrid branch from ad11a17 to d59125d Compare October 31, 2023 10:46
@sergei-maertens sergei-maertens merged commit ec86291 into main Oct 31, 2023
12 checks passed
@sergei-maertens sergei-maertens deleted the refactor/454-nlds-based-editgrid branch October 31, 2023 14:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Remove own CSS that conflicts with NL Design System
2 participants