Connection Form Refactor - Part Two

[krishnaglick]

What

Renames and re-architects the Connection Edit and Create code, as well as changing how the connection edit's name and enable/disable toggle work together with it all for better consistency.

Resolves #15606
Resolves #15605
Resolves #15607
Resolves #16368

This sidecar PR from Teal isolates some of the renaming and file moving work to reduce the complexity of this PR.
This sidecar PR from Teal handles most of the styled components -> scss module changes from this PR.

How

Part One introduced the connection form service to better bridge the edit and create forms, as well as lay the groundwork for the greater refactor.
Part two takes this quite a bit further. The original ConnectionFormService was pared down to things both Create and Edit use and need, removing any code-creep from one side or the other. ConnectionEditService was made to contain the necessary edit-specific logic without cluttering up the form service. It gives the Connection Edit Name, among other components, access to the same Connection object the ConnectionReplication (formerly ReplicationView) component uses so altering the Name or toggling the status does not get reset if you save the form!

Reading Order

Major

• ConnectionFormService.tsx - Was renamed, folder changed to ConnectionForm from Connection. Previous Version. The complexity of this service was scaled back greatly. There's no shared onSubmit logic piped through here now, that's been transformed into the tidyConnectionFormValues function. It just holds shared logic to avoid prop-drilling and keep it DRY.

• ConnectionEditService.tsx - There was a lot of unnecessary grouped logic in the Connection Form Service. The Connection Edit Service was split out and moved way above in the component tree to encapsulate the connection name and connection toggle logic. It encapsulates the connection edit specific logic.

• CreateConnection.tsx - Was renamed from CreateConnectionContent.tsx but there are changes.

• ConnectionReplication.tsx - Was renamed from ReplicationView.tsx. Slimmed down the component by moving a lot of the logic into the ConnectionEditService.

• ConnectionFormFields.tsx - Pulled out the duplicate logic from the former ConnectionForm.tsx component and encapsulated it here. Removed the use of styled components.

Minor

• CreateConnectionNameField.tsx - This was extracted from the ConnectionForm.tsx. No changes were made except StyledComponents -> SCSS Modules.
• SchemaError.tsx - Extracted from CreateConnectionContent.tsx
• ResetWarningModal.tsx - Moved the reset warning modal out of the replication view. Old Location
• ConnectionItemPage.tsx - The onAfterSaveSchema call was simply making an analytics call. It's been moved to the appropriate location. Additionally the entire component has an Inner where most of the logic is so it has access to the ConnectionEditService.
• ConnectionName.tsx - Update call now uses PATCH-style logic, leverages the Connection Edit Service.
• ConnectionPageTitle.tsx - Slimmed down thanks to Connection Edit Service. Prop-drilled logic moved into it as appropriate.
• EnabledControl.tsx - Update call now uses PATCH-style logic, leverages the Connection Edit Service. onStatusUpdating was removed as it was actually unused.
• ResetWarningModal.tsx - Logic was pulled out of the ConnectionReplication component and placed into its own file.
• StatusMainInfo.tsx - Slimmed down thanks to Connection Edit Service.
• CatalogDiffModal.tsx - Closing the modal on unmount logic moved into here from ConnectionReplication.

Misc

• useConnectionHook.tsx - The logic removed from this file has been folded into the ConnectionEditService since it was only used in a single place, and it's easier to manage this way as I felt.
• useSourceHook.tsx - Turned an interface

Notes

• Teal made a ticket for us to fix up the Yup schema.

🚨 User Impact 🚨

This touches just about every part of the connection create and edit process. It has high potential to break things.

[dizel852]

Overall - LGTM. Much cleaner 👍
Also tested locally with "Postgres <> Postgres" connections - did not find any regression bugs...
I approve, but need to fix latest comments from @lmossman

[krishnaglick]

I ran my new e2e tests against this branch and they passed! 🎉

[lmossman]

Approving, as all of my comments were addressed!

I did not take the time to test this locally, as I saw that all of the test cases in the test-it doc were already verified

Changes made

[teallarson]

re-reviewed final code. did not complete a final manual test.