Problem/Motivation
The current job form review method and corresponding templates are very long and very hard to understand. Especially the new source diff and validation messages output added quite a bit of additional completely to both and add incorrect and broken logic to the global template.
Proposed resolution
Convert the two theme functions to a single twig template.
Remaining tasks
User interface changes
API changes
Data model changes
| Comment | File | Size | Author |
|---|---|---|---|
| #17 | interdiff-2695153-14-17.txt | 1.84 KB | johnchque |
| #17 | convert_review_form-2695153-17.patch | 47.32 KB | johnchque |
| #14 | interdiff-2695153-11-13.txt | 1.73 KB | johnchque |
| #14 | convert_review_form-2695153-13.patch | 47.2 KB | johnchque |
| #11 | interdiff-2695153-10-11.txt | 1.77 KB | johnchque |
Comments
Comment #2
berdirThis patch trades 170 lines of PHP code in the theme and helper functions with a single 72 loc twig template :)
The reason for the additional code in the theme functions was that they contained a lot of logic:
* Trying to show per-element messages (validation, source diff) through the review-form theme function. Which was broken in different ways (e.g. only showing a single message per group of fields) and unecessary complex
* The theme functions also grouped elements that only differed on the last part of the label into groups and did so dynamically in a loop. That was extremely hard to understand.
This patch makes two major changes in JobItemForm to avoid that. I plan to clean this up further
* Groups are now defined upfront based on the key structure in the form. That means each element is now nested inside the group. Maybe the nested group thing will go away again by using #group, will need to check if that works.
* Use of the existing special below structure for show diff an validation messages. Those are automatically placed in a special area below the main elements.
* Additionally, show diff and validation structure is cleaned up, some classes moved to the render arrays, duplicated things, bogus labels and more removed. That was previously hidden because the theme function accessed deeply nested keys that were sometimes bogus (#value vs. #markup for example) and skipped labels and other things.
There are some visual regressions due to putting multiple elements in the below space and also different classes/markup. Will look into those later.
Comment #4
miro_dietikerThat looks like an amazing cleanup.
Some quick review:
I'm confused this is a colspan 5 and not a 4.
Multiple tbody in a table?
I fear a bit that we are breaking existing translators / providers that estend the review form through alteration.
What is the strategy to deal with those?
Comment #5
berdirYeah, copied that 5 from the existing code, but that doesn't make sense, fixed.
Yes, multiple tbody is valid, we have one for each group, which is everything that has the same label hierarchy, each with a header row.
We had that before, except that according to the failing test, we had an inconsistency for a field with multiple deltas but only a single property. Had to fix a test for that. Also made a few other fixes.
Comment #6
berdirOk, here's the next and probably last major step. I split up the huge method, did a bunch of simplifications and method renaming.
Patch will probably be impossible to review, just look at the result instead. Most important changes:
* Moved most of the code into 4 separate methods, makes the main method way easier to understand. Arguments are not too consistent, I was wondering if we could share some code between the review and translate form, but I'm not so sure yet. They probably have small differences in most places.
* Renamed $target_key to $field_name and also other variables like $form to $review_element (it's not $form, that was always a lie).
* I added simple variables for $data[$key] ($data_item) and $form[$group_name][$field_name] ($item_element), makes passing them to method much easier and also makes things way more readable.
* I also tried to avoid unnecessary usage of $target_key/$field_name and conversions to/from it. Mostly in the new source change code.
This still has visual problems that we need to look at. Especially when combining multiple things (e.g. html validation but that looks bad atm too) and source changes. I also killed off the $zebra stuff, but as we've seen before, that means we lose some spacing then, but we can just add that back ourself I think.
Comment #8
berdirOops.
Comment #9
miro_dietikerQuickly skimmed through the diff. Looks pretty nice, especially the new structure.
Didn't really do a full review though and no manual testing done.
Comment #10
johnchqueDid some manual test, looks good, discussed with @miro_dietiker about buttons and spaces.
Tried a bit with deltas, diffs and warning messages. Looks like that with the patch:
Comment #11
johnchqueDiscussed with @Berdir, the name of the twig template should avoid the 'review' name, should be Ok now, tested again and it works fine.
Comment #14
johnchqueDiscussed, there was a form with the new id, changed again. :)
Comment #15
miro_dietikerIsn't this the level where the position:absolute should be defined consistently?
Also i think the interdiff adjustments for layout consistency should be commented.
Also here we should have a consistent selector.
This added span is so unsemantic. Why is it needed? CSS should not rely on presence of a generic span. At least be classy.
Comment #16
johnchque1. The level should be in the level of the text it did not work for me otherwise.
2. After checking the state cell and the actions cell I think it was the best way to do it.
3. The span adds a spacing between the button and the message.
But maybe there is a better way to do it.
Comment #17
johnchqueDiscussed with @miro_dietiker and @Berdir , this should be fine :D .
Comment #19
berdirThanks for testing and the fixes. Committed.