yoavniran

const styles = StyleSheet.create({
  uploadedImage: {
    width: 400,
    height: 400,
    resizeMode: 'cover',
  },
  body: {
    backgroundColor: "#ffffff",
  },
  sectionContainer: {

yoavniran

const Upload = () => {
  const [uploadUrl, setUploadUrl] = useState(false);
  const uploadyContext = useContext(UploadyContext);

  useItemFinishListener((item) => {
    const response = JSON.parse(item.uploadResponse.data);
    console.log(`item ${item.id} finished uploading, response was: `, response);
    setUploadUrl(response.url);
  });

yoavniran

import React, { useState, useCallback, useContext } from "react";
import { SafeAreaView, StyleSheet, ScrollView, View, Text, StatusBar, Button, ImageBackground, Image } from "react-native";

import DocumentPicker from "react-native-document-picker/index";

import NativeUploady, {
  UploadyContext,
  useItemFinishListener,
  useItemStartListener,
  useItemErrorListener,

yoavniran

import ReactCrop from "react-image-crop";
import { withRequestPreSendUpdate, useItemFinalizeListener } from "@rpldy/uploady";
import { PREVIEW_TYPES } from "@rpldy/upload-preview";
import cropImage from "./image-crop-helper";

const ItemPreviewWithCrop = withRequestPreSendUpdate(props => {
  const { id, url, isFallback, type, updateRequest, requestData, previewMethods } = props;
  const [finished, setFinished] = useState(false);
  const [crop, setCrop] = useState(null);

yoavniran

import Uploady from "@rpldy/uploady";
import UploadButton from "@rpldy/upload-button";
import UploadPreview from "@rpldy/upload-preview";

export default function UploadWithCrop() {
  const previewMethodsRef = useRef();

  return (
    <Uploady
      destination={{ url: "[upload-url]" }}

yoavniran

import UploadButton from "@rpldy/upload-button";
import UploadPreview from "@rpldy/upload-preview";
import CustomImagePreview from "./CustomImagePreview";

const UploadWithProgressPreview = () => {
  const getPreviewProps = useCallback(item => ({ id: item.id }), []);

  return (
    <>
      <UploadButton>Upload Files</UploadButton>

yoavniran

import styled from "styled-components"
import { useItemProgressListener } from "@rpldy/uploady";

const PreviewImage = styled.img`
  margin: 5px;
  max-width: 200px;
  height: auto;
  transition: opacity 0.4s;

  ${({ completed }) => `opacity: ${completed / 100};`}

yoavniran

import Uploady from "@rpldy/uploady";
import UploadWithProgressPreview from "./UploadWithProgressPreview";

const App = > () {
  return (
    <Uploady
      destination={{ url: "[upload-url]" }}
    >
      <div className="App">
        <h1>Hello React Uploady</h1>

yoavniran

import Uploady from "@rpldy/uploady";

const App = > () {
  return (
    <Uploady
      destination={{ url: "[upload-url]" }}
    >
      <div className="App">
        <h1>Hello React Uploady</h1>
        <UploadWithProgressPreview />

yoavniran

import React from "react";
import Uploady from "@rpldy/uploady";
import UploadButton from  "@rpldy/upload-button";

const MyApp = () => (
	<Uploady destination={{url: "https://my-server.com/upload"}}>
		<UploadButton/>
	</Uploady>
);