Improve status page frontend - #442
Conversation
There was a problem hiding this comment.
馃挕 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 238ed5bca9
鈩癸笍 About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 馃憤.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| @once | ||
| @vite('resources/js/metrics.js', 'vendor/cachethq/cachet/build') | ||
| @endonce |
There was a problem hiding this comment.
Load the metrics initializer before Alpine starts
On every status page containing a metric chart, this directive emits the metrics module in the body after the layout's head-loaded cachet.js. Because module scripts are deferred and execute in document order, cachet.js calls Alpine.start() first; the inline alpine:init handler then captures window.cachetMetricChart while it is still undefined, so the component has no init callback and the chart remains blank. Load/register the metrics initializer before starting Alpine.
Useful? React with 馃憤聽/ 馃憥.
| x-on:click="period = {{ $value->value }}" | ||
| x-bind:aria-selected="period === {{ $value->value }} ? 'true' : 'false'" | ||
| x-bind:tabindex="period === {{ $value->value }} ? 0 : -1" |
There was a problem hiding this comment.
Add keyboard navigation before removing tabs from tab order
For keyboard-only users, setting every inactive period tab to tabindex="-1" makes those controls unreachable because this custom tablist has no Left/Right, Home, or End key handlers. Either use the already loaded Alpine UI tabs primitive or implement the expected focus navigation before applying roving tabindex; otherwise users can view only the initially selected period.
AGENTS.md reference: AGENTS.md:L165-L167
Useful? React with 馃憤聽/ 馃憥.
Summary
Testing
npm run buildvendor/bin/pint --dirty --testphp84 -d memory_limit=512M vendor/bin/pest --ci --compact(1,053 passed, 2 todos; 3,850 assertions)