Syndesis: UXD - Create UX design to allow users to tag an integration for release to a target environment

[dhirajsb]

This is a...

[X] Feature request
[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[ ] Documentation issue or request

Description

Need UX design to allow users to tag an integration by clicking on a button which generates a new release tag internally which is used by backend CI/CD APIs.
Internally tags are kept in a map with environment name keys, mapped to generated tag, timestamp, etc.
User should be able to select a target environment name, or add one on the fly. A new tag is generated when user clicks on a button. User may also optionally also delete an environment name, which should pop up a confirmation dialog.
The backend service will respond with a ContinuousDeliveryEnvironment json with the following fields:

{
"name": "test",
"integrationId": "<integration-id>",
"releaseTag": "<some-tag-string>",
"taggedAt": "<timestamp>",
"lastExportedAt": "<timestamp>"
}

The lastExportedAt timestamp is used internally to compare whether an integration has been tagged for release since last being exported to an environment.

[heiko-braun]

@dongniwang @amysueg Can we get your thoughts on this? It's required for 7.3 and we only have a few weeks left.

[dongniwang]

@heiko-braun - We will need some more information to understand the request.

[dhirajsb]

@gaughan Gary, do you have feedback on the UI based export trigger proposed here?

[gaughan]

Sure, are tags part of the first version? We could add a "Mark for CI/CD" option in the kebab menu of version history of the integration

[dongniwang]

@dhirajsb @gaughan - Design is ready for review here. Please provide your comments in InVision. Thank you!

https://redhat.invisionapp.com/share/95QAAR3EZ8F

I'm still not certain what would be a good way to confirm deletion of an environment name.

[dhirajsb]

@dongniwang looks good, added a comment on the delete button

[gaughan]

nice, is delete the right term, remove is more accurate maybe?

[dongniwang]

I understand where you're coming from @gaughan, but I think "delete" and "remove" are both the same in this context...

cc @TovaCohen here and maybe she can suggest a word?

[dongniwang]

@dhirajsb @gaughan - Just updated the design to have a way to confirm the deletion. Please take a look again and let me know if you have any concerns or questions. https://redhat.invisionapp.com/share/9XQAYGHQ28P

The delete confirmation will be styled as an inline notification: https://redhat.invisionapp.com/share/TDQAYGRCHFS

[dhirajsb]

@dongniwang looks good to me. Just to make it clear, deleting the environment there, only really 'removes' the tag for that integration, rather than removing it from all of Syndesis.

[dongniwang]

@dhirajsb - would it make more sense to call it "tag name" instead of environment name?

[gaughan]

Target Environment, maybe?

[dhirajsb]

Yeah, naming this abstract concept has been challenging. In a way it represents a target environment, but it could just as well be the same label used in a CI/CD pipeline that spans multiple deployment environments.

As I mentioned in our meeting earlier, my original intention behind the environment concept was to expand it in the future, where we could add metadata to it like webhook urls, credentials etc. to integrate more tightly with a pipeline. In which case, it's more of a pipeline environment, as opposed to a single deployment stage in a pipeline.

For now, it's just a label that pipelines use to filter integrations that they should act upon without stepping on each other.

[TovaCohen]

In the kebab menu, how about just "CI/CD" in place of "Mark for CI/CD" ?
In the popup, I suggest the title: Mark Integration for Continuous Integration/Continuous Deployment".

As the introductory text for the popup, I suggest:
"Tag this integration for release in one or more of the following environments."

I would just call them environments rather than target environments.

As for "Delete" or "Remove" --
In the design, on page 7, there is a checkbox to the left of each environment name. I assume that you select or unselect the checkbox according to whether you want to tag the integration for release in that environment. If that's the case, then how does the behavior of "Delete" to the right of the environment name differ from the behavior of the checkbox? Does "Delete" just remove the entry for that environment from this popup list? If yes, then it should be "Remove" and the confirmation text should be:
"Are you sure you want to remove this environment from this list?"
And just to make sure I understand this correctly, suppose MyEnvironment has been added as a CI/CD environment to both IntegrationOne as well as for IntegrationTwo. Suppose that I remove MyEnvironment from the list of environments for IntegrationOne. Will MyEnvironment still appear in the list of environments for IntegrationTwo?

[dhirajsb]

@TovaCohen removing the tag for a particular environment for an integration only removes it from that integration, so it will still appear in IntegrationTwo.

[TovaCohen]

Thanks, @dhirajsb . When I select "Delete", which I think should change to "Remove", am I just removing that particular environment from the list of environments that appear in this popup?

[dhirajsb]

Just the tag, if it exists.

>

[dongniwang]

@TovaCohen - yeah, the "delete" (which I'll update so it says "remove") is just a control for the list that you're seeing on the pop-up since we don't have a designated page for managing the CI/CD environment.

[dongniwang]

Thank you all for the feedback!

Just updated the terminology. The updated design is here https://redhat.invisionapp.com/share/E9QCV528WVN.

cc: @dhirajsb @gaughan @TovaCohen

[TovaCohen]

This looks great to me. Thanks Dongni!
One question - in the "Mark Integration for Continuous Integration/Continuous Deployment" dialog, suppose that the checkbox for an environment is selected. Can I click Remove? If yes, is the result that the integration is untagged with that environment AND that environment is removed from the list?

[dongniwang]

@TovaCohen Yes, that's the intent. Selecting the checkbox itself doesn't automatically mark the integration for that environment, users also need to click Save to confirm the action.

If this is still confusing, maybe we can add a separate button to perform the tagging part. But then there will be another click (clicking on Save) to complete this task.

[TovaCohen]

I think it's clear the way it is. Thanks!

[dhirajsb]

@gashcrumb can we chat about the ui implementation for this design today, Feb 7?

[gashcrumb]

@elvisisking @kahboom would either of you be able to work with @dhirajsb on this one?

[elvisisking]

I can. Let me know a time that works for you @dhirajsb?

[dhirajsb]

@elvisisking I'm on US Pacific time, what timezone are you on? I'm out volunteering at my kid's school until 10 AM today.

[elvisisking]

@dhirajsb I'm US Central. I'll email you my phone or danflo on IRC.

[dongniwang]

@dhirajsb @elvisisking - Please let me know if you have any questions about the design or need help reviewing anything. Thanks!

[amysueg]

Design is complete, see Syndesis design tracker - https://redhat.invisionapp.com/share/E9QCV528WVN .

Follow up work is being done with #4601.
Closing this.