(React Native) Изображения, загруженные в Firebase, видны только на том устройстве, с которого они были загружены

Question

Я создаю приложение, в которое пользователи могут загружать изображения (и информацию о них), и все пользователи могут видеть эти изображения и информацию о них в ленте. Теперь, когда я протестировал приложение на двух устройствах, я обнаружил, что изображения видны только в ленте на устройстве, с которого они были загружены - поэтому люди не могут видеть изображения друг друга. Вся остальная информация в базе данных (Firebase Realtime Database) видна в ленте всем пользователям, но не изображениям.

Может кто-нибудь помочь мне исправить мой код, чтобы каждый мог видеть изображения, загруженные с любого устройства ? Вот мой код:

import React from 'react';
import { Button, Image, View, Text, TouchableHighlight, StyleSheet, TextInput, Alert, ScrollView } from 'react-native';
import * as ImagePicker from 'expo-image-picker';
import Constants from 'expo-constants';
import { Ionicons } from '@expo/vector-icons';
import StarRating from 'react-native-star-rating';
import * as Permissions from 'expo-permissions';
import '@firebase/firestore';
import { db } from '../config';

export default class UploadPost extends React.Component {
  state = {
    Title: '',
    Restaurant: '',
    Dish: '',
    Image: null,
    Stars: 0,
    Comment: '',
  };
  onChangeTitle = Title => {
    this.setState({ Title });
  };
  onChangeRestaurant = Restaurant => {
    this.setState({ Restaurant });
  };
  onChangeDish = Dish => {
    this.setState({ Dish });
  };
  onStarRatingPress(rating) {
    this.setState({
      Stars: rating
    });
  }
  onChangeComment = Comment => {
    this.setState({ Comment });
  };

  handleSubmit = () => {
    db.ref('/Posts').push({Title: this.state.Title, Restaurant: this.state.Restaurant, Dish: this.state.Dish, Image: this.state.image, Stars: this.state.Stars, Comment: this.state.Comment});
    Alert.alert('Post saved successfully');
    console.log(this.state);
  };

  render() {
    let { image } = this.state;
    return (
      <ScrollView style={styles.container}>
        <Text style={styles.title}>Title</Text>
        <TextInput style={styles.itemInput} value={this.state.Title} onChangeText={Title => this.onChangeTitle(Title)} />
        <Text style={styles.title}>Restaurant</Text>
        <TextInput style={styles.itemInput} value={this.state.Restaurant} onChangeText={Restaurant => this.onChangeRestaurant(Restaurant)} />
        <Text style={styles.title}>Dish</Text>
        <TextInput style={styles.itemInput} value={this.state.Dish} onChangeText={Dish => this.onChangeDish(Dish)} />
        <Text style={styles.title}>Image</Text>
        {image && <Image source={{ uri: image }} style={{ width: 300, height: 300, alignSelf: 'center', paddingBottom: 10 }} />}
        <Ionicons name="ios-add-circle" color= '#32CD32' size= '50' style={{ textAlign: 'center'}} onPress={this._pickImage} />
        <Text style={styles.title}>Rating</Text>
        <StarRating
        disabled={false}
        maxStars={5}
        fullStarColor={'#32CD32'}
        rating={this.state.Stars}
        selectedStar={(rating) => this.onStarRatingPress(rating)}
      />
        <Text style={styles.title}>Comments</Text>
        <TextInput style={styles.itemInput} value={this.state.Comment} onChangeText={Comment => this.onChangeComment(Comment)} />
        <TouchableHighlight
          style={styles.button}
          underlayColor="white"
          onPress={this.handleSubmit}
        >
        <Text style={styles.buttonText}>Upload</Text>
        </TouchableHighlight>
      </ScrollView>
    );
  }
  componentDidMount() {
    this.getPermissionAsync();
  }

  getPermissionAsync = async () => {
    if (Constants.platform.ios) {
      const { status } = await Permissions.askAsync(Permissions.CAMERA_ROLL);
      if (status !== 'granted') {
        alert('Sorry, you must grant camera roll permissions in order to do this.');
      }
    }
  };

  _pickImage = async () => {
    try {
      let result = await ImagePicker.launchImageLibraryAsync({
        mediaTypes: ImagePicker.MediaTypeOptions.Images,
        allowsEditing: true,
        aspect: [3, 3],
        quality: 1,
      });
      if (!result.cancelled) {
        this.setState({ image: result.uri });
      }

      console.log(result);
    } catch (E) {
      console.log(E);
    }
  };
}

Вот правила базы данных:

{ "rules": { ".read": true, ".write": true } }

А вот образец данных, хранящихся в базе данных

Все поля в базе данных видны на всех устройствах, кроме изображения.

Буду очень признателен за помощь, спасибо