fix: message re-rendering twice in a row (#5051)

This commit is contained in:
Reinaldo Neto 2023-05-10 15:44:05 -03:00 committed by GitHub
parent 53ee79799a
commit f4ff7c82af
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 30 additions and 32 deletions

View File

@ -1,37 +1,33 @@
import React, { useRef } from 'react'; import React from 'react';
import { messageBlockWithContext } from '../UIKit/MessageBlock'; import { messageBlockWithContext } from '../UIKit/MessageBlock';
import { IMessageBlocks } from './interfaces'; import { IMessageBlocks } from './interfaces';
const Blocks = React.memo(({ blocks, id: mid, rid, blockAction }: IMessageBlocks) => { const Blocks = ({ blocks, id: mid, rid, blockAction }: IMessageBlocks) => {
if (blocks && blocks.length > 0) { if (blocks && blocks.length > 0) {
const appId = blocks[0]?.appId || ''; const appId = blocks[0]?.appId || '';
// eslint-disable-next-line react-hooks/rules-of-hooks return React.createElement(
const comp = useRef( messageBlockWithContext({
React.createElement( action: async ({ actionId, value, blockId }: { actionId: string; value: string; blockId: string }) => {
messageBlockWithContext({ if (blockAction) {
action: async ({ actionId, value, blockId }: { actionId: string; value: string; blockId: string }) => { await blockAction({
if (blockAction) { actionId,
await blockAction({ appId,
actionId, value,
appId, blockId,
value, rid,
blockId, mid
rid, });
mid }
}); },
} appId,
}, rid
appId, }),
rid { blocks }
}),
{ blocks }
)
); );
return comp.current;
} }
return null; return null;
}); };
Blocks.displayName = 'MessageBlocks'; Blocks.displayName = 'MessageBlocks';

View File

@ -1,6 +1,5 @@
import React from 'react'; import React from 'react';
import { Keyboard, ViewStyle } from 'react-native'; import { Keyboard, ViewStyle } from 'react-native';
import { Subscription } from 'rxjs';
import Message from './Message'; import Message from './Message';
import MessageContext from './Context'; import MessageContext from './Context';
@ -78,13 +77,16 @@ class MessageContainer extends React.Component<IMessageContainerProps, IMessageC
state = { isManualUnignored: false }; state = { isManualUnignored: false };
private subscription?: Subscription; private subscription?: Function;
componentDidMount() { componentDidMount() {
const { item } = this.props; const { item } = this.props;
if (item && item.observe) { // @ts-ignore
const observable = item.observe(); if (item && item.experimentalSubscribe) {
this.subscription = observable.subscribe(() => { // TODO: Update watermelonDB to recognize experimentalSubscribe at types
// experimentalSubscribe(subscriber: (isDeleted: boolean) => void, debugInfo?: any): Unsubscribe
// @ts-ignore
this.subscription = item.experimentalSubscribe(() => {
this.forceUpdate(); this.forceUpdate();
}); });
} }
@ -112,8 +114,8 @@ class MessageContainer extends React.Component<IMessageContainerProps, IMessageC
} }
componentWillUnmount() { componentWillUnmount() {
if (this.subscription && this.subscription.unsubscribe) { if (this.subscription) {
this.subscription.unsubscribe(); this.subscription();
} }
} }