Add sidebar panel to element edit pages

[bencroker]

This PR adds a sidebar panel to element edit pages for elements that have URLs, showing the current cache status of the page (cached/expired/uncached). If the status is cached or expired then a Refresh button appears next to it that refreshes the cached page in the background.

Displaying the cache date is only possible if the ”Cached by” comment has been enabled, therefore I’m opting against including it in the sidebar panel.

A new user permission determines which users can view the sidebar panel.

[justenh]

@bencroker Thank you for putting this PR up! Would it be possible to have the widget display timestamp information from the connected cache file? This is the crux of most of our customer issues. We field a lot of questions about why a particular page didn't refresh properly, and it would be helpful to see, at a glance, the date the cache file was created/updated.

[bencroker]

@justenh See my note above.

Displaying the cache date is only possible if the ”Cached by” comment has been enabled, therefore I’m opting against including it in the sidebar panel.

Relying on the filesystem is not possible either, since cached data can be stored in Redis, the DB, etc. where no timestamp exists.

[bencroker]

It might be possible to add a timestamp column to the database for easier tracking of this here and in the Blitz diagnostics utility, I’ll look into it.

[justenh]

@bencroker Appreciate you looking into that. It would be a really big help for our customer support process.

[bencroker]

Added a dateCached column to the cache record so we can now display this info in the sidebar panel and the Blitz diagnostics utility.

[russback]

@bencroker thanks for this. Is this based on the DB record or the actual file returned by an HTTP request?

[russback]

@bencroker just adding here from email conversation, it would be great to be able to see an indication of why a page is not cached too (e.g. because of an exclusion rule) and also the cache strategy (i.e. purge on save, expire on save).

[bencroker]

@bencroker thanks for this. Is this based on the DB record or the actual file returned by an HTTP request?

This is based on the DB record, which provided a cached value exists, should be an accurate indication of when the page was last cached.

@bencroker just adding here from email conversation, it would be great to be able to see an indication of why a page is not cached too (e.g. because of an exclusion rule) and also the cache strategy (i.e. purge on save, expire on save).

Honestly, that feels too developer centric to be shown to content authors (which is what the sidebar panel is aimed at). The diagnostics utility feels more appropriate for finding implementation details.

[justenh]

@bencroker The addition of the "Cached At" and "Expires At" fields are perfect for our needs. I agree that the refresh strategy wouldn't be too helpful considering it's set site-wide and not specific to a particular element. We rarely leverage the exclusion rules, but I could see where that would be helpful.

[russback]

Thanks again @bencroker.

I would suggest that the diagnostics utility is the developer-centric area and not one we would direct editors to, and instead having an indication of what will happen when you save an entry - in situ - is very much in the interests of the editor rather than the developer.

The most common issue we're finding is that there is confusion over why entry changes aren't displaying, so clearly showing this info (regardless of whether that's down to developer config or not) is something we think will help.

But we can always add our own sidebar or UI element to add our own flavour if this isn't the general view.

[bencroker]

having an indication of what will happen when you save an entry - in situ - is very much in the interests of the editor rather than the developer.

Agreed, but I don’t think editors should be expected to understand Blitz settings and I’m not sure how this could be displayed in layperson terms.

I’ll be sure to add an event that you can use to easily add to, or overwrite, the contents of the sidebar.

[bencroker]

@russback You’ll be able to overwrite or add to the sidebar panel markup using the EVENT_DEFINE_META_FIELDS_HTML event as follows.

use craft\events\DefineElementEditorHtmlEvent;
use putyourlightson\blitz\helpers\ElementSidebarHelper;
use yii\base\Event;

Event::on(
    ElementSidebarHelper::class,
    ElementSidebarHelper::EVENT_DEFINE_META_FIELDS_HTML,
    function(DefineElementEditorHtmlEvent $event) {
        $event->html .= '
            <div class="data">
                <div class="heading">
                    Refresh Mode
                </div>
                <div class="value">
                    Explanation here...
                </div>
            </div>';
    }
);

[bencroker]

Added an indication when a page is both uncached and not cacheable due to the Blitz URI pattern settings.

[bencroker]

Released in 4.22.0 and 5.6.0. Thanks for all the input!