From 06085ebffbc12562f4939a2ac6bc99c23ec5e5d2 Mon Sep 17 00:00:00 2001 From: Djorkaeff Alexandre Date: Wed, 5 Feb 2020 10:27:06 -0300 Subject: [PATCH] [NEW] Pull to refresh RoomView (#1657) --- app/views/RoomView/List.js | 32 +++++++++++++++++++++++++++++--- 1 file changed, 29 insertions(+), 3 deletions(-) diff --git a/app/views/RoomView/List.js b/app/views/RoomView/List.js index 94daeb805..1d4d8e248 100644 --- a/app/views/RoomView/List.js +++ b/app/views/RoomView/List.js @@ -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} />