react-native#console JavaScript Examples

The following examples show how to use react-native#console. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.

Example #1

Source File: itineraryList.js From Baku with GNU General Public License v3.0

6 votes

export default function ItineraryList({uid}) {
  const postId = uid;
  const [itinerary, setItinerary] = React.useState([]);

  const db = Firebase.firestore();

  React.useEffect(() => {
    if (itinerary.length === 0) {
      db.collection('posts').doc(postId).get()
          .then((doc) => {
            setItinerary(doc.data().itinerary);
          })
          .catch((error) => {
            console.log('Error getting documents: ', error);
          });
    }
  });

  const getActivities = () => {
    if (itinerary !== undefined) {
      return Object.keys(itinerary).map(
          // eslint-disable-next-line react/jsx-key
          (key) => <ItineraryActivity time={key} activity={itinerary[key]} />);
    } else {
      return <Text>Loading...</Text>;
    }
  };

  return (
    <ScrollView contentContainerStyle={{flexGrow: 1, alignSelf: 'flex-start'}}>
      {getActivities()}
    </ScrollView>
  );
}

Example #2

Source File: createPostTab.js From Baku with GNU General Public License v3.0

4 votes

export default function CreatePost({navigation}) {
  const [refreshing, setRefreshing] = React.useState(false);
  const [cityx, setCity] = React.useState('');
  const [countryx, setCountry] = React.useState('');
  const [captionx, setCaption] = React.useState('');
  const [photosx, setPhotos] = React.useState(
      'https://drive.google.com/uc?id=1IlnqOsoEVi9ASVb0WihFRxtMu2z2BLT5'
  );


  async function pickImage() {
    try {
      const result = await ImagePicker.launchImageLibraryAsync({
        mediaTypes: ImagePicker.MediaTypeOptions.All,
        allowsEditing: true,
        aspect: [4, 3],
        quality: 1
      });
      if (!result.cancelled) {
        setPhotos(result.uri);
      }
    } catch (E) {
      console.log(E + 'image not found');
    }
  }

  const wait = (timeout) => {
    return new Promise((resolve) => {
      setTimeout(resolve, timeout);
    });
  };

  const onRefresh = React.useCallback(() => {
    setRefreshing(true);

    wait(2000).then(() => setRefreshing(false));
  }, [refreshing]);


  return (
    <View style={Styles.container}>
      <Header headerTitle="Create Post" />

      <ScrollView refreshControl={
        <RefreshControl refreshing={refreshing} onRefresh={onRefresh} />}
      style={Styles.container}>
        <TouchableOpacity
          style={{
            width: 200,
            height: 300,
            alignSelf: 'center',
            marginBottom: 10,
            marginTop: 10
          }}
          onPress={() => {
            pickImage();
          }}
        >
          <Image
            source={{uri: photosx}}
            style={{
              width: 200,
              height: 300,
              alignSelf: 'center',
              borderRadius: 2,
              borderWidth: 1,
              borderColor: 'black',
              marginBottom: 10,
              marginTop: 10
            }}
            testID='create-photo'
          />
        </TouchableOpacity>
        <View style={Styles.p_3}>
          <Fumi
            label={'City'}
            onChangeText={setCity}
            iconClass={FontAwesomeIcon}
            iconName={'map-pin'}
            iconColor={Colors.warning}
            iconSize={18}
            iconWidth={40}
            inputPadding={16}
            inputStyle={{padding: 5}}
            testID='create-city'
          />
        </View>

        <View style={Styles.p_3}>
          <Fumi
            label={'Country'}
            onChangeText={setCountry}
            iconClass={FontAwesomeIcon}
            iconName={'globe'}
            iconColor={Colors.warning}
            iconSize={18}
            iconWidth={40}
            inputPadding={16}
            inputStyle={{padding: 5}}
            testID='create-country'
          />
        </View>

        <View style={Styles.p_3}>
          <Fumi
            label={'Caption'}
            onChangeText={setCaption}
            iconClass={FontAwesomeIcon}
            iconName={'indent'}
            iconColor={Colors.warning}
            iconSize={18}
            iconWidth={40}
            inputPadding={16}
            inputStyle={{padding: 5}}
            testID='create-caption'
          />
        </View>

        <View style={Styles.card}>
          <AwesomeButton
            backgroundColor={'#ffbc26'}
            width={340}
            height={40}
            onPress={() => {
              navigation.navigate('Preview Post Screen', {
                captionx: captionx,
                photosx: photosx,
                cityx: cityx,
                countryx: countryx
              });
            }}
          >
            Preview
          </AwesomeButton>
        </View>
      </ScrollView>
    </View>
  );
}