Inline issue description edit is confusing

I went to edit https://gitlab.com/gitlab-com/organization/issues/82, but then realised I didn't need to:

1. The cancel button is initially in view, but when I scroll to edit at the top, it is way below the fold, because the description is long.
2. The close issue button is much more prominent, so it's easy to click that by mistake: https://gitlab.com/gitlab-com/organization/issues/82#note_32811852
3. Is closing an issue, or creating a new one, something people really need to do while editing the description?
4. Should we even still have an Edit button available?

changed milestone to %Next 2-3 months

In this latest design, we made some progress toward making things inline and more web-app-like, moving away from static web forms. This is good. I think we can continue in this direction. Ultimate goal is real-time collaboration.

One design we can change now. Turn the Edit button into a Edit / Cancel button. When you are view mode, it says Edit. When you are in edit mode, it becomes Cancel. So you can have your mouse on that one area, and quickly toggle between the two modes. This gives the illusion that you are in an app (and not a website). It partially addresses @smcgivern 's points above. And also when you are in Edit mode, it doesn't make sense to have an Edit button.

The whole point of inline editing is so that you de-couple editing away from the rest of the page. So I think it's okay to have the close buttons and new buttons stick around because those are separate concerns. But definitely agree they shouldn't be so close to the edit button. For example, when you are doing label management in the sidebar, the rest of the page doesn't change. That's fine. But at least you would never be confused about any other UI.

I think if we further decouple confidentiality and issue moving to other parts of the page (sidebar I think), then you can really optimize the UI for just description editing.

cc @dimitrieh since you had a lot of good ideas on the inline editing here.

Making confidentiality inline: https://gitlab.com/gitlab-org/gitlab-ce/issues/33874

I think we should move these two to the sidebar first: #33874 (closed) and #34261 (closed). Once that is done, I'd suggest that we can move the Edit button somewhere closer to the content, maybe below? Or just have a little bit of a re-design, but that is focused on just the description+title together. And then so we can move it away from the Close button. We talked about using the Pencil icon as well in the past. We may want to consider that.

mentioned in issue #34330 (moved)

mentioned in issue #36069

changed milestone to %Next 3-6 months

@victorwu @smcgivern I am closing this issue as I think all changes necessary are either implemented or are being tackled with https://gitlab.com/gitlab-org/gitlab-ce/issues/36069

feel free to re-open if not ;)

closed

Thanks @dimitrieh . Yes, we linked to the feedback here from that issue. Thanks for closing this.