Skip to content

Create shared commit message field component

Samantha Ming requested to merge 337890-create-shared-commit-message-field into master

What does this MR do and why?

This MR re-created the message_field component into a shared component. There are no logic changes. The main change is the use of gl- classes instead of custom scss styling (that means we can remove all the custom classes). The added benefits of using gl- classes is the more consistent look with our other form items.

Normal State Focus State
image image

commit-message-field

MR Changes
this MR Create shared commit_message_field
tbd Ensure shared commit_message_field supports dark mode
tbd Mark message_field as deprecated_message_field
tbd Update delete blob modal to use shared commit_message_field
tbd Update IDE to use commit_message_field and delete all the custom scss classes
tbd (suggestion) Update branch input field to use gl-form component for consistency

How to set up and validate locally

The component is still being development, so you won't see the changes as it is not being used. However, you can still see it in action. Please apply this patch and you can see it being used in the IDE. Note: dark mode is not supported and will be addressed in a follow up.

test-commit-message-field-ide.patch

  1. Go to a project
  2. Click the "Web IDE" button
  3. Make some changes to a file
  4. Go to the "commit" tab
  5. In the "Commit Message" textarea enter some texts

Here are some sample texts you can use to see the highlights:

text less than 50 chars that should not highlighted. text more than 50 should be highlighted
text less than 50 chars that should not highlighted
body content that will be highlighted when it is more than 72 characters in length

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #337890 (closed)

Edited by Samantha Ming

Merge request reports