Google Cloud Grid Integration Block for React

Edit TABLES at the top of the file: each table has a name and its columns, each built with col(name, type) or person(name, type) for a column that holds personal data. START_OFF lists the columns that begin unticked, as table.column keys, because column names repeat across tables (user_id). The counts, the parent checkbox states and the tally line are all worked out from those lists.

It shows three states: on when every column of the table is on, off when none is, and a bar (indeterminate) when only some are. Pressing it never chooses between the two halves: it turns every column on, or all of them off when all were on already. The bar is drawn by the block in the same way on every base, so it looks the same in each library. It is named by the table it belongs to.

It is a label you set per column: email and ip_address carry the badge, start off, and are counted in the tally ("0 of 2 holding personal data"). The block does not detect personal data; mark the columns your own schema treats that way, and decide in your product what an off column means (here it is never written to the BigQuery table).

No. The block reads and writes nothing: the choices stay in the page, and the status line under the header says so from the first paint ("Nothing is sent to Google Cloud; your choices stay in this page."). In a real product, save the chosen column list with your own settings and build each table's schema from it.

Every column and every parent is a real checkbox, in a labelled cell, and each Collapsible trigger is a button named for its table ("Columns of events") that reports whether it is open. The tally line is polite, so each change is read out. Types and names keep their left-to-right order in a right-to-left layout.

The two-by-two becomes one column, and each cell can be folded with its chevron to shorten the page. The header fades up once on load and the folding and the chevron animate briefly; reduced motion turns all of it off. The overshoot corners need room beside the cells, so the grid keeps the page's side padding.