Sync Status Panel
A sync status panel with a linked devices list showing per device state, followed by a selective sync section with per folder toggle switches.
A sync status panel with a linked devices list showing per device state, followed by a selective sync section with per folder toggle switches.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Sync Status Panel is the sync overview for a desktop client, headed by Sync and a line noting three files are syncing on this device with about two minutes left, beside a Pause all button. A Devices card lists three linked machines, each with a device icon, name, and last synced detail: the current device shows a live progress bar reading Syncing 3 of 14 files, an iMac shows an Up to date badge, and a phone shows a Paused badge. A Selective sync card below lists four folders with a size and a state of Synced to this device or Online only, each carrying a switch, and a footer explains that online only folders stay visible and download when opened.
Devices are one typed array whose status field chooses between the progress bar and a status badge, while folders are a second array whose synced flag sets each switch default. The header totals, 3 linked devices and 33.5 GB on this device, are copy you would compute from the same data.
Reach for this block in a desktop app settings window or a web dashboard mirroring a sync client, wired to your sync engine. Update the progress bar and the summary line live as files move, and let the folder switches queue a download or free up local space.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the desktop sync client. Other sync shapes:
Tip: pair the live progress bar with a plain minutes left line, a moving bar tells the user something is happening but not when it ends.