fix(menu): fix menu visibility based on props

[BogiKay]

Motivation

PR simplify and fix updateVisibility function in Menu component.

Related issue

#4631

Test plan

• Menu component should work as before
• Example mentioned in the issue Menu is being hidden despite visibility being set to {true} #4631 is resolved

I tested changes using slightly changed example from the issue, which I'm attaching below and it's working fine

const ReproExample: React.FC<{ navigation: any }> = ({ navigation }) => {
  const [menuVisible, setMenuVisible] = useState(false);
  const [textValue, setTextValue] = useState('');
  const data = ['first', 'second', 'third'];

  useEffect(() => {
    console.log(menuVisible);
  }, [menuVisible]);

  return (
    <View>
      <Menu
        visible={menuVisible}
        onDismiss={() => setMenuVisible(false)}
        anchorPosition="bottom"
        children={getMenuItems(data)}
        anchor={
          <TextInput
            value={textValue}
            onChangeText={(newText: string) => {
              setTextValue(newText);
              if (menuVisible === true && newText === '') {
                setMenuVisible(false);
              } else if (menuVisible === false) {
                setMenuVisible(true);
              }
            }}
            onSubmitEditing={() => setMenuVisible(false)}
            autoComplete="address-line1"
            mode="outlined"
          ></TextInput>
        }
      ></Menu>
    </View>
  );
};

function getMenuItems(data: string[]): React.JSX.Element {
  return (
    <>
      {data.map((thing) => (
        <Menu.Item key={thing} title={thing}></Menu.Item>
      ))}
    </>
  );
}

[callstack-bot]

Hey @BogiKay, thank you for your pull request 🤗. The documentation from this branch can be viewed here.

[gpurbia]

When do you plan to merge this and release it?

[mamtajuddinIncapsulate]

Looks good lets merge