shadcn.io is not affiliated with official shadcn/ui
Batch Processing Dashboard Block for React
A bulk import drawn as 120 chunk cells that tell done, running, failed and pending apart by shape, a select for five batches, a table of failed chunks with their rows and errors, a throughput line with an ETA, Pause and Retry.
Installation
Overview
See which part of a bulk import failed and put it back in line, with this batch panel for React with Base UI. A Native Select in the header picks one of five Bulkpress imports, and a hairline frame with a plus mark on each corner draws it as a grid of 120 cells, one for each chunk of rows. Done is solid, running is ringed with a dot, failed is ringed with a cross and pending is empty, so the states read without colour. Pressing a failed cell picks its chunk in a table of failed chunks, which lists its row range and the row that broke it. A line shows throughput for the last 24 minutes with the current rate stated and an ETA worked out as the rows left divided by that rate. Pause and Resume change the state line ("Paused at 41%"), and the Shine Button Retry failed chunks puts every failed chunk back to pending. It's built from Native Select, Shine Button, Button and Guides. For data importers, migration tools and back-office consoles.
FAQ
How do I fill it with my own batches?
Edit BATCHES. Each has a name, the rows in each chunk (chunkRows), the cursor (the first chunk that isn't finished), how many chunks are running, the current rate in rows a second and a list of failures, each with a chunk, the row inside it and a message. The cells, the counts, the row ranges, the rows left and the ETA are worked out from those.
How is the ETA worked out?
It is the rows still to write (pending and running chunks times the rows in a chunk, with failed chunks left out) divided by the current rate in rows a second, shown as "under a minute", minutes or hours. It doesn't smooth the rate, so it moves when the rate does, and while the batch is paused it says paused.
What does Retry failed chunks do?
It turns every failed chunk of the chosen batch back into a pending one, so the count in the button goes to zero, the table shows its empty state and the rows left grow by those chunks. It doesn't run them.
What stays local, and how do I wire it for real?
Everything: the batches, the failures and the throughput are typed or seeded, and Pause and Retry change only what is drawn and say so in the state line. Wire Pause and Retry to your importer's job API, read the chunk states from its progress endpoint, and poll it for the rate.
Can I use it without a pointer?
Yes. Only the failed cells are buttons, each named with its chunk, its rows and "failed", so the keyboard reaches exactly the cells that need a decision. Every cell state also has a shape, not just a tone, and a hidden sentence counts them all ("49 chunks done, 3 running, 7 failed and 61 pending"). The table of failed chunks is a scrollable region you can focus, and a polite line in the foot reads each action.