Better generic radio button, Use button in cell

2 files changed, 12 insertions, 11 deletions

diff --git a/src/components/common/TaggRadioButton.tsx b/src/components/common/TaggRadioButton.tsx
index bd48bd5c..fc4008e5 100644
--- a/src/components/common/TaggRadioButton.tsx
+++ b/src/components/common/TaggRadioButton.tsx
@@ -3,12 +3,10 @@ import {StyleSheet, TouchableOpacity, View} from 'react-native';
 
 interface TaggRadioButtonProps {
   pressed: boolean;
-  setPressed: Function;
   onPress: Function;
 }
 const TaggRadioButton: React.FC<TaggRadioButtonProps> = ({
   pressed,
-  setPressed,
   onPress,
 }) => {
   const activeOuterStyle = {
@@ -22,7 +20,6 @@ const TaggRadioButton: React.FC<TaggRadioButtonProps> = ({
     <TouchableOpacity
       style={[styles.outer, activeOuterStyle]}
       onPress={() => {
-        setPressed(!pressed);
         onPress();
       }}>
       {pressed && <View style={[styles.inner, activeInnerStyle]} />}
diff --git a/src/components/common/TaggUserSelectionCell.tsx b/src/components/common/TaggUserSelectionCell.tsx
index 88382119..a8564ddf 100644
--- a/src/components/common/TaggUserSelectionCell.tsx
+++ b/src/components/common/TaggUserSelectionCell.tsx
@@ -1,4 +1,4 @@
-import React, {useState} from 'react';
+import React, {useEffect, useState} from 'react';
 import {StyleSheet, View} from 'react-native';
 import {ProfilePreview} from '..';
 import {ProfilePreviewType, ScreenType} from '../../types';
@@ -17,11 +17,20 @@ const TaggUserSelectionCell: React.FC<TaggUserSelectionCellProps> = ({
 }) => {
   const [pressed, setPressed] = useState<boolean>(false);
 
+  useEffect(() => {
+    const updatePressed = () => {
+      const userSelected = selectedUsers.findIndex(
+        (selectedUser) => item.id === selectedUser.id,
+      );
+      setPressed(userSelected !== -1);
+    };
+    updatePressed();
+  });
+
   const handlePress = () => {
     // Add to selected list pf users
     if (pressed === false) {
       setSelectedUsers([...selectedUsers, item]);
-      setPressed(true);
     }
     // Remove item from selected list of users
     else {
@@ -29,7 +38,6 @@ const TaggUserSelectionCell: React.FC<TaggUserSelectionCellProps> = ({
         (user) => user.id !== item.id,
       );
       setSelectedUsers(filteredSelection);
-      setPressed(false);
     }
   };
   return (
@@ -41,11 +49,7 @@ const TaggUserSelectionCell: React.FC<TaggUserSelectionCellProps> = ({
           screenType={ScreenType.Profile}
         />
       </View>
-      <TaggRadioButton
-        pressed={pressed}
-        setPressed={setPressed}
-        onPress={handlePress}
-      />
+      <TaggRadioButton pressed={pressed} onPress={handlePress} />
     </View>
   );
 };