Add hyphen to 'To-Do' for alert sidebar

app/assets/javascripts/alert_management/components/sidebar/sidebar_header.vue

@@ -27,7 +27,7 @@ export default {
 <template>
   <div class="block gl-display-flex gl-justify-content-space-between">
     <span class="issuable-header-text hide-collapsed">
-      {{ __('To Do') }}
+      {{ __('To-Do') }}
     </span>
     <sidebar-todo
       v-if="!sidebarCollapsed"

app/assets/javascripts/alert_management/components/sidebar/sidebar_todo.vue

@@ -7,7 +7,7 @@ import createAlertTodo from '../../graphql/mutations/alert_todo_create.graphql';
 export default {
   i18n: {
     UPDATE_ALERT_TODO_ERROR: s__(
-      'AlertManagement|There was an error while updating the To Do of the alert.',
+      'AlertManagement|There was an error while updating the To-Do of the alert.',
     ),
   },
   components: {

app/assets/javascripts/sidebar/components/todo_toggle/todo.vue

@@ -6,7 +6,7 @@ import tooltip from '~/vue_shared/directives/tooltip';
 import Icon from '~/vue_shared/components/icon.vue';
 
 const MARK_TEXT = __('Mark as done');
-const TODO_TEXT = __('Add a To Do');
+const TODO_TEXT = __('Add a To-Do');
 
 export default {
   directives: {

ee/spec/features/epics/todo_spec.rb

@@ -16,7 +16,7 @@ RSpec.describe 'Manually create a todo item from epic', :js do
 
   it 'creates todo when clicking button' do
     page.within '.issuable-sidebar' do
-      click_button 'Add a To Do'
+      click_button 'Add a To-Do'
 
       expect(page).to have_content 'Mark as done'
     end
@@ -28,7 +28,7 @@ RSpec.describe 'Manually create a todo item from epic', :js do
 
   it 'marks a todo as done' do
     page.within '.issuable-sidebar' do
-      click_button 'Add a To Do'
+      click_button 'Add a To-Do'
     end
 
     expect(page).to have_selector('.todos-count', visible: true)

locale/gitlab.pot

@@ -1402,6 +1402,9 @@ msgstr ""
 msgid "Add a To Do"
 msgstr ""
 
+msgid "Add a To-Do"
+msgstr ""
+
 msgid "Add a bullet list"
 msgstr ""
 
@@ -2118,7 +2121,7 @@ msgstr ""
 msgid "AlertManagement|There was an error displaying the alerts. Confirm your endpoint's configuration details to ensure alerts appear."
 msgstr ""
 
-msgid "AlertManagement|There was an error while updating the To Do of the alert."
+msgid "AlertManagement|There was an error while updating the To-Do of the alert."
 msgstr ""
 
 msgid "AlertManagement|There was an error while updating the assignee(s) list. Please try again."
@@ -24945,6 +24948,9 @@ msgstr ""
 msgid "To widen your search, change or remove filters."
 msgstr ""
 
+msgid "To-Do"
+msgstr ""
+
 msgid "To-Do List"
 msgstr ""
 

spec/frontend/alert_management/components/alert_management_sidebar_todo_spec.js

@@ -52,9 +52,9 @@ describe('Alert Details Sidebar To Do', () => {
       });
     });
 
-    it('renders a button for adding a To Do', () => {
+    it('renders a button for adding a To-Do', () => {
       return wrapper.vm.$nextTick().then(() => {
-        expect(wrapper.find('[data-testid="alert-todo-button"]').text()).toBe('Add a To Do');
+        expect(wrapper.find('[data-testid="alert-todo-button"]').text()).toBe('Add a To-Do');
       });
     });
 

spec/frontend/sidebar/todo_spec.js

@@ -36,7 +36,7 @@ describe('SidebarTodo', () => {
 
   it.each`
     isTodo   | iconClass        | label             | icon
-    ${false} | ${''}            | ${'Add a To Do'}  | ${'todo-add'}
+    ${false} | ${''}            | ${'Add a To-Do'}  | ${'todo-add'}
     ${true}  | ${'todo-undone'} | ${'Mark as done'} | ${'todo-done'}
   `(
     'renders proper button when `isTodo` prop is `$isTodo`',