CHORE: DRY/componentize app_live.html.heex

[nelsonic]

At present the lib/app_web/live/app_live.html.heex file has a few bits of repeated nearly identical code. 🙄
This was done in the interest of speed but is not very maintainable and requires lots of scrolling.

Todo

• split out the various tags e.g. <form>, <button> and timer into reusable components.

Please see: https://hexdocs.pm/phoenix_live_view/Phoenix.LiveComponent.html
Note: please wait for #89 / #90 to be complete/merged before tackling this. 🙏 ⏳
And if you are undertaking this chore, please document all the steps with instructions in the README.md 📝

[SimonLab]

Adding the select input for tags (see #209) and the edit timer (#196 ) make the heex file even longer and it becomes difficult to read, navigate and update.

I'm looking at this now as it has become a blocker for me to be add the select input tags when editing existing items

[nelsonic]

@SimonLab thanks for taking a look at it. If possible, could you port what you learn back to one of the tutorials
e.g: https://github.com/dwyl/phoenix-liveview-todo-list-tutorial so the learning is easier to digest? 🙏

[nelsonic]

We recently extended the counter tutorial to include LiveView Components:
https://github.com/dwyl/phoenix-liveview-counter-tutorial#bonus-level-use-a-liveview-component-optional

Feel like this could be tackled now. 💭