#153 Refactoring Hotwire Modals
21/11/2023
Free
I AM SORRY for not providing the complete, best approach right away.
In E151 we connected turbo frame modals
with the html dialog element.
However this approach was not optimal:
- We were needlessly adding a stimulus controller on the BODY html tag;
- dialog html was present in the layout file, even if we do not need it right now;
Let's clean up the mess and make our modals even better! β¨
Special thanks to @ledockol for pushing me on this one! πͺ
Episode source code: https://github.com/corsego/151-dialog-turbo-modals/commit/6f4869005c28aca372319cc4f0f9e7e1ddd8a0e1
Based on this blogpost: https://blog.corsego.com/turbo-modal-dialog#refactoring
0:00 old implementation
0:38 I AM SORRY
1:12 move modal dialog from body to new.html.erb
5:40 reusable dialog wrapper
7:59 restrict opening modals in new tabs
0
Sign in to join the conversation
Recommended based on what you are watching now
![#84 Cookies Consent Banner](https://superails.com/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsiZGF0YSI6MTg3NiwicHVyIjoiYmxvYl9pZCJ9fQ==--0b38d426b003c6db8201a50ec6e7f26a9f590de2/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOls0MDAsNjAwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--2d7cd3a4d9675c7f4c17dad7856d799792bd3595/maxresdefault.jpg)
10:10
#84 Cookies Consent Banner
27/06/2022
Free
![#98 Inline editing attributes with Hotwire](https://superails.com/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsiZGF0YSI6MTg3MCwicHVyIjoiYmxvYl9pZCJ9fQ==--a3debf8965aca083abb7f86394db7d416e5cce9e/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOls0MDAsNjAwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--2d7cd3a4d9675c7f4c17dad7856d799792bd3595/maxresdefault.jpg)
14:38
#98 Inline editing attributes with Hotwire
05/12/2022
Free
![Friendly Show E7 October summary, Brovember plans](https://superails.com/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsiZGF0YSI6MTk0MiwicHVyIjoiYmxvYl9pZCJ9fQ==--5009eb8bb2f36496c48d30585ba7e231daaceaee/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOls0MDAsNjAwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--2d7cd3a4d9675c7f4c17dad7856d799792bd3595/maxresdefault.jpg)
36:23
Friendly Show E7 October summary, Brovember plans
02/11/2023
Free
![#80 Dynamic Forms with Turbo (not JS approach)](https://superails.com/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsiZGF0YSI6MTkwNSwicHVyIjoiYmxvYl9pZCJ9fQ==--18fbb5c8a369b39d5843dde1959a17ed192ed125/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOls0MDAsNjAwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--2d7cd3a4d9675c7f4c17dad7856d799792bd3595/maxresdefault.jpg)
18:23
#80 Dynamic Forms with Turbo (not JS approach)
26/05/2022
Free
1