verdnatura-mirror
/
verdnatura-chat
forked from verdnatura-mirror/Rocket.Chat.ReactNative
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[FIX] Action sheet cutting emojis on the header (#2263) 

* [FIX] Action sheet cutting emojis on the header

* fix tablet case

Co-authored-by: Djorkaeff Alexandre <djorkaeff.unb@gmail.com>
This commit is contained in:
Diego Mello 2020-07-08 17:45:13 -03:00
parent 3d987cc988
commit 118b1352c4
3 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/containers/ActionSheet/styles.js
View File

@ -29,7 +29,8 @@ export default StyleSheet.create({
},
handle: {
justifyContent: 'center',
alignItems: 'center'
alignItems: 'center',
paddingBottom: 8
},
handleIndicator: {
width: 40,

20
app/containers/MessageActions/Header.js
View File

@ -14,17 +14,20 @@ import { Button } from '../ActionSheet';
import { useDimensions } from '../../dimensions';
export const HEADER_HEIGHT = 36;
const ITEM_SIZE = 36;
const CONTAINER_MARGIN = 8;
const ITEM_MARGIN = 8;
const styles = StyleSheet.create({
container: {
alignItems: 'center',
marginHorizontal: 8
marginHorizontal: CONTAINER_MARGIN
},
headerItem: {
height: 36,
width: 36,
borderRadius: 20,
marginHorizontal: 8,
height: ITEM_SIZE,
width: ITEM_SIZE,
borderRadius: ITEM_SIZE / 2,
marginHorizontal: ITEM_MARGIN,
justifyContent: 'center',
alignItems: 'center'
},
@ -84,7 +87,7 @@ HeaderFooter.propTypes = {
};
const Header = React.memo(({
handleReaction, server, message, theme
handleReaction, server, message, isMasterDetail, theme
}) => {
const [items, setItems] = useState([]);
const { width, height } = useDimensions();
@ -96,8 +99,8 @@ const Header = React.memo(({
let freqEmojis = await freqEmojiCollection.query().fetch();
const isLandscape = width > height;
const size = isLandscape ? width / 2 : width;
const quantity = (size / 50) - 1;
const size = (isLandscape || isMasterDetail ? width / 2 : width) - (CONTAINER_MARGIN * 2);
const quantity = (size / (ITEM_SIZE + (ITEM_MARGIN * 2))) - 1;
freqEmojis = freqEmojis.concat(DEFAULT_EMOJIS).slice(0, quantity);
setItems(freqEmojis);
@ -135,6 +138,7 @@ Header.propTypes = {
handleReaction: PropTypes.func,
server: PropTypes.string,
message: PropTypes.object,
isMasterDetail: PropTypes.bool,
theme: PropTypes.string
};
export default withTheme(Header);

7
app/containers/MessageActions/index.js
View File

@ -32,7 +32,8 @@ const MessageActions = React.memo(forwardRef(({
Message_AllowEditing_BlockEditInMinutes,
Message_AllowPinning,
Message_AllowStarring,
Message_Read_Receipt_Store_Users
Message_Read_Receipt_Store_Users,
isMasterDetail
}, ref) => {
let permissions = {};
const { showActionSheet, hideActionSheet } = useActionSheet();
@ -377,6 +378,7 @@ const MessageActions = React.memo(forwardRef(({
<Header
server={server}
handleReaction={handleReaction}
isMasterDetail={isMasterDetail}
message={message}
/>
) : null)
@ -412,7 +414,8 @@ const mapStateToProps = state => ({
Message_AllowEditing_BlockEditInMinutes: state.settings.Message_AllowEditing_BlockEditInMinutes,
Message_AllowPinning: state.settings.Message_AllowPinning,
Message_AllowStarring: state.settings.Message_AllowStarring,
Message_Read_Receipt_Store_Users: state.settings.Message_Read_Receipt_Store_Users
Message_Read_Receipt_Store_Users: state.settings.Message_Read_Receipt_Store_Users,
isMasterDetail: state.app.isMasterDetail
});
export default connect(mapStateToProps, null, null, { forwardRef: true })(MessageActions);