User tests: Successful: Unsuccessful:
So I mentioned about the possibility of blank states in Joomla 4 as a comment on someone's PR a long time ago. It received quite a bit of positive feedback but no one has actually attempted it
So here is "an attempt"
The concept is that rather than a new user getting a first time out of the box experience with "no matching results" or a state that is unhelpful, that the user receives a welcome and an introduction to each area.
This PR is a PROOF OF CONCEPT for Articles ONLY - if it received praise then I might do the others, and others can join in too..
The blank state template is ONLY USED when you have no articles in your database. It is NOT used if a search/filter produces no results (in that case, you would correctly get "No Matching Results" message like you currently do.
This is not a new concept. Everyone else is already doing it.
More examples of Empty State Design:
https://www.toptal.com/designers/ux/empty-state-ux-design
Apply PR on a site with no articles.
Add article - blank state design disappears and you see a list of articles
filter the articles by something (search for kashfdksjhgfkjsdhf) and see that you DONT see the blank slate but you DO get "No Matching Results"
Trash your article - and see that you DONT see the blank slate
Empty your trash (leaving ZERO articles in the db) and see that you DO now see the blank slate
At the moment the out of the box experience (without demo data) is a bunch of left menu items that all lead to blank pages saying "no matching results"
User is "welcomed" to Joomla with a negative messages
Empty State Design / Blank state Design pattern is used.
Screenshots.
Status | New | ⇒ | Pending |
Category | ⇒ | Administration com_content Language & Strings Libraries |
... and the issue tracker can be confused, too.
@PhilETaylor Please remove any emojis from title and description of PRs. They can confuse our CI tools.
/facepalm /voidOfExpression :-)
Title |
|
Beside the above comment (which is fixed now), I like this PR. Much more user friendly way to show there are no items.
Also the "Learn More" button goes to docs.joomla.org - but to an old page... might there be somewhere better...
Also how much help is enough, for example, the above screenshot shows more help than just one button etc...
Actually I can see now that I test it that the text you propose is not correct as it is displayed when you have created articles they just are trashed.
And if you have trashed all the articles then there is no way to select them to permanently delete or to restore them (unless you create a new article). So I guess the check for "blankstate" is not correct.
Labels |
Added:
?
?
|
Actually I can see now that I test it that the text you propose is not correct as it is displayed when you have created articles they just are trashed.
No that should never happen. It was specifically tested for during design.
If you had 1million articles in the trash and zero in the filtered results, then you should never see the blank state.
Same thing happens if I only have unpublished items. So there is a bug there.
No that should never happen. It was specifically tested for during design.
Same thing happens if I only have unpublished items. So there is a bug there.
ok, well one I cannot replicate at the moment - see the video.
Something weird is going on - trying to replicate it reliably
I think, that it will be better to add this page "looks like..." to other menu items under the same visibility conditions: categories, featured articles, fields, field groups and menus.
@PhilETaylor what do you think about it?
I cannot replicate that - I can select any state and never see the blank state - I just see no matching results.
yeah I can replicate that now - when you have a category selected - ok, coffee and then I'll take a look. I was trying to implement the check in the db layer so that it can be generic and reusable.
Phil I can replicate it in any scenario where there are no matching results and I assume that you only meant this to be displayed when there are no records at all
I think, that it will be better to add this page "looks like..." to other menu items under the same visibility conditions: categories, featured articles, fields, field groups and menus.
Read my opening comments.
"This PR is a PROOF OF CONCEPT for Articles ONLY - if it received praise then I might do the others, and others can join in too.."
The "Others" meaning the other left menu items.
Phil I can replicate it in any scenario where there are no matching results and I assume that you only meant this to be displayed when there are no records at all
Im looking, but that is certainly not what I get. The ONLY time you should ever see blank state is if the database table is is totally empty (has zero rows in the database as looked up by SELECT count(*) from #__TABLENAME
)
Coffee fixes everything...
pull again now - should be fixed
Yes that did it. This is a great improvement.
Happy to work through other components and create PR for those. ITs easy enough now you did the hard work.
I would actually use $this->setLayout('blankstate')
in the view instead of requiring the blankstate layout in the default layout. This would make the code simpler and you could even get rid of $this->isBlankState
.
The hard part is the reusable part in libraries/src/MVC/Model/ListModel.php
- the hard thing was to try and make it generic and reusable without having to code it for each component
I would actually use $this->setLayout('blankstate')
DAMN... I tried everything to try to work that out.... let me try that... I was setting $tpl...
Hehe, I use it in my component, that's why I knew it existed. I remember that I first tried with $tpl as well back then :-)
Done. Love it. Thanks.
So just the language string and I can mark it as a successful test
So just the language string and I can mark it as a successful test
I dont see any outstanding changes Brian, maybe GitHub caching ?
Screenshot now updated in initial comment.
I have tested this item
I have tested this item
Fire!
Ive added the blank state for Featured Articles page too - just as it is still com_content and very quick to add to this PR. Sorry, should not really invalidate your tests, but a quick check might be appreciated.
@PhilETaylor The system tests are failing constantly at the same place, I have restarted them 2 times already. They fail at "ContentListCest: Test that it loads without php notices and warnings.". Not sure if it's related to your PR, but it could be.
I'll take a look, thanks.
$I->wantToTest('that it loads without php notices and warnings.');
$I->amOnPage(ContentListPage::$url);
$I->waitForElement(ContentListPage::$filterSearch);
$I->checkForPhpNoticesOrWarnings();
Ok Im guessing this test is looking for the filterSearch options stuff and obviously those no longer show on a blank state. I'll try to fix the tests, as the tests are now wrong, not the new code.
... as the tests are now wrong, not the new code.
Exactly that was my assumption.
Category | Administration com_content Language & Strings Libraries | ⇒ | Administration com_content Language & Strings Libraries Unit Tests |
OK, but incomplete, skipped, or risky tests!
--
1471 | Tests: 41, Assertions: 214, Skipped: 4.
Tests look fixed.
I lied :(
@PhilETaylor MySQL (<8) and MySQL 8 system test passed. Only the PostgreSQL test was failing at that place with a timeout. Will restart drone to see if it was maybe just the unluck we have sometimes.
failed again. No idea. Is there a way to get the screenshot/html that it says it saved when the test failed?
@PhilETaylor Do you have access to this? https://ci.joomla.org/artifacts/joomla/joomla-cms/4.0-dev/33264/system-tests/42315/ ... the link can be found when choosing the "arifacts-system-tests" in the drone results.
42803 42803, 7, ERROR: column "a.id" must appear in the GROUP BY clause or be used in an aggregate function LINE 13: ORDER BY a.id desc LIMIT 20 ^
strange... as my query has no limit of 20 :)
I guess Im spending the night learning postgres
SQL syntax. PostgreSQL is more strict with that, it seems. Do you understand it or shall I help later after my JBS meeting has finished?
I have replicated it locally now, now to debug, like I said, my only SQL change has no limit so must be something else...
fixed locally :)
Labels |
Added:
?
|
@PhilETaylor I guess that was it. But it's not only PostgreSQL which requires it, MySQL would require it too if sunning in strict mode, Oracle would require it (if we would support that).
Labels |
Added:
?
Removed: ? |
I love this :) Lets get some tests and get it in. Thankyou so much!!
I have tested this item
I have tested this item
Very nice feature! Thanks!
I've advertised a bit a JoomlaDay USA, so we did not have to wait very long for testers
Status | Pending | ⇒ | Ready to Commit |
RTC
I've advertised a bit a JoomlaDay USA
And to think, I turned down a personal invitation to be their major sponsor this year... haha.
Status | Ready to Commit | ⇒ | Fixed in Code Base |
Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2021-04-24 08:18:47 |
Closed_By | ⇒ | rdeutz | |
Labels |
Added:
?
?
Removed: ? |
@PhilETaylor Please remove any emojis from title and description of PRs. They can confuse our CI tools.