From c3ffa37323397550aad118362d8f102f5fa40287 Mon Sep 17 00:00:00 2001 From: Gerzon Z Date: Tue, 4 May 2021 14:02:01 -0400 Subject: [PATCH] Refactor touch component and update removeRoom and deleteRoom methods --- .../__snapshots__/Storyshots.test.js.snap | 4316 +++++++++-------- app/containers/List/ListItem.js | 3 +- app/i18n/locales/en.json | 4 +- app/lib/rocketchat.js | 8 +- app/presentation/RoomItem/RoomItem.js | 3 - app/presentation/RoomItem/Touchable.js | 14 +- app/presentation/RoomItem/index.js | 4 - app/utils/touch.js | 14 +- app/views/AddChannelTeamView.js | 1 - app/views/NewMessageView.js | 1 - app/views/RoomsListView/index.js | 7 +- app/views/TeamChannelsView.js | 68 +- 12 files changed, 2489 insertions(+), 1954 deletions(-) diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap index 4c88d8e5c..f99bbe10d 100644 --- a/__tests__/__snapshots__/Storyshots.test.js.snap +++ b/__tests__/__snapshots__/Storyshots.test.js.snap @@ -4154,49 +4154,72 @@ exports[`Storyshots List pressable 1`] = ` } /> - - Press me - + + Press me + + - - I'm disabled - + + I'm disabled + + - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -5680,149 +5749,172 @@ exports[`Storyshots List with bigger font 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -5916,147 +6008,170 @@ exports[`Storyshots List with bigger font 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -6074,149 +6189,172 @@ exports[`Storyshots List with bigger font 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -6351,147 +6489,170 @@ exports[`Storyshots List with black theme 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -6509,149 +6670,172 @@ exports[`Storyshots List with black theme 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -6745,147 +6929,170 @@ exports[`Storyshots List with black theme 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -6903,149 +7110,172 @@ exports[`Storyshots List with black theme 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -7193,49 +7423,73 @@ exports[`Storyshots List with custom colors 1`] = ` } /> - - Press me! - + + Press me! + + - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -7498,149 +7775,172 @@ exports[`Storyshots List with dark theme 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -7734,147 +8034,170 @@ exports[`Storyshots List with dark theme 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -7892,149 +8215,172 @@ exports[`Storyshots List with dark theme 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -9461,147 +9807,170 @@ exports[`Storyshots List with small font 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -9619,149 +9988,172 @@ exports[`Storyshots List with small font 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -9855,147 +10247,170 @@ exports[`Storyshots List with small font 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -10013,149 +10428,172 @@ exports[`Storyshots List with small font 1`] = ` } /> - -  + +  + + + + + + Chats + + + All - - - - Chats - - - All - - - - -  - + +  + + @@ -44349,6 +44787,7 @@ exports[`Storyshots Room Item Alerts 1`] = ` > ( onPress(props.title)} - style={{ backgroundColor: backgroundColor || themes[props.theme].backgroundColor }} underlayColor={underlayColor} enabled={!props.disabled} theme={props.theme} diff --git a/app/i18n/locales/en.json b/app/i18n/locales/en.json index 2854728ab..08532be5e 100644 --- a/app/i18n/locales/en.json +++ b/app/i18n/locales/en.json @@ -722,5 +722,7 @@ "Add_Existing": "Add Existing", "Add_Existing_Channel": "Add Existing Channel", "Remove_from_Team": "Remove from Team", - "Auto-join": "Auto-join" + "Auto-join": "Auto-join", + "Delete_Team_Room_Warning": "Woud you like to remove this channel from the team? The channel will be moved back to the workspace", + "Confirmation": "Confirmation" } diff --git a/app/lib/rocketchat.js b/app/lib/rocketchat.js index b98ab4958..d9cfbc201 100644 --- a/app/lib/rocketchat.js +++ b/app/lib/rocketchat.js @@ -754,13 +754,9 @@ const RocketChat = { // RC 3.13.0 return this.post('teams.addRooms', params); }, - deleteTeamRoom({ rid, teamId }) { - const params = { - roomId: rid, - teamId - }; + removeTeamRoom({ roomId, teamId }) { // RC 3.13.0 - return this.post('teams.removeRoom', params); + return this.post('teams.removeRoom', { roomId, teamId }); }, joinRoom(roomId, joinCode, type) { // TODO: join code diff --git a/app/presentation/RoomItem/RoomItem.js b/app/presentation/RoomItem/RoomItem.js index 6d8c31c20..bfbce938e 100644 --- a/app/presentation/RoomItem/RoomItem.js +++ b/app/presentation/RoomItem/RoomItem.js @@ -24,7 +24,6 @@ const RoomItem = ({ status, useRealName, theme, - isFocused, isGroupChat, isRead, date, @@ -61,7 +60,6 @@ const RoomItem = ({ testID={testID} type={type} theme={theme} - isFocused={isFocused} swipeEnabled={swipeEnabled} > - {children} - + diff --git a/app/presentation/RoomItem/index.js b/app/presentation/RoomItem/index.js index ee131867d..2815db35d 100644 --- a/app/presentation/RoomItem/index.js +++ b/app/presentation/RoomItem/index.js @@ -14,7 +14,6 @@ const attrs = [ 'status', 'connected', 'theme', - 'isFocused', 'forceUpdate', 'showLastMessage' ]; @@ -37,7 +36,6 @@ class RoomItemContainer extends React.Component { getUserPresence: PropTypes.func, connected: PropTypes.bool, theme: PropTypes.string, - isFocused: PropTypes.bool, getRoomTitle: PropTypes.func, getRoomAvatar: PropTypes.func, getIsGroupChat: PropTypes.func, @@ -129,7 +127,6 @@ class RoomItemContainer extends React.Component { toggleRead, hideChannel, theme, - isFocused, avatarSize, status, showLastMessage, @@ -178,7 +175,6 @@ class RoomItemContainer extends React.Component { testID={testID} type={item.t} theme={theme} - isFocused={isFocused} size={avatarSize} prid={item.prid} status={status} diff --git a/app/utils/touch.js b/app/utils/touch.js index ae9d01bb0..f7dc6c866 100644 --- a/app/utils/touch.js +++ b/app/utils/touch.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { RectButton } from 'react-native-gesture-handler'; +import { Pressable } from 'react-native'; import { themes } from '../constants/colors'; class Touch extends React.Component { @@ -15,21 +15,23 @@ class Touch extends React.Component { render() { const { - children, onPress, onLongPress, theme, underlayColor, ...props + children, onPress, onLongPress, theme, ...props } = this.props; return ( - [{ + backgroundColor: pressed ? themes[theme].chatComponentBackground : themes[theme].backgroundColor + }]} + android_ripple={{ color: themes[theme].bannerBackground }} {...props} > {children} - + ); } } diff --git a/app/views/AddChannelTeamView.js b/app/views/AddChannelTeamView.js index 4d3cf2015..27cf6646a 100644 --- a/app/views/AddChannelTeamView.js +++ b/app/views/AddChannelTeamView.js @@ -72,7 +72,6 @@ class AddChannelTeamView extends React.Component { return ( diff --git a/app/views/NewMessageView.js b/app/views/NewMessageView.js index 5e4ef1c99..66ea00482 100644 --- a/app/views/NewMessageView.js +++ b/app/views/NewMessageView.js @@ -148,7 +148,6 @@ class NewMessageView extends React.Component { return ( diff --git a/app/views/RoomsListView/index.js b/app/views/RoomsListView/index.js index 19df2c3b0..0daf85dc7 100644 --- a/app/views/RoomsListView/index.js +++ b/app/views/RoomsListView/index.js @@ -586,10 +586,7 @@ class RoomsListView extends React.Component { } onPressItem = (item = {}) => { - const { navigation, isMasterDetail } = this.props; - if (!navigation.isFocused()) { - return; - } + const { isMasterDetail } = this.props; this.cancelSearch(); this.goRoom({ item, isMasterDetail }); @@ -894,7 +891,6 @@ class RoomsListView extends React.Component { return this.renderSectionHeader(item.rid); } - const { item: currentItem } = this.state; const { user: { username }, StoreLastMessage, @@ -925,7 +921,6 @@ class RoomsListView extends React.Component { getIsGroupChat={this.isGroupChat} getIsRead={this.isRead} visitor={item.visitor} - isFocused={currentItem?.rid === item.rid} /> ); }; diff --git a/app/views/TeamChannelsView.js b/app/views/TeamChannelsView.js index 4fa8bb2c0..129980881 100644 --- a/app/views/TeamChannelsView.js +++ b/app/views/TeamChannelsView.js @@ -51,6 +51,7 @@ class TeamChannelsView extends React.Component { width: PropTypes.number, StoreLastMessage: PropTypes.bool, addTeamChannelPermission: PropTypes.array, + removeTeamChannelPermission: PropTypes.array, showActionSheet: PropTypes.func, deleteRoom: PropTypes.func } @@ -79,6 +80,8 @@ class TeamChannelsView extends React.Component { loadTeam = async() => { const { addTeamChannelPermission } = this.props; + const { loading } = this.state; + const db = database.active; try { const subCollection = db.get('subscriptions'); @@ -96,6 +99,9 @@ class TeamChannelsView extends React.Component { if (permissions[0]) { this.setState({ showCreate: true }, () => this.setHeader()); } + if (loading) { + this.setState({ loading: false }); + } } catch { const { navigation } = this.props; navigation.pop(); @@ -103,7 +109,7 @@ class TeamChannelsView extends React.Component { } } - load = debounce(async() => { + load = async() => { const { loadingMore, data, search, isSearching, searchText, end } = this.state; @@ -147,7 +153,7 @@ class TeamChannelsView extends React.Component { log(e); this.setState({ loading: false, loadingMore: false }); } - }, 300) + } setHeader = () => { const { isSearching, showCreate, data } = this.state; @@ -308,18 +314,54 @@ class TeamChannelsView extends React.Component { title: I18n.t('Remove_from_Team'), icon: 'close', danger: true, - onPress: this.removeFromTeam(item.id, this.teamId) + onPress: () => this.remove(item) }, { title: I18n.t('Delete'), icon: 'delete', danger: true, - onPress: this.delete + onPress: () => this.delete(item) } ]) - delete = () => { - const { room } = this.state; + remove = (item) => { + Alert.alert( + I18n.t('Confirmation'), + I18n.t('Delete_Team_Room_Warning'), + [ + { + text: I18n.t('Cancel'), + style: 'cancel' + }, + { + text: I18n.t('Yes_action_it', { action: I18n.t('delete') }), + style: 'destructive', + onPress: () => this.removeRoom(item) + } + ], + { cancelable: false } + ); + } + + removeRoom = async(item) => { + try { + const { data } = this.state; + const result = await RocketChat.removeTeamRoom({ roomId: item.rid, teamId: this.team.teamId }); + if (result.success) { + console.log({ result }); + const newData = data.filter(room => result.room._id !== room.rid); + console.log({ newData }); + this.setState({ loading: true, data: newData }, () => { + this.loadTeam(); + this.load(); + }); + } + } catch (e) { + log(e); + } + } + + delete = (item) => { const { deleteRoom } = this.props; Alert.alert( @@ -333,16 +375,21 @@ class TeamChannelsView extends React.Component { { text: I18n.t('Yes_action_it', { action: I18n.t('delete') }), style: 'destructive', - onPress: () => deleteRoom(room.rid, room.t) + onPress: () => deleteRoom(item.rid, item.t) } ], { cancelable: false } ); } - showChannelActions = (item) => { + showChannelActions = async(item) => { logEvent(events.ROOM_SHOW_BOX_ACTIONS); - const { showActionSheet } = this.props; + const { showActionSheet, removeTeamChannelPermission } = this.props; + + const permissions = await RocketChat.hasPermission([removeTeamChannelPermission], this.team.rid); + if (!permissions[0]) { + return; + } showActionSheet({ options: this.options(item) }); } @@ -426,7 +473,8 @@ const mapStateToProps = state => ({ useRealName: state.settings.UI_Use_Real_Name, isMasterDetail: state.app.isMasterDetail, StoreLastMessage: state.settings.Store_Last_Message, - addTeamChannelPermission: state.permissions['add-team-channel'] + addTeamChannelPermission: state.permissions['add-team-channel'], + removeTeamChannelPermission: state.permissions['remove-team-channel'] }); const mapDispatchToProps = dispatch => ({