mattermost-mobile/app/components/custom_status/clear_button.tsx
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

59 lines
1.5 KiB
TypeScript

// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
import {TouchableOpacity} from 'react-native';
import CompassIcon from '@components/compass_icon';
import {Theme} from '@mm-redux/types/preferences';
import {preventDoubleTap} from '@utils/tap';
import {changeOpacity, makeStyleSheetFromTheme} from '@utils/theme';
interface Props {
handlePress: () => void;
size?: number;
containerSize?: number;
theme: Theme;
testID?: string;
iconName: string;
}
const ClearButton = ({handlePress, iconName, size, containerSize, theme, testID}: Props) => {
const style = getStyleSheet(theme);
return (
<TouchableOpacity
onPress={preventDoubleTap(handlePress)}
style={[style.container, {height: containerSize, width: containerSize}]}
testID={testID}
>
<CompassIcon
name={iconName}
size={size}
style={style.button}
/>
</TouchableOpacity>
);
};
ClearButton.defaultProps = {
size: 20,
containerSize: 40,
iconName: 'close-circle',
};
export default ClearButton;
const getStyleSheet = makeStyleSheetFromTheme((theme: Theme) => {
return {
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
button: {
borderRadius: 1000,
color: changeOpacity(theme.centerChannelColor, 0.52),
},
};
});