Merge pull request #18398 from desktop/remove-enablesectionlist-ff

Remove the `enableSectionList` feature flag

app/src/lib/feature-flag.ts

@@ -94,10 +94,6 @@ export function enableMoveStash(): boolean {
 
 export const enableCustomGitUserAgent = enableBetaFeatures
 
-export function enableSectionList(): boolean {
-  return true
-}
-
 export const enableRepoRulesBeta = () => true
 
 export const enableCommitDetailsHeaderExpansion = () => true

app/src/ui/branches/branch-list.tsx

@@ -4,11 +4,7 @@ import { Branch, BranchType } from '../../models/branch'
 
 import { assertNever } from '../../lib/fatal-error'
 
-import {
-  FilterList,
-  IFilterListGroup,
-  SelectionSource,
-} from '../lib/filter-list'
+import { IFilterListGroup, SelectionSource } from '../lib/filter-list'
 import { IMatches } from '../../lib/fuzzy-find'
 import { Button } from '../lib/button'
 import { TextBox } from '../lib/text-box'
@@ -22,7 +18,6 @@ import { NoBranches } from './no-branches'
 import { SelectionDirection, ClickSource } from '../lib/list'
 import { generateBranchContextMenuItems } from './branch-list-item-context-menu'
 import { showContextualMenu } from '../../lib/menu-item'
-import { enableSectionList } from '../../lib/feature-flag'
 import { SectionFilterList } from '../lib/section-filter-list'
 
 const RowHeight = 30
@@ -178,10 +173,7 @@ export class BranchList extends React.Component<
   IBranchListProps,
   IBranchListState
 > {
-  private branchFilterList:
-    | FilterList<IBranchListItem>
-    | SectionFilterList<IBranchListItem>
-    | null = null
+  private branchFilterList: SectionFilterList<IBranchListItem> | null = null
 
   public constructor(props: IBranchListProps) {
     super(props)
@@ -213,7 +205,7 @@ export class BranchList extends React.Component<
   }
 
   public render() {
-    return enableSectionList() ? (
+    return (
       <SectionFilterList<IBranchListItem>
         ref={this.onBranchesFilterListRef}
         className="branches-list"
@@ -239,30 +231,6 @@ export class BranchList extends React.Component<
         getItemAriaLabel={this.getItemAriaLabel}
         getGroupAriaLabel={this.getGroupAriaLabel}
       />
-    ) : (
-      <FilterList<IBranchListItem>
-        ref={this.onBranchesFilterListRef}
-        className="branches-list"
-        rowHeight={RowHeight}
-        filterText={this.props.filterText}
-        onFilterTextChanged={this.props.onFilterTextChanged}
-        onFilterKeyDown={this.props.onFilterKeyDown}
-        selectedItem={this.state.selectedItem}
-        renderItem={this.renderItem}
-        renderGroupHeader={this.renderGroupHeader}
-        onItemClick={this.onItemClick}
-        onSelectionChanged={this.onSelectionChanged}
-        onEnterPressedWithoutFilteredItems={this.onCreateNewBranch}
-        groups={this.state.groups}
-        invalidationProps={this.props.allBranches}
-        renderPostFilter={this.onRenderNewButton}
-        renderNoItems={this.onRenderNoItems}
-        filterTextBox={this.props.textbox}
-        hideFilterRow={this.props.hideFilterRow}
-        onFilterListResultsChanged={this.props.onFilterListResultsChanged}
-        renderPreList={this.props.renderPreList}
-        onItemContextMenu={this.onBranchContextMenu}
-      />
     )
   }
 
@@ -290,10 +258,7 @@ export class BranchList extends React.Component<
   }
 
   private onBranchesFilterListRef = (
-    filterList:
-      | FilterList<IBranchListItem>
-      | SectionFilterList<IBranchListItem>
-      | null
+    filterList: SectionFilterList<IBranchListItem> | null
   ) => {
     this.branchFilterList = filterList
   }

app/src/ui/clone-repository/cloneable-repository-filter-list.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 import { Account } from '../../models/account'
-import { FilterList, IFilterListGroup } from '../lib/filter-list'
+import { IFilterListGroup } from '../lib/filter-list'
 import { IAPIRepository, getDotComAPIEndpoint, getHTMLURL } from '../../lib/api'
 import {
   ICloneableRepositoryListItem,
@@ -15,7 +15,6 @@ import { HighlightText } from '../lib/highlight-text'
 import { ClickSource } from '../lib/list'
 import { LinkButton } from '../lib/link-button'
 import { Ref } from '../lib/ref'
-import { enableSectionList } from '../../lib/feature-flag'
 import { SectionFilterList } from '../lib/section-filter-list'
 import { TooltippedContent } from '../lib/tooltipped-content'
 
@@ -156,38 +155,40 @@ export class CloneableRepositoryFilterList extends React.PureComponent<ICloneabl
     this.props.onRefreshRepositories(this.props.account)
   }
 
-  public render() {
-    const { repositories, account, selectedItem } = this.props
-
-    const groups = this.getRepositoryGroups(repositories, account.login)
-    const getGroupAriaLabel = (group: number) => {
+  private getGroupAriaLabelGetter =
+    (groups: ReadonlyArray<IFilterListGroup<ICloneableRepositoryListItem>>) =>
+    (group: number) => {
       const groupIdentifier = groups[group].identifier
       return groupIdentifier === YourRepositoriesIdentifier
         ? this.getYourRepositoriesLabel()
         : groupIdentifier
     }
 
-    const selectedListItem = this.getSelectedListItem(groups, selectedItem)
-    const ListComponent = enableSectionList() ? SectionFilterList : FilterList
-    const filterListProps: typeof ListComponent['prototype']['props'] = {
-      className: 'clone-github-repo',
-      rowHeight: RowHeight,
-      selectedItem: selectedListItem,
-      renderItem: this.renderItem,
-      renderGroupHeader: this.renderGroupHeader,
-      onSelectionChanged: this.onSelectionChanged,
-      invalidationProps: groups,
-      groups: groups,
-      filterText: this.props.filterText,
-      onFilterTextChanged: this.props.onFilterTextChanged,
-      renderNoItems: this.renderNoItems,
-      renderPostFilter: this.renderPostFilter,
-      onItemClick: this.props.onItemClicked ? this.onItemClick : undefined,
-      placeholderText: 'Filter your repositories',
-      getGroupAriaLabel,
-    }
+  public render() {
+    const { repositories, account, selectedItem } = this.props
 
-    return <ListComponent {...filterListProps} />
+    const groups = this.getRepositoryGroups(repositories, account.login)
+    const selectedListItem = this.getSelectedListItem(groups, selectedItem)
+
+    return (
+      <SectionFilterList<ICloneableRepositoryListItem>
+        className={'clone-github-repo'}
+        rowHeight={RowHeight}
+        selectedItem={selectedListItem}
+        renderItem={this.renderItem}
+        renderGroupHeader={this.renderGroupHeader}
+        onSelectionChanged={this.onSelectionChanged}
+        invalidationProps={groups}
+        groups={groups}
+        filterText={this.props.filterText}
+        onFilterTextChanged={this.props.onFilterTextChanged}
+        renderNoItems={this.renderNoItems}
+        renderPostFilter={this.renderPostFilter}
+        onItemClick={this.props.onItemClicked ? this.onItemClick : undefined}
+        placeholderText={'Filter your repositories'}
+        getGroupAriaLabel={this.getGroupAriaLabelGetter(groups)}
+      />
+    )
   }
 
   private onItemClick = (

app/src/ui/repositories-list/repositories-list.tsx

@@ -9,7 +9,7 @@ import {
   KnownRepositoryGroup,
   makeRecentRepositoriesGroup,
 } from './group-repositories'
-import { FilterList, IFilterListGroup } from '../lib/filter-list'
+import { IFilterListGroup } from '../lib/filter-list'
 import { IMatches } from '../../lib/fuzzy-find'
 import { ILocalRepositoryState, Repository } from '../../models/repository'
 import { Dispatcher } from '../dispatcher'
@@ -25,7 +25,6 @@ import memoizeOne from 'memoize-one'
 import { KeyboardShortcut } from '../keyboard-shortcut/keyboard-shortcut'
 import { generateRepositoryListContextMenu } from '../repositories-list/repository-list-item-context-menu'
 import { SectionFilterList } from '../lib/section-filter-list'
-import { enableSectionList } from '../../lib/feature-flag'
 
 const BlankSlateImage = encodePathAsUrl(__dirname, 'static/empty-no-repo.svg')
 
@@ -220,6 +219,12 @@ export class RepositoriesList extends React.Component<
     showContextualMenu(items)
   }
 
+  private getItemAriaLabel = (item: IRepositoryListItem) => item.repository.name
+  private getGroupAriaLabelGetter =
+    (groups: ReadonlyArray<IFilterListGroup<IRepositoryListItem>>) =>
+    (group: number) =>
+      groups[group].identifier
+
   public render() {
     const baseGroups = this.getRepositoryGroups(
       this.props.repositories,
@@ -243,33 +248,27 @@ export class RepositoriesList extends React.Component<
           ]
         : baseGroups
 
-    const getItemAriaLabel = (item: IRepositoryListItem) => item.repository.name
-    const getGroupAriaLabel = (group: number) => groups[group].identifier
-
-    const ListComponent = enableSectionList() ? SectionFilterList : FilterList
-    const filterListProps: typeof ListComponent['prototype']['props'] = {
-      rowHeight: RowHeight,
-      selectedItem: selectedItem,
-      filterText: this.props.filterText,
-      onFilterTextChanged: this.props.onFilterTextChanged,
-      renderItem: this.renderItem,
-      renderGroupHeader: this.renderGroupHeader,
-      onItemClick: this.onItemClick,
-      renderPostFilter: this.renderPostFilter,
-      renderNoItems: this.renderNoItems,
-      groups: groups,
-      invalidationProps: {
-        repositories: this.props.repositories,
-        filterText: this.props.filterText,
-      },
-      onItemContextMenu: this.onItemContextMenu,
-      getGroupAriaLabel,
-      getItemAriaLabel,
-    }
-
     return (
       <div className="repository-list">
-        <ListComponent {...filterListProps} />
+        <SectionFilterList<IRepositoryListItem>
+          rowHeight={RowHeight}
+          selectedItem={selectedItem}
+          filterText={this.props.filterText}
+          onFilterTextChanged={this.props.onFilterTextChanged}
+          renderItem={this.renderItem}
+          renderGroupHeader={this.renderGroupHeader}
+          onItemClick={this.onItemClick}
+          renderPostFilter={this.renderPostFilter}
+          renderNoItems={this.renderNoItems}
+          groups={groups}
+          invalidationProps={{
+            repositories: this.props.repositories,
+            filterText: this.props.filterText,
+          }}
+          onItemContextMenu={this.onItemContextMenu}
+          getGroupAriaLabel={this.getGroupAriaLabelGetter(groups)}
+          getItemAriaLabel={this.getItemAriaLabel}
+        />
       </div>
     )
   }