shadcn.io is not affiliated with official shadcn/ui
Access Logs Dashboard Block for Solid
Twenty edge-proxy requests in a dense table with method and status filters, a path search that counts matches, and an inspector with headers, a timing bar and Copy as cURL.
Installation
Overview
Find the one request that went wrong, with this access log panel for Solid with Ark UI. Inside a hairline frame with a plus mark on each corner, a band of controls sits over a dense table of twenty Hitledger edge requests: time in mono, method as an outline Badge, the path, the status, the time taken and, from the large breakpoint, the user agent. Two Toggle Groups filter by method and by status class, and a search in an Input Group marks the matches in the paths with Search Highlight Text and counts them ("7 of 20"). Choosing a row fills the side cell with the request: its status line, six headers, a timing bar split into connect, TLS, wait and transfer with the numbers beside it, and a Copy as cURL button. The table sits in a fixed-height region, and a filter that finds nothing shows an Empty state with a way back. It's built from Toggle Group, Input Group, Search Highlight Text, Badge, Button, Empty and Guides. For edge proxies, API gateways and support tools.
FAQ
How do I fill it with my own requests?
Edit the REQUESTS list. Each one is built by the R helper from a time, a method, a path, a status, four timings in milliseconds (connect, TLS, wait, transfer), a user agent and a few facts (size, cache state, client address, content type). The total time, the timing bar's widths, the status class and the failed count in the header are all worked out from those, so nothing is typed twice.
How do the filters and the search combine?
All three narrow the same list: a request has to match the method, the status class and the search text together. The search looks at the method, the path and the user agent, ignoring case, and marks only the path. The polite status line says what is showing ("Showing 3 of 20 requests: POST and 4xx") a moment after you stop typing.
What does Copy as cURL copy, and does it send anything?
It writes a command built from the chosen request (method, address and two headers) to the clipboard and nothing else. It does not call the host. If the browser refuses clipboard access the status line says so. To use it for real, point HOST at your proxy and add the headers your API needs.
What stays local, and how do I wire it for real?
Everything: the requests are typed for one minute on 12 Oct and nothing is logged or fetched. Replace REQUESTS with a page from your log store, keep the table in its scroll region, and load the next page when the region reaches its end.
Can I use it without a pointer?
Yes. Each request's path is a real button, the table has a caption, column heads and row heads, the scroll region takes the keyboard, and the selected row is marked with aria-current. Failed requests are bold, and a server error also gets an icon, so colour is never the only signal.