GH-173 - Assign modal fix

mattermost-community · Aug 22, 2022 · f2f6dbc · f2f6dbc
1 parent 15a36fb
commit f2f6dbc
Show file tree

Hide file tree

Showing 6 changed files with 9 additions and 5 deletions.
diff --git a/webapp/src/components/assignee_modal/assignee_modal.jsx b/webapp/src/components/assignee_modal/assignee_modal.jsx
@@ -76,6 +76,7 @@ const AssigneeModal = (
                     icon={<CompassIcon icon='close'/>}
                 />
                 <AutocompleteSelector
+                    autoFocus={true}
                     id='send_to_user'
                     loadOptions={autocompleteUsers}
                     onSelected={changeAssigneeDropdown}

diff --git a/webapp/src/components/todo_issues/todo_issues.jsx b/webapp/src/components/todo_issues/todo_issues.jsx
@@ -21,7 +21,7 @@ function ToDoIssues(props) {
             <Tada/>
             <h3 style={style.completed.title}>{'All tasks completed'}</h3>
             <p style={style.completed.subtitle}>
-                {'Nicely done, you’ve finished all of your tasks! Why not reward yourself with a little break?'}
+                {'Nicely done, you\'ve finished all of your tasks! Why not reward yourself with a little break?'}
             </p>
         </div>
     );

diff --git a/webapp/src/components/user_selector/autocomplete_selector.tsx b/webapp/src/components/user_selector/autocomplete_selector.tsx
@@ -19,6 +19,7 @@ import './autocomplete_selector.scss';
 
 type Props = {
     loadOptions: (inputValue: string, callback: ((options: OptionsType<UserProfile>) => void)) => Promise<unknown> | void,
+    autoFocus?: boolean,
     label?: string,
     labelClassName?: string,
     helpText?: string,
@@ -123,6 +124,7 @@ export default function AutocompleteSelector(props: Props) {
             {labelContent}
             <div className={inputClassName}>
                 <AsyncSelect
+                    autoFocus={props.autoFocus || false}
                     cacheOptions={true}
                     loadOptions={loadOptions}
                     defaultOptions={true}

diff --git a/webapp/src/widget/buttons/button.scss b/webapp/src/widget/buttons/button.scss
@@ -6,7 +6,7 @@
     align-items: center;
     text-align: center;
     justify-content: center;
-    border-radius: var(--default-rad);
+    border-radius: 4px;
     min-width: 20px;
     cursor: pointer;
     overflow: hidden;

diff --git a/webapp/src/widget/menu.scss b/webapp/src/widget/menu.scss
@@ -11,7 +11,7 @@
     z-index: 15;
     background-color: rgba(var(--center-channel-bg-rgb), 1);
     color: rgba(var(--center-channel-color-rgb), 1);
-    border-radius: var(--default-rad);
+    border-radius: 4px;
     box-shadow: var(--elevation-4);
 
     .menu-contents {

diff --git a/webapp/src/widget/menuItem.tsx b/webapp/src/widget/menuItem.tsx
@@ -1,4 +1,4 @@
-import React, {useState, useEffect} from 'react';
+import React, {useEffect} from 'react';
 import PropTypes from 'prop-types';
 
 import CompassIcon from '../components/icons/compassIcons';
@@ -20,8 +20,9 @@ const MenuItem = (props: Props) => {
     const {icon, shortcut, action, text} = props;
 
     useEffect(() => {
-        function handleKeypress(e: {key: string}) {
+        function handleKeypress(e: any) {
             if (e.key === shortcut) {
+                e.target.dispatchEvent(new Event('menuItemClicked'));
                 action();
             }
         }