Bulk Update Success Block for React

Everything: nothing was saved and the contacts are drawn shapes with typed sample owners. Undo, Redo and Reassign owner change the page's state and say so in a polite status line. To wire it, keep the previous owners from your edit's response, make Undo send them back to your server and Redo send the new owner again, and replace the drawing with your own table.

A real toast portals out of the page and would escape the frame, so the bar is drawn inside the stage. In your app use your toast component with an Undo action. The bar here has no timer: a way back that disappears after a few seconds fails people who need longer, so it stays until you dismiss it, and Reassign owner in the header brings it back.

They are one button, so focus stays on it. Undo puts each of the twelve owner cells back to its own previous owner (Gideon P., Ansel R. or Tove M.) and the bar says the contacts are back with their owners; the button then reads Redo, which sets them to the new owner again. Each press is announced.

It applies the edit again. With the cells already reassigned and the bar shown, it only says so; after an Undo, or after you dismissed the bar, it sets the twelve cells to the new owner and shows the bar again.

The bar spans the stage and its text wraps above the two buttons, and the drawing keeps the checkbox, the name bar and the owner.

Yes. The drawing is hidden from assistive technology, since the status line says what the cells hold, and the bar is plain text and three named buttons in reading order. Dismissing the bar moves focus to Reassign owner.