Improve how users approve schema changes

[nataliekwong]

Observations:

• After clicking on “review changes” and then click “OK” in the modal (refreshed source schema) > users think the change has been applied, so they navigate to an other screen and see the modal “discard changes”. Lot of users click on “ Discard changes” in that case, so they still have some non-breaking changes.
• Some users click on “review changes” (so we display the progress bar) and then navigate to an other page, thinking the progress continue in background, which is not the case.
• After “reviewing changes” and click” OK” in the modal, most of the users that understand they need to click on “Save changes” don’t change anything else that the sync on/off in the replication table (They don’t change sync. mode, cursor field or primary key, etc...)
• The Refreshed source schema modal is complicated to read, there are some mis-aligned elements.

Fullstory funnel showing dropoff from clicking "Review changes" to actually approving them "Save changes"

From Nico:

• Quick video of suggested improvements: https://www.loom.com/share/0374aff6b6b34878baab173321c6a0d8
• Prototype to test the suggested improvements: https://www.figma.com/proto/liLQhcbpVHiEDW18kiXQe3/01_03_CONNECTIONS?page-id=7337%3A173761&node-id=7346-175050&viewport=369%2C743%2C0.13&scaling=min-zoom&starting-point-node-id=7346%3A175050&show-proto-sidebar=1

fyi @Upmitt

[josephkmh]

Refining notes:

• Auto-propagate schema changes may reduce the number of users running into this > can we put this off until after auto-propagation has been merged? In any case it will change some assumptions here.
• The prototype may introduce more complexity than it is solving
  • Users might have made changes before clicking on "review changes", which would need to be discarded
• Feeling is that this needs some more thought before we commit on a solution

[nataliekwong]

Closing in favor of this: #31404