Design user flow for exporting and importing API configuration

[brylie]

Our API Profile view currently has a tab where API owners can export API and Proxy settings. There is also a (currently broken) import page, which was designed for importing API settings (not proxy settings).

Goals

• Allow users to easily export and import their API and Proxy settings.
  • Make exporting and importing easy to discover.
• Have a simple user experience related to exporting and importing API and Proxy settings.
• Keep in mind the current user flow for adding an API, and offer an option to 'import existing API' during that process.

[brylie]

In case we remove the current import functionality, as part of cleanup in #2912, here are the files as they currently stand:

• /apinf_packages/apis/client/import

[Nazarah]

@brylie in API profile, do we need to keep a separate tab for export/import API config? the 1st thing we can offer is to do so when API owner is adding and API and s/he has preexisting config file. From API profile, I believe the Settings tab can have this option for the API owner to export and import API config file from a distinguishable block.

[Nazarah]

@bajiat can u please mention the usecases for this?

[bajiat]

@Nazarah Exporting and importing the API settings in order to move or copy the API to another APInf instance. Minimizes the need to do manual copy-pasting. This is for the users who are not comfortable with using REST APIs to GET API data and to PUT/POST it with an API.

In order for this to be more useful, we should remove all instance specific data (like API id, manager id or logo image Id) from the exported files and have reusable data like name, logo URL etc.

[marla-singer]

@Nazarah @bajiat The wireframe is still not available. The logic of import has done but @Vellames can not finish it w/out wireframes

Where should I add a button to call this screen?

[bajiat]

@55 Can you take a look at the design, since the logic should now be ready.

[55]

@bajiat @marla-singer I will add those by the end of the day.

[55]

Approximately, something like this:

Text for subtitles can be checked from @bajiat.

[bajiat]

"Manually entering details" could be "Enter API details".

Can we add an 'OR' somewhere between the sections?

[bajiat]

By the way, has this comment been taken into account in the implementation?

In order for this to be more useful, we should remove all instance specific data (like API id, manager id or logo image Id) from the exported files and have reusable data like name, logo URL etc.

[vellames2]

"Manually entering details" could be "Enter API details".

@bajiat Ok

Can we add an 'OR' somewhere between the sections?

@bajiat Yes, no problem

[vellames2]

By the way, has this comment been taken into account in the implementation?

@bajiat The import file ask for "name", "description", "url" and "lifecycleStatus". The manager id will be the id of logged user.

[vellames2]

@55 @bajiat I added the input file here because the user can see and change the import file before effectively import the api. Looks good?

[55]

@Vellames go with it for now, looks alright.