Description
Moved from https://github.com/Codeinwp/visualizer-pro/issues/248
Context: Multiple users want to be able to re-use old connections instead of having to retype the details. We want to give them an option to re-use an older connection for that purpose.
I also thought of the scenario, if a connection has a password change, at the moment users need to modify every chart to update the change. Making connections their own entity (that can be modified one and have the changes reflected on all charts that selected it) would make sense.
Here are the changes involved for this:
1- Creation of 'database connections'
Currently the credentials are tied to a specific chart, we want to separate the chart from the connection so they become separate entities.
Connections would then be stored separately from the chart, and charts would have a "connection_id" linking to the connection.
2- Migration
Existing credentials would have to be migrated to the new format, meaning for each chart with a connection to an external database, a connection record would be created with an automated name ex : "MySQL001, MySQL002" etc. and the charts would link to it with the corresponding ID.
3- Import/Export
We have to ensure import/export will work with the new structure.
4- Manage Connections page
In the menu, between "Add new chart" and "support, we would have a "Manage Connections" page
This page would be a standard WP crud page (like feedzy's https://i.imgur.com/uBFwOop.png) and allow users to modify all details of the connection, including the name (unique) and credentials. The modification would happen on a separate page (that we can link to later). Upon submitting modifications, a confirmation message will appear: "Are you sure you want to modify this connection? This will affect all charts linked to this connection".
It would also allow creating and deleting a connection, but would not allow deleting a connection linked to a chart.
We could also display a list of charts that use this connection and upon clicking on the chart name in the last, it could open it in edit mode.
5- Update the UI to select a database
Currently we have this: https://i.imgur.com/q6DIkOt.png
Changes:
- Reword the header to "Select a database connection"
- Remove the accordion (we want to make it more obvious that the user has more options)
- Upon selecting an option that is not Wordpress DB, a second dropdown will appear containing "New Connection" as well as all existing connections for this database type.
If the user chooses an existing connection, no other fields need to be displayed. We can have a button on the right of it that says "View/Edit this connection" which would open the edit page in a new tab.
If the user chooses "New Connection", it will be same as this: https://i.imgur.com/PS0O9rQ.png
Except there will be the "New Connection" dropdown and the connection name.
The connection will be created/saved when the user saves the chart itself, if the name was left empty, it will have a generic unique name (ex: MySQL001)