Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Dashboard blocks

Pro

Snapshot Backups Dashboard Block for React

Pick two of eight database snapshots to see which tables changed between them, with rows added and removed, size change and each snapshot's checksum to copy.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Get ProSign in
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

Compare two backups before you restore one with this snapshot panel for React with Base UI. A hairline frame with a plus mark on each corner opens with a From and a To Native Select over eight Vaultsnap snapshots, each option naming the day, the type (full, incremental or differential) and the size. Under them the tables that changed between the two are listed with rows added, rows removed and the size change, largest first, with one sentence on the total, such as "3 tables changed, +4.1 GB". A failed snapshot is listed but cannot be picked, and its option says why. The checksum of each snapshot sits at the foot with a Copy Button. It's built from Native Select, Copy Button, Badge, Empty and Guides. For backup consoles and restore reviews.

FAQ

How do I fill it with my snapshots?

Edit SNAPSHOTS (a name, a type, a size in GB, an ISO day and a SHA-256) and TABLES, where each table has the rows added, rows removed and size change between one snapshot and the next. A comparison adds up the steps between the two days you pick.

Why can I not pick the 10 Oct snapshot?

It failed at 02:14 with a full disk, so there is no archive to compare. Its option is disabled and carries the reason. The changes of that day still count in a comparison that spans it.

What happens if I pick the same day twice?

Nothing changed between a snapshot and itself, so the list shows an empty state in the same box and the status line says so. The height does not move.

Does the order of From and To matter?

No. The comparison always runs from the older to the newer one, so swapping them gives the same table and the sentence names the two days in date order.

What stays local, and how do I wire it for real?

The changes and the checksums are typed, and Copy writes the checksum to your clipboard, the only browser effect. To wire it up, compute the table differences on your server for the two snapshot ids and return them in the shape of TableData.

How does it look on a phone?

The two selects stack, the removed column drops out and the two checksums stack one above the other.

All 200 dashboard blocks