clouflare-r2-file-upload/dist/App.js

A React component for uploading files to Cloudflare R2

// src/App.tsx
import React, { useState } from "react";
import FileUpload from "./components/FileUpload";
const App = () => {
    const [formData, setFormData] = useState({
        imageUrl: [],
    });
    const handleFormSubmit = (event) => {
        event.preventDefault();
        // Aquí podrías hacer una llamada a tu API para guardar la URL en la base de datos
        console.log("Form submitted with image URL:", formData.imageUrl);
    };
    const handleInputChange = (urls) => {
        setFormData({ ...formData, imageUrl: urls });
    };
    return (React.createElement("div", { className: "h-[100vh] w-full bg-white flex pl-20 bg-gray-400" },
        React.createElement("div", { className: "w-40 h-40 bg-red-500" },
            React.createElement(FileUpload, { classname: "w-fit h-36", handleInputChange: handleInputChange, title: "Upload to Cloudflare R2 multiple", subtitle: "Sub\u00EDtelo aqu\u00ED", choseTitle: "Attach File", style: "logo_box", changeImageName: true, IMG_DOMAIN: "https://hub.nexosync.xyz", BUCKET_NAME: "hub", REGION: import.meta.env.VITE_AWS_REGION, ACCESS_KEY_ID: import.meta.env.VITE_AWS_ACCESS_KEY_ID, SECRET_ACCESS_KEY: import.meta.env.VITE_AWS_SECRET_ACCESS_KEY, ENDPOINT: "https://b6d780b331caff85a50ddf58597c598b.eu.r2.cloudflarestorage.com", default_img: "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQoKQ39hic_XQKjeABQt0BUyY6A2K2qA10m5mMX4DpWYtSCf0Vf-oQJkbsMkhVIcrVl2bg&usqp=CAU", acceptFileTypesText: "IMAGES, PDF, DOC, TXT, DOCX no mas de 10MB", message: "Arrastra aca lo que deseas enviar", type: "multiple", acceptedFileTypes: [
                    "image/*",
                    // "application/pdf",
                    // ".doc",
                    // ".txt",
                    // ".docx",
                ] })),
        JSON.stringify(formData.imageUrl),
        React.createElement("form", { onSubmit: handleFormSubmit, className: "bg-red-500" },
            React.createElement("input", { type: "text", name: "imageUrl", 
                // value={formData.imageUrl}
                // onChange={handleInputChange}
                placeholder: "Image URL", style: { width: "100%", marginTop: "10px" } }),
            React.createElement("button", { type: "submit" }, "Submit"))));
};
export default App;
//# sourceMappingURL=App.js.map