chore: Migrate RightButtonsContainer room to ts

This commit is contained in:
AlexAlexandre 2021-12-02 17:47:01 -03:00
parent 9b746cf1e0
commit 46cf0f8e6f
2 changed files with 29 additions and 25 deletions

View File

@ -12,7 +12,7 @@ const styles = StyleSheet.create({
} }
}); });
interface IRoomLeftButtons { interface IRoomLeftButtonsProps {
tmid: string; tmid: string;
unreadsCount: number; unreadsCount: number;
navigation: any; // TODO - change this after merge react navigation navigation: any; // TODO - change this after merge react navigation
@ -39,7 +39,7 @@ const LeftButtons = React.memo(
theme, theme,
goRoomActionsView, goRoomActionsView,
isMasterDetail isMasterDetail
}: IRoomLeftButtons) => { }: IRoomLeftButtonsProps) => {
if (!isMasterDetail || tmid) { if (!isMasterDetail || tmid) {
const onPress = useCallback(() => navigation.goBack(), []); const onPress = useCallback(() => navigation.goBack(), []);
const label: any = unreadsCount > 99 ? '+99' : unreadsCount || ' '; const label: any = unreadsCount > 99 ? '+99' : unreadsCount || ' ';

View File

@ -1,7 +1,8 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { dequal } from 'dequal'; import { dequal } from 'dequal';
import { Subscription } from 'rxjs';
import Model from '@nozbe/watermelondb/Model';
import * as HeaderButton from '../../containers/HeaderButton'; import * as HeaderButton from '../../containers/HeaderButton';
import database from '../../lib/database'; import database from '../../lib/database';
@ -9,22 +10,25 @@ import { getUserSelector } from '../../selectors/login';
import { events, logEvent } from '../../utils/log'; import { events, logEvent } from '../../utils/log';
import { isTeamRoom } from '../../utils/room'; import { isTeamRoom } from '../../utils/room';
class RightButtonsContainer extends Component { interface IRoomRightButtonsContainerProps {
static propTypes = { userId: string;
userId: PropTypes.string, threadsEnabled: boolean;
threadsEnabled: PropTypes.bool, rid: string;
rid: PropTypes.string, t: string;
t: PropTypes.string, tmid: string;
tmid: PropTypes.string, teamId: string;
teamId: PropTypes.string, navigation: any; // TODO - change this after merge react navigation
navigation: PropTypes.object, isMasterDetail: boolean;
isMasterDetail: PropTypes.bool, toggleFollowThread: Function;
toggleFollowThread: PropTypes.func, joined: boolean;
joined: PropTypes.bool, encrypted: boolean;
encrypted: PropTypes.bool }
};
constructor(props) { class RightButtonsContainer extends Component<IRoomRightButtonsContainerProps, any> {
private threadSubscription?: Subscription;
private subSubscription?: Subscription;
constructor(props: IRoomRightButtonsContainerProps) {
super(props); super(props);
this.state = { this.state = {
isFollowingThread: true, isFollowingThread: true,
@ -56,7 +60,7 @@ class RightButtonsContainer extends Component {
} }
} }
shouldComponentUpdate(nextProps, nextState) { shouldComponentUpdate(nextProps: IRoomRightButtonsContainerProps, nextState: any) {
const { isFollowingThread, tunread, tunreadUser, tunreadGroup } = this.state; const { isFollowingThread, tunread, tunreadUser, tunreadGroup } = this.state;
const { teamId } = this.props; const { teamId } = this.props;
if (nextProps.teamId !== teamId) { if (nextProps.teamId !== teamId) {
@ -86,26 +90,26 @@ class RightButtonsContainer extends Component {
} }
} }
observeThread = threadRecord => { observeThread = (threadRecord: Model) => {
const threadObservable = threadRecord.observe(); const threadObservable = threadRecord.observe();
this.threadSubscription = threadObservable.subscribe(thread => this.updateThread(thread)); this.threadSubscription = threadObservable.subscribe(thread => this.updateThread(thread));
}; };
updateThread = thread => { updateThread = (thread: any) => {
const { userId } = this.props; const { userId } = this.props;
this.setState({ this.setState({
isFollowingThread: thread.replies && !!thread.replies.find(t => t === userId) isFollowingThread: thread.replies && !!thread.replies.find((t: string) => t === userId)
}); });
}; };
observeSubscription = subRecord => { observeSubscription = (subRecord: Model) => {
const subObservable = subRecord.observe(); const subObservable = subRecord.observe();
this.subSubscription = subObservable.subscribe(sub => { this.subSubscription = subObservable.subscribe(sub => {
this.updateSubscription(sub); this.updateSubscription(sub);
}); });
}; };
updateSubscription = sub => { updateSubscription = (sub: any) => {
this.setState({ this.setState({
tunread: sub?.tunread, tunread: sub?.tunread,
tunreadUser: sub?.tunreadUser, tunreadUser: sub?.tunreadUser,
@ -194,7 +198,7 @@ class RightButtonsContainer extends Component {
} }
} }
const mapStateToProps = state => ({ const mapStateToProps = (state: any) => ({
userId: getUserSelector(state).id, userId: getUserSelector(state).id,
threadsEnabled: state.settings.Threads_enabled, threadsEnabled: state.settings.Threads_enabled,
isMasterDetail: state.app.isMasterDetail isMasterDetail: state.app.isMasterDetail