shadcn.io is not affiliated with official shadcn/ui
Archive Downloads Account Block for React
The archives an account has asked for and not yet taken: a type filter, a table with size, request day and time to expiry, real sample downloads, Request again for an expired one and Undo.
Installation
Overview
Show people the archives they have asked for and how long each lasts, with this downloads panel for React with Base UI. A toolbar holds a Toggle Group that filters by type, All, ZIP, JSON, CSV and PDF, each with its count, and a native table lists the files: name with a type icon, size, the day it was requested and how long it lasts, counted from the as-of day, so it reads In 6 days or Expired with the day. The sentence over the panel adds up what is still ready: how many files, how much, how many expire this week. Download is a real Download Trigger that makes a small sample file of the right type in the tab (a stored zip, JSON, CSV or a one-page PDF), and the status line says it is a sample and what the real size is. An expired file offers Request again, any file can be deleted, and Undo takes the last of either back. The panel keeps its height when the filter or a delete empties it, and below the large breakpoint each row is a card. It's built from Toggle Group, Download Trigger, Badge, Empty, Button and Guides, with a CSS entrance only. For account pages, data exports and any app that prepares files for people.
FAQ
How do I fill it with my archives?
Edit ARCHIVES. Each has an id, a name, a kind (zip, json, csv or pdf), its real size in megabytes, the ISO day it was requested and the ISO day it expires. Everything shown about time comes from AS_OF: In 6 days, Expired 3 Oct, and the sentence above the panel, which counts only the files that have not expired. Asking again gives a file LIFETIME days from the as-of day.
What stays local, and how do I make it real?
The list, Delete, Request again and Undo are this page's state: nothing is deleted or prepared anywhere. Download is real but small. It makes a sample file in the tab, a zip with a README and a few CSV rows, a JSON file, a CSV or a one-page PDF, and the status line says so with the sample's size and the archive's. To make it real, give each row the address of the file on your server and use it as the Download Trigger's data, and send delete and renew to your server.
Is the zip a real zip?
Yes. It is built in the tab as a stored zip, without compression, with a checksum for each file, and any zip tool opens it. It holds a README and a small CSV. The PDF is real too: a one-page file written as plain text with its own cross-reference table, so it opens in any viewer.
Does the panel move when I filter or delete?
No. The table's frame keeps the height of a full list, the filter and a delete only change the rows inside it, and when nothing is left an empty state fills the space and says why, with a way back: choose All, or press Undo. The counts on the filter follow every change, and an empty type can be chosen so you can see that state.
How does it look on a phone?
Below the large breakpoint the table becomes cards from the same markup: the file's name with its icon over its size and request day, how long it lasts, and the buttons. The table's column heads are still read out. The filter wraps onto more lines, and the foot stacks its status over Undo.
Is the table accessible?
The table is named and its columns have heads, the file's name leads each row, and the buttons say which file they act on, since every row shares the same words. Expiry is written out, never only a colour, and the filter is a group with a pressed state. After a delete focus moves to the next row's button, or to Undo when none is left.
Related
- Pro
Export requests as a lifecycle: a request checked with the password, a four-stage track that moves one stage per press, and a real sample file to download once it is ready.
- Pro
Standing exports to other services: four destinations on shared hairlines, each with its state, the kinds of record it receives, how often it runs, its last export and Export now.
- Pro
What an account stores: one bar cut into five parts by pattern, a row for each with its size and share, and actions that free space after an alert dialog and can be undone.
- Pro
Rules for deleting personal history automatically: a select for each kind of history, what each rule would delete worked out from typed counts, a popover of the oldest items and an alert dialog before a large delete.
- Pro
Export Ready Success
Backups and exportsA full-height confirmation page for a finished export: a ring with the hours that remain of the link's 48, the file card, notebook, note and word counts, a real zip built in the browser to download and a link that really copies.
- Pro
Data Export Settings
Backups and exportsA data export panel built around a tree of what an account holds, where ticking a part adds what it depends on and says so, with a format control, the size, time and file count it adds up to, and a request list that queues one archive at a time.