mattermost-mobile/app/components/post_draft/uploads/upload_item/upload_remove.js
Daniel Espino García 4c8594d330
Add linter rules for import order and type member delimiters (#5514)
* Add linter rules for import order and type member delimiters

* Remove unneeded group

* Group all app/* imports before the internal imports

* Move app/ imports before parent imports

* Separate @node_modules imports into a different group

* Substitute app paths by aliases

* Fix @node_modules import order and add test related modules

* Add aliases for types and test, and group import types
2021-07-23 11:06:04 +02:00

71 lines
2.1 KiB
JavaScript

// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import PropTypes from 'prop-types';
import React, {PureComponent} from 'react';
import {View, Platform} from 'react-native';
import CompassIcon from '@components/compass_icon';
import TouchableWithFeedback from '@components/touchable_with_feedback';
import {makeStyleSheetFromTheme, changeOpacity} from '@utils/theme';
export default class UploadRemove extends PureComponent {
static propTypes = {
channelId: PropTypes.string,
clientId: PropTypes.string,
onPress: PropTypes.func.isRequired,
rootId: PropTypes.string,
theme: PropTypes.object.isRequired,
};
handleOnPress = () => {
const {channelId, clientId, onPress, rootId} = this.props;
onPress(clientId, channelId, rootId);
};
render() {
const {theme} = this.props;
const style = getStyleSheet(theme);
return (
<TouchableWithFeedback
style={style.tappableContainer}
onPress={this.handleOnPress}
type={'opacity'}
>
<View style={style.removeButton}>
<CompassIcon
name='close-circle'
color={changeOpacity(theme.centerChannelColor, 0.64)}
size={24}
style={style.removeIcon}
/>
</View>
</TouchableWithFeedback>
);
}
}
const getStyleSheet = makeStyleSheetFromTheme((theme) => {
return {
tappableContainer: {
position: 'absolute',
elevation: 11,
top: -7,
right: -8,
width: 24,
height: 24,
},
removeButton: {
borderRadius: 12,
alignSelf: 'center',
marginTop: Platform.select({
ios: 5.4,
android: 4.75,
}),
backgroundColor: theme.centerChannelBg,
width: 24,
height: 25,
},
};
});