Standing Exports Account Block for React

Edit FIRST. Each destination has an id, a two-letter mark typed by hand (never derived from the name, so Db and Dr stay apart), a name, a short where, the types it receives, whether it is connected, its frequency and the ISO day it last ran. The next date is the last run plus 7 days for weekly or 30 for monthly, worked out from AS_OF, and reads Due today once that day has passed.

Everything. Connect flips a flag in this page, Export now sets the last-run day and says Queued in this demo, and nothing is sent to any service. To make it real, start each connection with the service's own authorisation screen so the credential never touches your page, store what it returns on your server, and let a scheduled job on the server run the exports; this page then only shows what the server reports.

A page that shows a token or a key can leak it to anyone who looks over a shoulder or reads a screenshot. Here a destination shows only the service, where it writes and what it receives, and the demo never asks for a password or a key. A real version should do the same: show what access was granted, and offer Disconnect to take it back.

It shows Off and refuses a change in words: choosing Weekly on Amazon S3 before it is connected leaves the select where it was and the status line says to connect it first. A connected destination takes the new value at once, and the status line gives the next date. Disconnecting puts the frequency back to Off.

The last change, one step at a time: a connect or disconnect, a frequency, or an Export now (it restores the last-run day it replaced). Undo is always there but waits quietly while there is nothing to take back, and it says so if pressed. A permanent control like this is used instead of a timed message, so nobody is rushed.

The four cells stack in one column. Each keeps its height whatever its state, because the row of badges reserves two lines and the dates have their own slot, so connecting or exporting never moves anything. The name, the badge and the buttons are the same on every width.