From eb2a88ed5484ba0088ff7fb83e4ed0e5306f4d33 Mon Sep 17 00:00:00 2001 From: Frani Date: Mon, 24 Jun 2024 12:16:30 -0300 Subject: [PATCH 1/9] =?UTF-8?q?se=20agreg=C3=B3=20librer=C3=ADa=20de=20fir?= =?UTF-8?q?ebase=20y=20se=20implemento=20en=20el=20formulario=20con=20clav?= =?UTF-8?q?es=20locales?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 2 +- cors.json | 9 + package.json | 3 +- services/firebase.js | 19 + src/components/denuncia/Denuncia.jsx | 58 +- yarn.lock | 12257 ++++++++++++++++--------- 6 files changed, 7743 insertions(+), 4605 deletions(-) create mode 100644 cors.json create mode 100644 services/firebase.js diff --git a/.gitignore b/.gitignore index 5c1697f..fd27dde 100644 --- a/.gitignore +++ b/.gitignore @@ -23,4 +23,4 @@ dist-ssr *.sln *.sw? .env - +.yarn/install-state.gz \ No newline at end of file diff --git a/cors.json b/cors.json new file mode 100644 index 0000000..3ccf4d2 --- /dev/null +++ b/cors.json @@ -0,0 +1,9 @@ +[ + { + "origin": ["http://localhost:5173"], + "method": ["GET", "POST", "PUT", "DELETE"], + "maxAgeSeconds": 3600, + "responseHeader": ["Content-Type", "Authorization"] + } + ] + \ No newline at end of file diff --git a/package.json b/package.json index 7eb0030..a94e743 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "@react-email/render": "^0.0.12", "@vitejs/plugin-react-swc": "^3.6.0", "airtable": "^0.12.2", + "firebase": "^10.12.2", "maplibre-gl": "^3.5.2", "nodemailer": "^6.9.13", "prop-types": "^15.8.1", @@ -50,4 +51,4 @@ "resolutions": { "strip-ansi": "6.0.1" } -} \ No newline at end of file +} diff --git a/services/firebase.js b/services/firebase.js new file mode 100644 index 0000000..e9caa93 --- /dev/null +++ b/services/firebase.js @@ -0,0 +1,19 @@ +// firebase.js +import { initializeApp } from "firebase/app"; +import { getStorage, ref, uploadBytes, getDownloadURL } from "firebase/storage"; + +const firebaseConfig = { + apiKey: "AIzaSyB2zS1ALtmPtCuSPncnmFX3ddLqXi7duhE", + authDomain: "caba-prueba.firebaseapp.com", + projectId: "caba-prueba", + storageBucket: "caba-prueba.appspot.com", + messagingSenderId: "254186025395", + appId: "1:254186025395:web:0d7d9bce3e3a38582a9bc6", + measurementId: "G-CJSKDWH5ZC", +}; + +// Initialize Firebase +const app = initializeApp(firebaseConfig); +const storage = getStorage(app); + +export { storage, ref, uploadBytes, getDownloadURL }; diff --git a/src/components/denuncia/Denuncia.jsx b/src/components/denuncia/Denuncia.jsx index dc44bdb..989da61 100644 --- a/src/components/denuncia/Denuncia.jsx +++ b/src/components/denuncia/Denuncia.jsx @@ -2,6 +2,12 @@ import { useState } from "react"; import styles from "./Denuncia.module.css"; import Airtable from "airtable"; import constants from "../../../services/constants"; +import { + storage, + ref, + uploadBytes, + getDownloadURL, +} from "../../../services/firebase"; // Initialize Airtable base const base = new Airtable({ apiKey: constants.apiKey }).base(constants.baseId); @@ -14,7 +20,7 @@ const Denuncia = () => { const [agresor, setAgresor] = useState(""); const [identificacion, setIdentificacion] = useState(""); const [patente, setPatente] = useState(""); - const [archivos, setArchivos] = useState(null); // This needs to be handled + const [archivo, setArchivo] = useState(null); // Manejo de un solo archivo const [nombre, setNombre] = useState(""); const [telefono, setTelefono] = useState(""); const [email, setEmail] = useState(""); @@ -47,25 +53,32 @@ const Denuncia = () => { return; } - const recordData = { - Fecha: fecha, - Hora: hora, - Lugar: lugar, - Descripcion: descripcion, - Agresor: agresor, - Identificación: identificacion, - Patente: patente, - Archivos: archivos, // You need to handle file uploads correctly - Nombre: nombre, - Teléfono: telefono, - Email: email, - Visibilizar: visibilizar, - Denunciar_legalmente: denunciarLegalmente, - }; - try { - const response = await base("tblLbB2PWSaWbhWG0").create(recordData); - console.log("Record created successfully:", response); + let fileUrl = null; + if (archivo) { + const archivoRef = ref(storage, `archivos/${archivo.name}`); + const snapshot = await uploadBytes(archivoRef, archivo); + fileUrl = await getDownloadURL(snapshot.ref); + } + + const recordData = { + Fecha: fecha, + Hora: hora, + Lugar: lugar, + Descripcion: descripcion, + Agresor: agresor, + Identificación: identificacion, + Patente: patente, + Archivo: fileUrl, + Nombre: nombre, + Teléfono: telefono, + Email: email, + Visibilizar: visibilizar, + Denunciar_legalmente: denunciarLegalmente, + }; + + const response = await base("tblfETI1obwfYQg7N").create(recordData); + console.log("Registro creado con éxito:", response); alert("Denuncia enviada con éxito"); setFecha(""); setHora(""); @@ -74,7 +87,7 @@ const Denuncia = () => { setAgresor(""); setIdentificacion(""); setPatente(""); - setArchivos(null); + setArchivo(null); setNombre(""); setTelefono(""); setEmail(""); @@ -190,6 +203,9 @@ const Denuncia = () => { onChange={(e) => setEmail(e.target.value)} /> +

V. ARCHIVO ADJUNTO

+ setArchivo(e.target.files[0])} /> +

Marque las opciones deseadas