development/github-desktop
development/github-desktop
1
0
Fork 0
mirror of https://github.com/desktop/desktop synced 2024-10-31 05:19:03 +00:00
Code Issues Projects Releases Packages Wiki Activity

Revert "Merge pull request #17225 from desktop/jc-live-container-chill"

Browse source 
This reverts commit 426b6dd0a7, reversing
changes made to 289e4bc250.
This commit is contained in:
Markus Olsson 2023-08-31 10:21:45 +02:00
parent 6276830343
commit a58b635bd8
2 changed files with 38 additions and 98 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

67
app/src/ui/lib/filter-list.tsx
View file

@ -173,7 +173,6 @@ interface IFilterListState<T extends IFilterListItem> {
readonly rows: ReadonlyArray<IFilterListRow<T>>
readonly selectedRow: number
readonly filterValue: string
readonly filterValueChanged: boolean
}
/**
@ -194,33 +193,25 @@ export class FilterList<T extends IFilterListItem> extends React.Component<
IFilterListProps<T>,
IFilterListState<T>
> {
public static getDerivedStateFromProps(
props: IFilterListProps<IFilterListItem>,
state: IFilterListState<IFilterListItem>
) {
return createStateUpdate(props, state)
}
private list: List | null = null
private filterTextBox: TextBox | null = null
public constructor(props: IFilterListProps<T>) {
super(props)
if (props.filterTextBox !== undefined) {
this.filterTextBox = props.filterTextBox
}
this.state = createStateUpdate(props)
}
const filterValue = (props.filterText || '').toLowerCase()
this.state = {
rows: new Array<IFilterListRow<T>>(),
selectedRow: -1,
filterValue,
filterValueChanged: filterValue.length > 0,
public componentWillMount() {
if (this.props.filterTextBox !== undefined) {
this.filterTextBox = this.props.filterTextBox
}
}
public componentWillReceiveProps(nextProps: IFilterListProps<T>) {
this.setState(createStateUpdate(nextProps))
}
public componentDidUpdate(
prevProps: IFilterListProps<T>,
prevState: IFilterListState<T>
@ -285,23 +276,6 @@ export class FilterList<T extends IFilterListItem> extends React.Component<
)
}
public renderLiveContainer() {
if (!this.state.filterValueChanged) {
return null
}
const itemRows = this.state.rows.filter(row => row.kind === 'item')
const resultsPluralized = itemRows.length === 1 ? 'result' : 'results'
const screenReaderMessage = `${itemRows.length} ${resultsPluralized}`
return (
<AriaLiveContainer
message={screenReaderMessage}
trackedUserInput={this.state.filterValue}
/>
)
}
public renderFilterRow() {
if (this.props.hideFilterRow === true) {
return null
@ -316,10 +290,16 @@ export class FilterList<T extends IFilterListItem> extends React.Component<
}
public render() {
const itemRows = this.state.rows.filter(row => row.kind === 'item')
const resultsPluralized = itemRows.length === 1 ? 'result' : 'results'
const screenReaderMessage = `${itemRows.length} ${resultsPluralized}`
return (
<div className={classnames('filter-list', this.props.className)}>
{this.renderLiveContainer()}
<AriaLiveContainer
message={screenReaderMessage}
trackedUserInput={this.state.filterValue}
/>
{this.props.renderPreList ? this.props.renderPreList() : null}
{this.renderFilterRow()}
@ -597,8 +577,7 @@ export function getText<T extends IFilterListItem>(
}
function createStateUpdate<T extends IFilterListItem>(
props: IFilterListProps<T>,
state: IFilterListState<T>
props: IFilterListProps<T>
) {
const flattenedRows = new Array<IFilterListRow<T>>()
const filter = (props.filterText || '').toLowerCase()
@ -639,15 +618,7 @@ function createStateUpdate<T extends IFilterListItem>(
selectedRow = flattenedRows.findIndex(i => i.kind === 'item')
}
// Stay true if already set, otherwise become true if the filter has content
const filterValueChanged = state.filterValueChanged ? true : filter.length > 0
return {
rows: flattenedRows,
selectedRow,
filterValue: filter,
filterValueChanged,
}
return { rows: flattenedRows, selectedRow, filterValue: filter }
}
function getItemFromRowIndex<T extends IFilterListItem>(

69
app/src/ui/lib/section-filter-list.tsx
View file

@ -166,7 +166,6 @@ interface IFilterListState<T extends IFilterListItem> {
readonly rows: ReadonlyArray<ReadonlyArray<IFilterListRow<T>>>
readonly selectedRow: RowIndexPath
readonly filterValue: string
readonly filterValueChanged: boolean
// Indices of groups in the filtered list
readonly groups: ReadonlyArray<number>
}
@ -175,34 +174,25 @@ interface IFilterListState<T extends IFilterListItem> {
export class SectionFilterList<
T extends IFilterListItem
> extends React.Component<ISectionFilterListProps<T>, IFilterListState<T>> {
public static getDerivedStateFromProps(
props: ISectionFilterListProps<IFilterListItem>,
state: IFilterListState<IFilterListItem>
) {
return createStateUpdate(props, state)
}
private list: SectionList | null = null
private filterTextBox: TextBox | null = null
public constructor(props: ISectionFilterListProps<T>) {
super(props)
if (props.filterTextBox !== undefined) {
this.filterTextBox = props.filterTextBox
}
this.state = createStateUpdate(props)
}
const filterValue = (props.filterText || '').toLowerCase()
this.state = {
rows: new Array<Array<IFilterListRow<T>>>(),
selectedRow: InvalidRowIndexPath,
filterValue,
filterValueChanged: filterValue.length > 0,
groups: [],
public componentWillMount() {
if (this.props.filterTextBox !== undefined) {
this.filterTextBox = this.props.filterTextBox
}
}
public componentWillReceiveProps(nextProps: ISectionFilterListProps<T>) {
this.setState(createStateUpdate(nextProps))
}
public componentDidUpdate(
prevProps: ISectionFilterListProps<T>,
prevState: IFilterListState<T>
@ -267,23 +257,6 @@ export class SectionFilterList<
)
}
public renderLiveContainer() {
if (!this.state.filterValueChanged) {
return null
}
const itemRows = this.state.rows.flat().filter(row => row.kind === 'item')
const resultsPluralized = itemRows.length === 1 ? 'result' : 'results'
const screenReaderMessage = `${itemRows.length} ${resultsPluralized}`
return (
<AriaLiveContainer
trackedUserInput={this.state.filterValue}
message={screenReaderMessage}
/>
)
}
public renderFilterRow() {
if (this.props.hideFilterRow === true) {
return null
@ -298,10 +271,16 @@ export class SectionFilterList<
}
public render() {
const itemRows = this.state.rows.flat().filter(row => row.kind === 'item')
const resultsPluralized = itemRows.length === 1 ? 'result' : 'results'
const screenReaderMessage = `${itemRows.length} ${resultsPluralized}`
return (
<div className={classnames('filter-list', this.props.className)}>
{this.renderLiveContainer()}
<AriaLiveContainer
trackedUserInput={this.state.filterValue}
message={screenReaderMessage}
/>
{this.props.renderPreList ? this.props.renderPreList() : null}
{this.renderFilterRow()}
@ -635,8 +614,7 @@ function getFirstVisibleRow<T extends IFilterListItem>(
}
function createStateUpdate<T extends IFilterListItem>(
props: ISectionFilterListProps<T>,
state: IFilterListState<T>
props: ISectionFilterListProps<T>
) {
const rows = new Array<Array<IFilterListRow<T>>>()
const filter = (props.filterText || '').toLowerCase()
@ -686,16 +664,7 @@ function createStateUpdate<T extends IFilterListItem>(
selectedRow = getFirstVisibleRow(rows)
}
// Stay true if already set, otherwise become true if the filter has content
const filterValueChanged = state.filterValueChanged ? true : filter.length > 0
return {
rows: rows,
selectedRow,
filterValue: filter,
filterValueChanged,
groups: groupIndices,
}
return { rows: rows, selectedRow, filterValue: filter, groups: groupIndices }
}
function getItemFromRowIndex<T extends IFilterListItem>(