[NEW] Pull to refresh RoomView (#1657)
This commit is contained in:
parent
7dffa14b77
commit
06085ebffb
|
@ -3,6 +3,7 @@ import { FlatList, InteractionManager } from 'react-native';
|
|||
import PropTypes from 'prop-types';
|
||||
import orderBy from 'lodash/orderBy';
|
||||
import { Q } from '@nozbe/watermelondb';
|
||||
import moment from 'moment';
|
||||
|
||||
import styles from './styles';
|
||||
import database from '../../lib/database';
|
||||
|
@ -37,7 +38,8 @@ class List extends React.Component {
|
|||
this.state = {
|
||||
loading: true,
|
||||
end: false,
|
||||
messages: []
|
||||
messages: [],
|
||||
refreshing: false
|
||||
};
|
||||
this.init();
|
||||
console.timeEnd(`${ this.constructor.name } init`);
|
||||
|
@ -102,7 +104,7 @@ class List extends React.Component {
|
|||
}
|
||||
|
||||
shouldComponentUpdate(nextProps, nextState) {
|
||||
const { loading, end } = this.state;
|
||||
const { loading, end, refreshing } = this.state;
|
||||
const { theme } = this.props;
|
||||
if (theme !== nextProps.theme) {
|
||||
return true;
|
||||
|
@ -113,6 +115,9 @@ class List extends React.Component {
|
|||
if (end !== nextState.end) {
|
||||
return true;
|
||||
}
|
||||
if (refreshing !== nextState.refreshing) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
|
@ -153,6 +158,25 @@ class List extends React.Component {
|
|||
}
|
||||
}, 300)
|
||||
|
||||
onRefresh = () => this.setState({ refreshing: true }, async() => {
|
||||
const { messages } = this.state;
|
||||
const { rid, tmid } = this.props;
|
||||
|
||||
if (messages.length) {
|
||||
try {
|
||||
if (tmid) {
|
||||
await RocketChat.loadThreadMessages({ tmid, rid, offset: messages.length - 1 });
|
||||
} else {
|
||||
await RocketChat.loadMissedMessages({ rid, lastOpen: moment().subtract(7, 'days').toDate() });
|
||||
}
|
||||
} catch (e) {
|
||||
log(e);
|
||||
}
|
||||
}
|
||||
|
||||
this.setState({ refreshing: false });
|
||||
})
|
||||
|
||||
// eslint-disable-next-line react/sort-comp
|
||||
update = () => {
|
||||
animateNextTransition();
|
||||
|
@ -191,7 +215,7 @@ class List extends React.Component {
|
|||
render() {
|
||||
console.count(`${ this.constructor.name }.render calls`);
|
||||
const { rid, listRef } = this.props;
|
||||
const { messages } = this.state;
|
||||
const { messages, refreshing } = this.state;
|
||||
const { theme } = this.props;
|
||||
return (
|
||||
<>
|
||||
|
@ -213,6 +237,8 @@ class List extends React.Component {
|
|||
maxToRenderPerBatch={5}
|
||||
windowSize={10}
|
||||
ListFooterComponent={this.renderFooter}
|
||||
onRefresh={this.onRefresh}
|
||||
refreshing={refreshing}
|
||||
{...scrollPersistTaps}
|
||||
/>
|
||||
</>
|
||||
|
|
Loading…
Reference in New Issue