chore: Migrate ReactionPicker room to ts
This commit is contained in:
parent
3c5d0f127c
commit
1849c295a2
|
@ -1,5 +1,4 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
|
||||||
import { View } from 'react-native';
|
import { View } from 'react-native';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import Modal from 'react-native-modal';
|
import Modal from 'react-native-modal';
|
||||||
|
@ -10,28 +9,30 @@ import { themes } from '../../constants/colors';
|
||||||
import { withTheme } from '../../theme';
|
import { withTheme } from '../../theme';
|
||||||
import styles from './styles';
|
import styles from './styles';
|
||||||
|
|
||||||
|
interface IRoomReactionPickerProps {
|
||||||
|
baseUrl: string;
|
||||||
|
message: {
|
||||||
|
id: string;
|
||||||
|
};
|
||||||
|
show: boolean;
|
||||||
|
isMasterDetail: boolean;
|
||||||
|
reactionClose(): void;
|
||||||
|
onEmojiSelected(shortname: string, messageId: string): void;
|
||||||
|
width: number;
|
||||||
|
height: number;
|
||||||
|
theme: string;
|
||||||
|
}
|
||||||
|
|
||||||
const margin = isAndroid ? 40 : 20;
|
const margin = isAndroid ? 40 : 20;
|
||||||
const maxSize = 400;
|
const maxSize = 400;
|
||||||
|
|
||||||
class ReactionPicker extends React.Component {
|
class ReactionPicker extends React.Component<IRoomReactionPickerProps, any> {
|
||||||
static propTypes = {
|
shouldComponentUpdate(nextProps: IRoomReactionPickerProps) {
|
||||||
baseUrl: PropTypes.string.isRequired,
|
|
||||||
message: PropTypes.object,
|
|
||||||
show: PropTypes.bool,
|
|
||||||
isMasterDetail: PropTypes.bool,
|
|
||||||
reactionClose: PropTypes.func,
|
|
||||||
onEmojiSelected: PropTypes.func,
|
|
||||||
width: PropTypes.number,
|
|
||||||
height: PropTypes.number,
|
|
||||||
theme: PropTypes.string
|
|
||||||
};
|
|
||||||
|
|
||||||
shouldComponentUpdate(nextProps) {
|
|
||||||
const { show, width, height } = this.props;
|
const { show, width, height } = this.props;
|
||||||
return nextProps.show !== show || width !== nextProps.width || height !== nextProps.height;
|
return nextProps.show !== show || width !== nextProps.width || height !== nextProps.height;
|
||||||
}
|
}
|
||||||
|
|
||||||
onEmojiSelected = (emoji, shortname) => {
|
onEmojiSelected = (emoji: string, shortname: string) => {
|
||||||
// standard emojis: `emoji` is unicode and `shortname` is :joy:
|
// standard emojis: `emoji` is unicode and `shortname` is :joy:
|
||||||
// custom emojis: only `emoji` is returned with shortname type (:joy:)
|
// custom emojis: only `emoji` is returned with shortname type (:joy:)
|
||||||
// to set reactions, we need shortname type
|
// to set reactions, we need shortname type
|
||||||
|
@ -68,18 +69,14 @@ class ReactionPicker extends React.Component {
|
||||||
}
|
}
|
||||||
]}
|
]}
|
||||||
testID='reaction-picker'>
|
testID='reaction-picker'>
|
||||||
<EmojiPicker
|
<EmojiPicker onEmojiSelected={this.onEmojiSelected} baseUrl={baseUrl} />
|
||||||
// tabEmojiStyle={tabEmojiStyle}
|
|
||||||
onEmojiSelected={this.onEmojiSelected}
|
|
||||||
baseUrl={baseUrl}
|
|
||||||
/>
|
|
||||||
</View>
|
</View>
|
||||||
</Modal>
|
</Modal>
|
||||||
) : null;
|
) : null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const mapStateToProps = state => ({
|
const mapStateToProps = (state: any) => ({
|
||||||
baseUrl: state.server.server,
|
baseUrl: state.server.server,
|
||||||
isMasterDetail: state.app.isMasterDetail
|
isMasterDetail: state.app.isMasterDetail
|
||||||
});
|
});
|
Loading…
Reference in New Issue