Browse Source

ref(ui): Delete janky ContextPickerModal auto-select (#39902)

Evan Purkhiser 2 years ago
parent
commit
e0b565b4c8

+ 0 - 3
static/app/actionCreators/navigation.tsx

@@ -29,9 +29,6 @@ export function navigateTo(
           needOrg={needOrg}
           needProject={needProject}
           configUrl={configUrl}
-          comingFromProjectId={
-            Array.isArray(comingFromProjectId) ? '' : comingFromProjectId || ''
-          }
           onFinish={path => {
             modalProps.closeModal();
             return window.setTimeout(() => router.push(path), 0);

+ 1 - 38
static/app/components/contextPickerModal.tsx

@@ -60,11 +60,6 @@ type Props = ModalRenderProps & {
   organizations: Organization[];
 
   projects: Project[];
-  /**
-   * Id of the project (most likely from the URL)
-   * on which the modal was opened
-   */
-  comingFromProjectId?: string;
 };
 
 const selectStyles: StylesConfig = {
@@ -228,34 +223,6 @@ class ContextPickerModal extends Component<Props> {
     return [memberProjects, nonMemberProjects];
   };
 
-  onMenuOpen = (
-    ref: any | null,
-    listItems: (Project | Integration)[],
-    valueKey: string,
-    currentSelected: string = ''
-  ) => {
-    // Hacky way to pre-focus to an item with newer versions of react select
-    // See https://github.com/JedWatson/react-select/issues/3648
-    setTimeout(() => {
-      if (ref) {
-        const choices = ref.select.state.menuOptions.focusable;
-        const toBeFocused = listItems.find(({id}) => id === currentSelected);
-        const selectedIndex = toBeFocused
-          ? choices.findIndex(option => option.value === toBeFocused[valueKey])
-          : 0;
-        if (selectedIndex >= 0 && toBeFocused) {
-          // Focusing selected option only if it exists
-          ref.select.scrollToFocusedOptionOnUpdate = true;
-          ref.select.inputIsHiddenAfterUpdate = false;
-          ref.select.setState({
-            focusedValue: null,
-            focusedOption: choices[selectedIndex],
-          });
-        }
-      }
-    });
-  };
-
   // TODO(TS): Fix typings
   customOptionProject = ({label, ...props}: any) => {
     const project = this.props.projects.find(({slug}) => props.value === slug);
@@ -294,7 +261,7 @@ class ContextPickerModal extends Component<Props> {
   }
 
   renderProjectSelectOrMessage() {
-    const {organization, projects, comingFromProjectId} = this.props;
+    const {organization, projects} = this.props;
     const [memberProjects, nonMemberProjects] = this.getMemberProjects();
     const {isSuperuser} = ConfigStore.get('user') || {};
 
@@ -339,9 +306,6 @@ class ContextPickerModal extends Component<Props> {
         name="project"
         options={projectOptions}
         onChange={this.handleSelectProject}
-        onMenuOpen={() =>
-          this.onMenuOpen(this.projectSelect, projects, 'slug', comingFromProjectId)
-        }
         components={{Option: this.customOptionProject, DropdownIndicator: null}}
         styles={selectStyles}
         menuIsOpen
@@ -380,7 +344,6 @@ class ContextPickerModal extends Component<Props> {
         name="configurations"
         options={options}
         onChange={this.handleSelectConfiguration}
-        onMenuOpen={() => this.onMenuOpen(this.configSelect, integrationConfigs, 'id')}
         components={{DropdownIndicator: null}}
         styles={selectStyles}
         menuIsOpen