Unverified Commit d6162d9f authored by Diego Mello's avatar Diego Mello Committed by GitHub
Browse files

Better touch handling on rooms list (#462)

* Use react-native-gesture-handler at RoomItem

* Fixed info message author

* Edit message render improvement

* Fix ws to http replace
parent c58df3b4
This diff is collapsed.
......@@ -41,9 +41,9 @@ const SYSTEM_MESSAGES = [
];
const getInfoMessage = ({
type, role, msg, user
type, role, msg, author
}) => {
const { username } = user;
const { username } = author;
if (type === 'rm') {
return I18n.t('Message_removed');
} else if (type === 'uj') {
......
......@@ -14,10 +14,9 @@ import {
@connect(state => ({
baseUrl: state.settings.Site_Url || state.server ? state.server.server : '',
customEmojis: state.customEmojis,
editing: state.messages.editing,
Message_GroupingPeriod: state.settings.Message_GroupingPeriod,
Message_TimeFormat: state.settings.Message_TimeFormat,
message: state.messages.message,
editingMessage: state.messages.message,
useRealName: state.settings.UI_Use_Real_Name
}), dispatch => ({
errorActionsShow: actionMessage => dispatch(errorActionsShowAction(actionMessage)),
......@@ -43,10 +42,9 @@ export default class MessageContainer extends React.Component {
// redux
baseUrl: PropTypes.string,
customEmojis: PropTypes.object,
editing: PropTypes.bool,
Message_GroupingPeriod: PropTypes.number,
Message_TimeFormat: PropTypes.string,
message: PropTypes.object,
editingMessage: PropTypes.object,
useRealName: PropTypes.bool,
// methods - props
onLongPress: PropTypes.func,
......@@ -73,7 +71,7 @@ export default class MessageContainer extends React.Component {
shouldComponentUpdate(nextProps, nextState) {
const { reactionsModal } = this.state;
const {
status, reactions, broadcast, editing, _updatedAt
status, reactions, broadcast, _updatedAt, editingMessage, item
} = this.props;
if (reactionsModal !== nextState.reactionsModal) {
......@@ -92,8 +90,12 @@ export default class MessageContainer extends React.Component {
if (broadcast !== nextProps.broadcast) {
return true;
}
if (editing !== nextProps.editing) {
return true;
if (!equal(editingMessage, nextProps.editingMessage)) {
if (nextProps.editingMessage && nextProps.editingMessage._id === item._id) {
return true;
} else if (!nextProps.editingMessage._id !== item._id && editingMessage._id === item._id) {
return true;
}
}
return _updatedAt.toGMTString() !== nextProps._updatedAt.toGMTString();
}
......@@ -163,12 +165,12 @@ export default class MessageContainer extends React.Component {
render() {
const { reactionsModal } = this.state;
const {
item, message, editing, user, style, archived, baseUrl, customEmojis, useRealName, broadcast
item, editingMessage, user, style, archived, baseUrl, customEmojis, useRealName, broadcast
} = this.props;
const {
msg, ts, attachments, urls, reactions, t, status, avatar, u, alias, editedBy, role
} = item;
const isEditing = message._id === item._id && editing;
const isEditing = editingMessage._id === item._id;
return (
<Message
msg={msg}
......
......@@ -13,7 +13,7 @@ const restTypes = {
async function canOpenRoomREST({ type, rid }) {
try {
const { token, id } = this.ddp._login;
const server = this.ddp.url.replace('ws', 'http');
const server = this.ddp.url.replace(/^ws/, 'http');
await post({ token, id, server }, `${ restTypes[type] }.open`, { roomId: rid });
return true;
} catch (error) {
......
......@@ -17,7 +17,7 @@ const getRoomRest = async function() {
const { ddp } = this;
const updatedSince = lastMessage();
const { token, id } = ddp._login;
const server = this.ddp.url.replace('ws', 'http');
const server = this.ddp.url.replace(/^ws/, 'http');
const [subscriptions, rooms] = await Promise.all([get({ token, id, server }, 'subscriptions.get', { updatedSince }), get({ token, id, server }, 'rooms.get', { updatedSince })]);
return mergeSubscriptionsRooms(subscriptions, rooms);
};
......
......@@ -12,7 +12,7 @@ const types = {
async function loadMessagesForRoomRest({ rid: roomId, latest, t }) {
const { token, id } = this.ddp._login;
const server = this.ddp.url.replace('ws', 'http');
const server = this.ddp.url.replace(/^ws/, 'http');
const data = await get({ token, id, server }, `${ types[t] }.history`, { roomId, latest });
if (!data || data.status === 'error') {
return [];
......
......@@ -7,7 +7,7 @@ import log from '../../utils/log';
async function loadMissedMessagesRest({ rid: roomId, lastOpen: lastUpdate }) {
const { token, id } = this.ddp._login;
const server = this.ddp.url.replace('ws', 'http');
const server = this.ddp.url.replace(/^ws/, 'http');
const { result } = await get({ token, id, server }, 'chat.syncMessages', { roomId, lastUpdate });
// TODO: api fix
if (!result) {
......
......@@ -4,7 +4,7 @@ import log from '../../utils/log';
const readMessagesREST = function readMessagesREST(rid) {
const { token, id } = this.ddp._login;
const server = this.ddp.url.replace('ws', 'http');
const server = this.ddp.url.replace(/^ws/, 'http');
return post({ token, id, server }, 'subscriptions.read', { rid });
};
......
......@@ -33,7 +33,7 @@ export const getMessage = (rid, msg = {}) => {
function sendMessageByRest(message) {
const { token, id } = this.ddp._login;
const server = this.ddp.url.replace('ws', 'http');
const server = this.ddp.url.replace(/^ws/, 'http');
const { _id, rid, msg } = message;
return post({ token, id, server }, 'chat.sendMessage', { message: { _id, rid, msg } });
}
......
......@@ -6,6 +6,7 @@ import {
} from 'react-native';
import { connect } from 'react-redux';
import { emojify } from 'react-emojione';
import { RectButton } from 'react-native-gesture-handler';
import Avatar from '../containers/Avatar';
import Status from '../containers/status';
......@@ -142,7 +143,6 @@ export default class RoomItem extends React.Component {
userMentions: PropTypes.number,
id: PropTypes.string,
onPress: PropTypes.func,
onLongPress: PropTypes.func,
username: PropTypes.string,
avatarSize: PropTypes.number,
testID: PropTypes.string,
......@@ -229,7 +229,7 @@ export default class RoomItem extends React.Component {
render() {
const {
favorite, unread, userMentions, name, _updatedAt, alert, testID, height, onPress, onLongPress
favorite, unread, userMentions, name, _updatedAt, alert, testID, height, onPress
} = this.props;
const date = this.formatDate(_updatedAt);
......@@ -250,16 +250,16 @@ export default class RoomItem extends React.Component {
}
return (
<Touch
<RectButton
onPress={onPress}
onLongPress={onLongPress}
underlayColor='#FFFFFF'
activeOpacity={0.5}
accessibilityLabel={accessibilityLabel}
accessibilityTraits='selected'
activeOpacity={0.8}
underlayColor='#e1e5e8'
testID={testID}
>
<View style={[styles.container, favorite && styles.favorite, height && { height }]}>
<View
style={[styles.container, favorite && styles.favorite, height && { height }]}
accessibilityLabel={accessibilityLabel}
>
{this.avatar}
<View style={styles.centerContainer}>
<View style={styles.titleContainer}>
......@@ -276,7 +276,7 @@ export default class RoomItem extends React.Component {
</View>
{this.renderDisclosureIndicator()}
</View>
</Touch>
</RectButton>
);
}
}
......@@ -7,6 +7,7 @@ import Icon from 'react-native-vector-icons/Ionicons';
import MaterialIcon from 'react-native-vector-icons/MaterialIcons';
import { connect, Provider } from 'react-redux';
import { Navigation } from 'react-native-navigation';
import { gestureHandlerRootHOC } from 'react-native-gesture-handler';
import { leaveRoom as leaveRoomAction } from '../../actions/room';
import LoggedView from '../View';
......@@ -74,7 +75,7 @@ export default class RoomActionsView extends LoggedView {
if (item.route) {
if (modules[item.route] == null) {
modules[item.route] = item.require();
Navigation.registerComponent(item.route, () => modules[item.route], store, Provider);
Navigation.registerComponent(item.route, () => gestureHandlerRootHOC(modules[item.route]), store, Provider);
}
navigator.push({
screen: item.route,
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment