inProgress-team / react-native-meteor

Meteor Reactivity for your React Native application :)
MIT License
693 stars 210 forks source link

Error while trying to upload image from react-native #348

Open JulienKisoni opened 4 years ago

JulienKisoni commented 4 years ago

Hello, please help me. I have a serious problem, and i don't know how to fix that. I'm using react native (and expo) with react-native-meteor and I'm trying to upload an image to meteor (FSCollection) and i get this error [TypeError: (0, _Collection.default) is not a function. (In '(0, _Collection.default)(collectionName)', '(0, _Collection.default)' is undefined)]

here is my code on client (react-native)

import React, { Component } from "react";
import {  View } from "react-native";
import { Button, Text } from "native-base";
import * as ImagePicker from "expo-image-picker";
import Meteor, { withTracker } from "react-native-meteor";

class Profil extends Component {
  upload = async file => {
    try {
      if (this.props.imagesReady) {
        console.log("images ready", this.props.Images.find());
        this.props.Images.insert(file.uri, (err, fileObj) => {
          if (err) {
            console.log("error upload", err);
          } else {
            console.log("fileObj", fileObj);
          }
        });
      }
    } catch (e) {
      console.log("upload error catch", e);
    }
  };
  getImages = async () => {
    try {
      const options = {
        mediaTypes: ImagePicker.MediaTypeOptions.Images
      };
      const result = await ImagePicker.launchImageLibraryAsync(options);
      console.log("result", result);
      this.upload(result.uri);
    } catch (e) {
      console.log("error getImages", e);
    }
  };
  render() {
    return (
          <View>
            {this.props.imagesReady ? (
              <Button full onPress={this.getImages}>
                <Text>Get Images</Text>
              </Button>
            ) : null}
          </View>
    );
  }
}

export default Meteor.withTracker(params => {
  const handle = Meteor.subscribe("Images.all");
  return {
    imagesReady: handle.ready(),
    Images: Meteor.FSCollection("Images")
  };
})(Profil);

here is my code on meteor server :

import { Meteor } from "meteor/meteor";
import { FS } from "meteor/cfs:base-package";
import { GridFS } from "meteor/cfs:gridfs";

const imageStore = new FS.Store.GridFS("images", {
  mongoUrl: "xxxxxxxxxxxxxx" // < -- My mongoUrl here
});

export const Images = new FS.Collection("Images", {
  stores: [imageStore]
});

if (Meteor.isServer) {
  Meteor.publish("Images.all", function() {
    return Images.find();
  });
  Images.allow({
    insert: function() {
      // add custom authentication code here
      return true;
    },
    update: function() {
      return true;
    },
    download: function() {
      return true;
    }
  });
}
da314pc commented 4 years ago

@JulienKisoni Sorry the FSCollection is not supported.. Hopefully you can look and try to integrate Meteor Files https://github.com/inProgress-team/react-native-meteor/issues/118