Fix DiscussionMessagesView
This commit is contained in:
parent
c066c208d3
commit
daba3b44e9
|
@ -1,4 +1,4 @@
|
||||||
import React, { useEffect, useRef, useState } from 'react';
|
import React, { useEffect, useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { FlatList } from 'react-native';
|
import { FlatList } from 'react-native';
|
||||||
import { useSelector } from 'react-redux';
|
import { useSelector } from 'react-redux';
|
||||||
|
@ -6,44 +6,44 @@ import { Q } from '@nozbe/watermelondb';
|
||||||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||||
import { HeaderBackButton } from '@react-navigation/stack';
|
import { HeaderBackButton } from '@react-navigation/stack';
|
||||||
|
|
||||||
import Item from './ThreadMessagesView/Item';
|
|
||||||
import ActivityIndicator from '../containers/ActivityIndicator';
|
import ActivityIndicator from '../containers/ActivityIndicator';
|
||||||
import I18n from '../i18n';
|
import I18n from '../i18n';
|
||||||
import RocketChat from '../lib/rocketchat';
|
|
||||||
import database from '../lib/database';
|
import database from '../lib/database';
|
||||||
import StatusBar from '../containers/StatusBar';
|
import StatusBar from '../containers/StatusBar';
|
||||||
import log from '../utils/log';
|
import log from '../utils/log';
|
||||||
import debounce from '../utils/debounce';
|
import debounce from '../utils/debounce';
|
||||||
import { themes } from '../constants/colors';
|
import { themes } from '../constants/colors';
|
||||||
import { getUserSelector } from '../selectors/login';
|
|
||||||
import SafeAreaView from '../containers/SafeAreaView';
|
import SafeAreaView from '../containers/SafeAreaView';
|
||||||
import * as HeaderButton from '../containers/HeaderButton';
|
import * as HeaderButton from '../containers/HeaderButton';
|
||||||
import * as List from '../containers/List';
|
import * as List from '../containers/List';
|
||||||
import BackgroundContainer from '../containers/BackgroundContainer';
|
import BackgroundContainer from '../containers/BackgroundContainer';
|
||||||
import { isIOS } from '../utils/deviceInfo';
|
import { isIOS } from '../utils/deviceInfo';
|
||||||
import { makeThreadName } from '../utils/room';
|
|
||||||
import { getHeaderTitlePosition } from '../containers/Header';
|
import { getHeaderTitlePosition } from '../containers/Header';
|
||||||
import SearchHeader from './ThreadMessagesView/SearchHeader';
|
import SearchHeader from './ThreadMessagesView/SearchHeader';
|
||||||
import { useTheme } from '../theme';
|
import { useTheme } from '../theme';
|
||||||
|
import Message from '../containers/message';
|
||||||
|
|
||||||
const DiscussionMessagesView = ({ navigation, route }) => {
|
const DiscussionMessagesView = ({ navigation, route }) => {
|
||||||
const mounted = useRef();
|
|
||||||
const rid = route.params?.rid;
|
const rid = route.params?.rid;
|
||||||
const t = route.params?.t;
|
// const t = route.params?.t;
|
||||||
const prid = route.params?.prid;
|
// const prid = route.params?.prid;
|
||||||
|
const canAutoTranslate = route.params?.canAutoTranslate;
|
||||||
|
const autoTranslate = route.params?.autoTranslate;
|
||||||
|
const autoTranslateLanguage = route.params?.autoTranslateLanguage;
|
||||||
const baseUrl = useSelector(state => state.server.server);
|
const baseUrl = useSelector(state => state.server.server);
|
||||||
const user = useSelector(state => getUserSelector(state));
|
// const user = useSelector(state => getUserSelector(state));
|
||||||
const useRealName = useSelector(state => state.settings.UI_Use_Real_Name);
|
const useRealName = useSelector(state => state.settings.UI_Use_Real_Name);
|
||||||
|
const Message_TimeFormat = useSelector(state => state.settings.Message_TimeFormat);
|
||||||
const isMasterDetail = useSelector(state => state.app.isMasterDetail);
|
const isMasterDetail = useSelector(state => state.app.isMasterDetail);
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
const [discussions, setDiscussions] = useState([]);
|
const [discussions, setDiscussions] = useState([]);
|
||||||
const [isSearching, setIsSearching] = useState(false);
|
const [isSearching, setIsSearching] = useState(false);
|
||||||
// const [searchText, setSearchText] = useState('');
|
const [searchText, setSearchText] = useState('');
|
||||||
const theme = useTheme();
|
const { theme } = useTheme();
|
||||||
const insets = useSafeAreaInsets();
|
const insets = useSafeAreaInsets();
|
||||||
|
|
||||||
const load = debounce(async() => {
|
const load = async() => {
|
||||||
if (loading || !mounted) {
|
if (loading) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -51,21 +51,26 @@ const DiscussionMessagesView = ({ navigation, route }) => {
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const db = database.active;
|
const db = database.active;
|
||||||
const subCollection = db.get('subscriptions');
|
const subCollection = db.get('messages');
|
||||||
const discussionsMessages = await subCollection.query(
|
const subDiscussions = await subCollection.query(
|
||||||
Q.where('rid', Q.eq(rid)),
|
Q.where('rid', Q.eq(rid)),
|
||||||
Q.where('prid', Q.eq(prid))
|
Q.where('drid', Q.notEq(null))
|
||||||
);
|
);
|
||||||
setDiscussions(discussionsMessages);
|
setDiscussions(subDiscussions);
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
log(e);
|
log(e);
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const onSearchChangeText = debounce((text) => {
|
||||||
|
setSearchText(text);
|
||||||
}, 300);
|
}, 300);
|
||||||
|
|
||||||
// const onSearchChangeText = debounce((text) => {
|
const onCancelSearchPress = () => {
|
||||||
// setSearchText(text);
|
setIsSearching(false);
|
||||||
// }, 300);
|
setSearchText('');
|
||||||
|
};
|
||||||
|
|
||||||
const onSearchPress = () => {
|
const onSearchPress = () => {
|
||||||
setIsSearching(true);
|
setIsSearching(true);
|
||||||
|
@ -80,11 +85,11 @@ const DiscussionMessagesView = ({ navigation, route }) => {
|
||||||
<HeaderButton.Container left>
|
<HeaderButton.Container left>
|
||||||
<HeaderButton.Item
|
<HeaderButton.Item
|
||||||
iconName='close'
|
iconName='close'
|
||||||
onPress={this.onCancelSearchPress}
|
onPress={onCancelSearchPress}
|
||||||
/>
|
/>
|
||||||
</HeaderButton.Container>
|
</HeaderButton.Container>
|
||||||
),
|
),
|
||||||
headerTitle: () => <SearchHeader onSearchChangeText={this.onSearchChangeText} />,
|
headerTitle: () => <SearchHeader onSearchChangeText={onSearchChangeText} />,
|
||||||
headerTitleContainerStyle: {
|
headerTitleContainerStyle: {
|
||||||
left: headerTitlePosition.left,
|
left: headerTitlePosition.left,
|
||||||
right: headerTitlePosition.right
|
right: headerTitlePosition.right
|
||||||
|
@ -102,7 +107,7 @@ const DiscussionMessagesView = ({ navigation, route }) => {
|
||||||
/>
|
/>
|
||||||
),
|
),
|
||||||
headerTitleAlign: 'center',
|
headerTitleAlign: 'center',
|
||||||
headerTitle: I18n.t('Discussion'),
|
headerTitle: I18n.t('Discussions'),
|
||||||
headerTitleContainerStyle: {
|
headerTitleContainerStyle: {
|
||||||
left: null,
|
left: null,
|
||||||
right: null
|
right: null
|
||||||
|
@ -121,54 +126,34 @@ const DiscussionMessagesView = ({ navigation, route }) => {
|
||||||
return options;
|
return options;
|
||||||
};
|
};
|
||||||
|
|
||||||
// const onCancelSearchPress = () => {
|
|
||||||
// setIsSearching(false);
|
|
||||||
// setSearchText('');
|
|
||||||
// setHeader();
|
|
||||||
// };
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!mounted.current) {
|
|
||||||
load();
|
load();
|
||||||
mounted.current = true;
|
const options = setHeader();
|
||||||
} else {
|
navigation.setOptions(options);
|
||||||
setHeader();
|
|
||||||
}
|
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
|
||||||
const onThreadPress = debounce((item) => {
|
const onDiscussionPress = debounce((item) => {
|
||||||
if (isMasterDetail) {
|
|
||||||
navigation.pop();
|
|
||||||
}
|
|
||||||
navigation.push('RoomView', {
|
navigation.push('RoomView', {
|
||||||
rid: item.subscription.id,
|
rid: item.drid, prid: item.rid, name: item.msg, t: 'p'
|
||||||
name: makeThreadName(item),
|
|
||||||
t,
|
|
||||||
roomUserId: RocketChat.getUidDirectMessage(item)
|
|
||||||
});
|
});
|
||||||
}, 1000, true);
|
}, 1000, true);
|
||||||
|
|
||||||
const getBadgeColor = item => getBadgeColor({ item, theme, messageId: item?.id });
|
|
||||||
|
|
||||||
// eslint-disable-next-line react/prop-types
|
// eslint-disable-next-line react/prop-types
|
||||||
const renderItem = ({ item }) => {
|
const renderItem = ({ item }) => (
|
||||||
const badgeColor = getBadgeColor(item);
|
<Message
|
||||||
return (
|
item={item}
|
||||||
<Item
|
// eslint-disable-next-line react/prop-types
|
||||||
// eslint-disable-next-line react/jsx-props-no-spreading
|
user={item.id}
|
||||||
{...{
|
rid={rid}
|
||||||
item,
|
onDiscussionPress={onDiscussionPress}
|
||||||
user,
|
baseUrl={baseUrl}
|
||||||
navigation,
|
timeFormat={Message_TimeFormat}
|
||||||
baseUrl,
|
useRealName={useRealName}
|
||||||
useRealName,
|
autoTranslateRoom={canAutoTranslate && autoTranslate}
|
||||||
badgeColor
|
autoTranslateLanguage={autoTranslateLanguage}
|
||||||
}}
|
|
||||||
onPress={onThreadPress}
|
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
};
|
|
||||||
|
|
||||||
if (!discussions?.length) {
|
if (!discussions?.length) {
|
||||||
return (
|
return (
|
||||||
|
@ -186,7 +171,6 @@ const DiscussionMessagesView = ({ navigation, route }) => {
|
||||||
renderItem={renderItem}
|
renderItem={renderItem}
|
||||||
// style={[styles.list, { backgroundColor: themes[theme].backgroundColor }]}
|
// style={[styles.list, { backgroundColor: themes[theme].backgroundColor }]}
|
||||||
// contentContainerStyle={styles.contentContainer}
|
// contentContainerStyle={styles.contentContainer}
|
||||||
onEndReached={load}
|
|
||||||
onEndReachedThreshold={0.5}
|
onEndReachedThreshold={0.5}
|
||||||
maxToRenderPerBatch={5}
|
maxToRenderPerBatch={5}
|
||||||
windowSize={10}
|
windowSize={10}
|
||||||
|
|
|
@ -985,7 +985,9 @@ class RoomActionsView extends React.Component {
|
||||||
rid,
|
rid,
|
||||||
t,
|
t,
|
||||||
prid,
|
prid,
|
||||||
name: 'Discussions'
|
canAutoTranslate,
|
||||||
|
autoTranslate: room.autoTranslate,
|
||||||
|
autoTranslateLanguage: room.autoTranslateLanguage
|
||||||
}
|
}
|
||||||
})}
|
})}
|
||||||
testID='room-actions-discussions'
|
testID='room-actions-discussions'
|
||||||
|
|
Loading…
Reference in New Issue