Page MenuHomePhorge
Files F32563849

D9309.1767360169.diff
No OneTemporary
Actions

Size
2 KB
Referenced Files
None
Subscribers
None

D9309.1767360169.diff
View Options

diff --git a/native/components/relationship-button.react.js b/native/components/relationship-button.react.js
new file mode 100644
--- /dev/null
+++ b/native/components/relationship-button.react.js
@@ -0,0 +1,94 @@
+// @flow
+
+import Icon from '@expo/vector-icons/FontAwesome5.js';
+import * as React from 'react';
+import { Text } from 'react-native';
+
+import Button from './button.react.js';
+import { useStyles, useColors } from '../themes/colors.js';
+
+type RelationshipButtonType =
+ | 'add'
+ | 'withdraw'
+ | 'accept'
+ | 'reject'
+ | 'block'
+ | 'unblock';
+
+type Props = {
+ +type: RelationshipButtonType,
+ +onPress: () => mixed,
+};
+
+function RelationshipButton(props: Props): React.Node {
+ const { type, onPress } = props;
+
+ const styles = useStyles(unboundStyles);
+ const colors = useColors();
+
+ const buttonStyle = React.useMemo(() => {
+ const result = [styles.buttonContainer];
+
+ if (type === 'add' || type === 'accept' || type === 'unblock') {
+ result.push(styles.greenButton);
+ } else {
+ result.push(styles.redButton);
+ }
+
+ return result;
+ }, [styles.buttonContainer, styles.greenButton, styles.redButton, type]);
+
+ let buttonText = 'Add Friend';
+ let icon = 'user-plus';
+ if (type === 'withdraw') {
+ buttonText = 'Withdraw Friend Request';
+ icon = 'user-minus';
+ } else if (type === 'accept') {
+ buttonText = 'Accept';
+ } else if (type === 'reject') {
+ buttonText = 'Reject';
+ icon = 'user-minus';
+ } else if (type === 'block') {
+ buttonText = 'Block User';
+ icon = 'user-shield';
+ } else if (type === 'unblock') {
+ buttonText = 'Unblock User';
+ icon = 'user-shield';
+ }
+
+ return (
+ <Button style={buttonStyle} onPress={onPress}>
+ <Icon
+ name={icon}
+ size={22}
+ color={colors.floatingButtonLabel}
+ style={styles.buttonIcon}
+ />
+ <Text style={styles.buttonText}>{buttonText}</Text>
+ </Button>
+ );
+}
+
+const unboundStyles = {
+ buttonContainer: {
+ flexDirection: 'row',
+ justifyContent: 'center',
+ alignItems: 'center',
+ paddingVertical: 8,
+ borderRadius: 8,
+ },
+ buttonIcon: {
+ paddingRight: 8,
+ },
+ buttonText: {
+ color: 'floatingButtonLabel',
+ },
+ greenButton: {
+ backgroundColor: 'vibrantGreenButton',
+ },
+ redButton: {
+ backgroundColor: 'vibrantRedButton',
+ },
+};
+
+export default RelationshipButton;

File Metadata

Mime Type
text/plain
Expires
Fri, Jan 2, 1:22 PM (9 h, 49 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5879738
Default Alt Text
D9309.1767360169.diff (2 KB)

Event Timeline