Skip to content

A
APP-Guardar-Links
Commit 5b5b770d authored by Sonia Vidal Gonzalez's avatar Sonia Vidal Gonzalez
Browse files
Options

Ultimos cambios.

parent 1d7838bf
Pipeline #5456 failed with stages
      in 6 seconds
      Hide whitespace changes
      Inline Side-by-side
      Showing with 88 additions and 26 deletions
      .eslintcache
      View file @ 5b5b770d
      [{"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/index.tsx":"1","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/reportWebVitals.ts":"2","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/application.tsx":"3","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/firebase.ts":"4","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/logging.ts":"5","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/routes.ts":"6","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/config.ts":"7","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/AuthRoute/index.tsx":"8","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/change.tsx":"9","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/home.tsx":"10","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/forgot.tsx":"11","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/login.tsx":"12","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/logout.tsx":"13","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/register.tsx":"14","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/reset.tsx":"15","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/modules/index.ts":"16","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/ErrorText/index.tsx":"17","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/AuthContainer/index.tsx":"18","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/Links.js":"19","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/LinkForm.js":"20","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/interfaces/page.ts":"21"},{"size":650,"mtime":1629456727455,"results":"22","hashOfConfig":"23"},{"size":425,"mtime":1611457232000,"results":"24","hashOfConfig":"23"},{"size":1823,"mtime":1628682999747,"results":"25","hashOfConfig":"23"},{"size":943,"mtime":1630917387676,"results":"26","hashOfConfig":"23"},{"size":1066,"mtime":1611457232000,"results":"27","hashOfConfig":"23"},{"size":1593,"mtime":1628680826193,"results":"28","hashOfConfig":"23"},{"size":376,"mtime":1628591301903,"results":"29","hashOfConfig":"23"},{"size":963,"mtime":1628682883714,"results":"30","hashOfConfig":"23"},{"size":3302,"mtime":1628754426858,"results":"31","hashOfConfig":"23"},{"size":1155,"mtime":1630916990800,"results":"32","hashOfConfig":"23"},{"size":2187,"mtime":1611457232000,"results":"33","hashOfConfig":"23"},{"size":4294,"mtime":1628681888281,"results":"34","hashOfConfig":"23"},{"size":1011,"mtime":1611457232000,"results":"35","hashOfConfig":"23"},{"size":5281,"mtime":1628680258658,"results":"36","hashOfConfig":"23"},{"size":4786,"mtime":1611457232000,"results":"37","hashOfConfig":"23"},{"size":359,"mtime":1611457232000,"results":"38","hashOfConfig":"23"},{"size":705,"mtime":1628680585271,"results":"39","hashOfConfig":"23"},{"size":1003,"mtime":1628596480309,"results":"40","hashOfConfig":"23"},{"size":3900,"mtime":1630917091697,"results":"41","hashOfConfig":"23"},{"size":3768,"mtime":1630916977752,"results":"42","hashOfConfig":"23"},{"size":57,"mtime":1629459788939,"results":"43","hashOfConfig":"23"},{"filePath":"44","messages":"45","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},"74vu3w",{"filePath":"47","messages":"48","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"49","messages":"50","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"51","messages":"52","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"53","messages":"54","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"55","messages":"56","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"57","messages":"58","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"59","messages":"60","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"61","messages":"62","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"63","messages":"64","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"65","messages":"66","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"67","messages":"68","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"69","messages":"70","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"71","messages":"72","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"73","messages":"74","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"75","messages":"76","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"77","messages":"78","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"79","messages":"80","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},{"filePath":"81","messages":"82","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"83","messages":"84","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"85","usedDeprecatedRules":"86"},{"filePath":"87","messages":"88","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"46"},"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/index.tsx",[],["89","90"],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/reportWebVitals.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/application.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/firebase.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/logging.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/routes.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/config.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/AuthRoute/index.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/change.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/home.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/forgot.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/login.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/logout.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/register.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/reset.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/modules/index.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/ErrorText/index.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/AuthContainer/index.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/Links.js",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/LinkForm.js",["91"],"import React, {useState, useEffect} from 'react';\nimport Firebase from \"../../config/firebase\";\n//import IPageProps from '../../interfaces/page';\n\n//Importamos toast para mensajes dinamicos (instalamos librería => npm install --save react-toastify)\nimport { toast } from \"react-toastify\";\n\nconst LinkForm = (props) =>{\n\n //Constantes iniciales \n const initialStateValues = {\n url:\"\",\n name:\"\",\n description:\"\",\n }\n //Creamos el useState con su estado inicial y su cambio posterior:\n const [values, setValues ] = useState(initialStateValues);\n\n //Funcion que maneja el cambio de cada input setea las initialStateValues: la propiedad e.target de cada onchange={} de los input\n const handleInputChange = e =>{\n const {name, value} = e.target;\n setValues({...values, [name]: value });\n } \n\n //Para validar la URL por ejemplo: Buscar en google => validate url regex javascript\n const validURL = (str) => {\n var pattern = new RegExp(\n \"^(https?:\\\\/\\\\/)?\" + // protocol\n \"((([a-z\\\\d]([a-z\\\\d-]*[a-z\\\\d])*)\\\\.)+[a-z]{2,}|\" + // domain name\n \"((\\\\d{1,3}\\\\.){3}\\\\d{1,3}))\" + // OR ip (v4) address\n \"(\\\\:\\\\d+)?(\\\\/[-a-z\\\\d%_.~+]*)*\" + // port and path\n \"(\\\\?[;&a-z\\\\d%_.~+=-]*)?\" + // query string\n \"(\\\\#[-a-z\\\\d_]*)?$\",\n \"i\"\n ); // fragment locator\n return !!pattern.test(str);\n};\n \n\n\n //Evento que escucha al enviar el formulario, simplemente para ver que en consola esta funcionando:\n const handleSubmit = e => {\n e.preventDefault();\n\n //Utilizamos el validador de de la URL para que la gente ponga bien la URL:\n if (!validURL(values.url)) {\n return toast(\"invalid url\", { \n type: \"warning\", // warning => Color amarillo\n autoClose: 1000 // Duración un segundo\n });\n \n }\n\n // Le pasamos las props al addOrEditLink que esta en el component Links y este lo guardara en la base de datos (FIN DEL ASUNTO....)\n props.addOrEditLink(values);\n\n //Una vez guardados los datos procedemos a setearlos y de esta manera dejamos limpios los intput:\n setValues({...initialStateValues})\n }\n\n const getLinkById = async (id) => {\n const doc = await Firebase.collection(\"links\").doc(id).get();\n setValues({ ...doc.data() });\n };\n \n\n useEffect(() => {\n if (props.currentId === \"\") {\n setValues({ ...initialStateValues });\n } else {\n getLinkById(props.currentId);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [props.currentId]);\n\n return(\n <form onSubmit={handleSubmit} className=\"card card-body border-primary\">\n <div className=\"form-group input-group\">\n <div className=\"input-group-text bg-light\">\n <i className=\"material-icons\">insert_link</i>\n </div>\n <input style={{ color: \"white\" }} type=\"text\" className=\"form-control\" placeholder=\"https://someurl.xyz\" value={values.url} name=\"url\" onChange={handleInputChange}/>\n </div>\n <br/>\n <div className=\"form-group input-group\">\n <div className=\"input-group-text bg-light\">\n <i className=\"material-icons\">create</i>\n </div>\n <input style={{ color: \"white\" }} type=\"text\" value={values.name} name=\"name\" placeholder=\"Website Name\" className=\"form-control\" onChange={handleInputChange}/>\n </div>\n <br/>\n <div className=\"form-group\">\n <textarea style={{ color: \"white\" }} rows=\"3\" className=\"form-control\" placeholder=\"Write a Description\" name=\"description\" value={values.description} onChange={handleInputChange}/>\n </div>\n <br/>\n <button className=\"btn btn-primary btn-block\">\n {props.currentId === \"\" ? \"Save\" : \"Update\"}\n </button>\n </form>\n )\n}\n\nexport default LinkForm;\n",["92","93"],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/interfaces/page.ts",[],{"ruleId":"94","replacedBy":"95"},{"ruleId":"96","replacedBy":"97"},{"ruleId":"98","severity":1,"message":"99","line":3,"column":8,"nodeType":"100","messageId":"101","endLine":3,"endColumn":18},{"ruleId":"94","replacedBy":"95"},{"ruleId":"96","replacedBy":"97"},"no-native-reassign",["102"],"no-negated-in-lhs",["103"],"no-unused-vars","'IPageProps' is defined but never used.","Identifier","unusedVar","no-global-assign","no-unsafe-negation"] [{"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/index.tsx":"1","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/reportWebVitals.ts":"2","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/application.tsx":"3","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/firebase.ts":"4","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/logging.ts":"5","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/routes.ts":"6","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/config.ts":"7","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/AuthRoute/index.tsx":"8","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/change.tsx":"9","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/home.tsx":"10","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/forgot.tsx":"11","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/login.tsx":"12","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/logout.tsx":"13","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/register.tsx":"14","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/reset.tsx":"15","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/modules/index.ts":"16","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/ErrorText/index.tsx":"17","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/AuthContainer/index.tsx":"18","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/interfaces/page.ts":"19","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/firestore.ts":"20","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/LinkForm.tsx":"21","/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/Links.tsx":"22"},{"size":705,"mtime":1630920263389,"results":"23","hashOfConfig":"24"},{"size":425,"mtime":1611457232000,"results":"25","hashOfConfig":"24"},{"size":1927,"mtime":1630923614078,"results":"26","hashOfConfig":"24"},{"size":986,"mtime":1630924304524,"results":"27","hashOfConfig":"24"},{"size":1066,"mtime":1611457232000,"results":"28","hashOfConfig":"24"},{"size":1957,"mtime":1631002464401,"results":"29","hashOfConfig":"24"},{"size":424,"mtime":1630929883528,"results":"30","hashOfConfig":"24"},{"size":963,"mtime":1628682883714,"results":"31","hashOfConfig":"24"},{"size":3302,"mtime":1628754426858,"results":"32","hashOfConfig":"24"},{"size":1449,"mtime":1631092380416,"results":"33","hashOfConfig":"24"},{"size":2187,"mtime":1611457232000,"results":"34","hashOfConfig":"24"},{"size":4388,"mtime":1630920416798,"results":"35","hashOfConfig":"24"},{"size":1011,"mtime":1611457232000,"results":"36","hashOfConfig":"24"},{"size":5406,"mtime":1630920455722,"results":"37","hashOfConfig":"24"},{"size":4786,"mtime":1611457232000,"results":"38","hashOfConfig":"24"},{"size":359,"mtime":1611457232000,"results":"39","hashOfConfig":"24"},{"size":705,"mtime":1628680585271,"results":"40","hashOfConfig":"24"},{"size":1003,"mtime":1630929056658,"results":"41","hashOfConfig":"24"},{"size":57,"mtime":1629459788939,"results":"42","hashOfConfig":"24"},{"size":185,"mtime":1631036151858,"results":"43","hashOfConfig":"24"},{"size":4541,"mtime":1631092180110,"results":"44","hashOfConfig":"24"},{"size":4050,"mtime":1631092178270,"results":"45","hashOfConfig":"24"},{"filePath":"46","messages":"47","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},"74vu3w",{"filePath":"49","messages":"50","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"51","messages":"52","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"53","messages":"54","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"55","messages":"56","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"57","messages":"58","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"59","messages":"60","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"61","messages":"62","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"63","messages":"64","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"65","messages":"66","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"67","messages":"68","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"69","messages":"70","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"71","messages":"72","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"73","messages":"74","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"75","messages":"76","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"77","messages":"78","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"79","messages":"80","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"81","messages":"82","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"83","messages":"84","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"85"},{"filePath":"86","messages":"87","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"48"},{"filePath":"88","messages":"89","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"90","messages":"91","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/index.tsx",[],["92","93"],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/reportWebVitals.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/application.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/firebase.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/logging.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/routes.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/config.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/AuthRoute/index.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/change.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/home.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/forgot.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/login.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/logout.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/register.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/reset.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/modules/index.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/ErrorText/index.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/components/AuthContainer/index.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/interfaces/page.ts",[],["94","95"],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/config/firestore.ts",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/LinkForm.tsx",[],"/home/sonia/VisualStudioCode/Poryecto-Propio/Proyecto-React-Firebase/src/pages/auth/Links.tsx",[],{"ruleId":"96","replacedBy":"97"},{"ruleId":"98","replacedBy":"99"},{"ruleId":"96","replacedBy":"100"},{"ruleId":"98","replacedBy":"101"},"no-native-reassign",["102"],"no-negated-in-lhs",["103"],["102"],["103"],"no-global-assign","no-unsafe-negation"]
      \ No newline at end of file \ No newline at end of file
      src/config/config.ts
      View file @ 5b5b770d
      //Clave de autotentificación para el firebase:
      const config = { const config = {
      firebase: { firebase: {
      apiKey: "AIzaSyC6IF_TzThVkBp5zOc4qQLurfhxRp_jHAY", apiKey: "AIzaSyC6IF_TzThVkBp5zOc4qQLurfhxRp_jHAY",
      ......
      src/config/routes.ts
      View file @ 5b5b770d
      ...@@ -14,49 +14,63 @@ const routes: IRoute[] = [ ...@@ -14,49 +14,63 @@ const routes: IRoute[] = [
      exact: true, exact: true,
      component: HomePage, component: HomePage,
      name: 'Home Page', name: 'Home Page',
      protected: true protected: true,
      addOrEditLink: '',
      currentId: '',
      }, },
      { {
      path: '/register', path: '/register',
      exact: true, exact: true,
      component: RegisterPage, component: RegisterPage,
      name: 'Register Page', name: 'Register Page',
      protected: false protected: false,
      addOrEditLink: '',
      currentId: '',
      }, },
      { {
      path: '/login', path: '/login',
      exact: true, exact: true,
      component: LoginPage, component: LoginPage,
      name: 'Login Page', name: 'Login Page',
      protected: false protected: false,
      addOrEditLink: '',
      currentId: '',
      }, },
      { {
      path: '/change', path: '/change',
      exact: true, exact: true,
      component: ChangePasswordPage, component: ChangePasswordPage,
      name: 'Change Password Page', name: 'Change Password Page',
      protected: true protected: true,
      addOrEditLink: '',
      currentId: '',
      }, },
      { {
      path: '/logout', path: '/logout',
      exact: true, exact: true,
      component: LogoutPage, component: LogoutPage,
      name: 'Logout Page', name: 'Logout Page',
      protected: true protected: true,
      addOrEditLink: '',
      currentId: '',
      }, },
      { {
      path: '/forget', path: '/forget',
      exact: true, exact: true,
      component: ForgotPasswordPage, component: ForgotPasswordPage,
      name: 'Forgot Password Page', name: 'Forgot Password Page',
      protected: false protected: false,
      addOrEditLink: '',
      currentId: '',
      }, },
      { {
      path: '/reset', path: '/reset',
      exact: true, exact: true,
      component: ResetPasswordPage, component: ResetPasswordPage,
      name: 'Reset Password Page', name: 'Reset Password Page',
      protected: false protected: false,
      addOrEditLink: '',
      currentId: '',
      } }
      ]; ];
      ......
      src/interfaces/page.ts
      View file @ 5b5b770d
      export default interface IPageProps { export default interface IPageProps {
      name: string; //name: string;
      addOrEditLink: any;
      currentId: any;
      } }
      \ No newline at end of file
      src/interfaces/route.ts
      View file @ 5b5b770d
      ...@@ -4,4 +4,6 @@ export default interface IRoute { ...@@ -4,4 +4,6 @@ export default interface IRoute {
      component: any; component: any;
      name: string; name: string;
      protected: boolean; protected: boolean;
      addOrEditLink: any;
      currentId: any;
      } }
      \ No newline at end of file
      src/pages/auth/LinkForm.js → src/pages/auth/LinkForm.tsx
      View file @ 5b5b770d
      import React, {useState, useEffect} from 'react'; import React, {useState, useEffect} from 'react';
      import Firebase from "../../config/firebase"; //import Firebase from "../../config/firebase";
      //import IPageProps from '../../interfaces/page'; import IPageProps from '../../interfaces/page';
      import db from "../../config/firestore";
      //Importamos toast para mensajes dinamicos (instalamos librería => npm install --save react-toastify) //Importamos toast para mensajes dinamicos (instalamos librería => npm install --save react-toastify)
      import { toast } from "react-toastify"; import { toast } from "react-toastify";
      const LinkForm = (props) =>{
      const LinkForm: React.FunctionComponent<IPageProps> = props =>{
      //Constantes iniciales //Constantes iniciales
      const initialStateValues = { const initialStateValues = {
      ...@@ -17,13 +20,13 @@ const LinkForm = (props) =>{ ...@@ -17,13 +20,13 @@ const LinkForm = (props) =>{
      const [values, setValues ] = useState(initialStateValues); const [values, setValues ] = useState(initialStateValues);
      //Funcion que maneja el cambio de cada input setea las initialStateValues: la propiedad e.target de cada onchange={} de los input //Funcion que maneja el cambio de cada input setea las initialStateValues: la propiedad e.target de cada onchange={} de los input
      const handleInputChange = e =>{ const handleInputChange = (e: { target: { name: string; value: string; }; }) =>{
      const {name, value} = e.target; const {name, value} = e.target;
      setValues({...values, [name]: value }); setValues({...values, [name]: value });
      } }
      //Para validar la URL por ejemplo: Buscar en google => validate url regex javascript //Para validar la URL por ejemplo: Buscar en google => validate url regex javascript
      const validURL = (str) => { const validURL = (str: string) => {
      var pattern = new RegExp( var pattern = new RegExp(
      "^(https?:\\/\\/)?" + // protocol "^(https?:\\/\\/)?" + // protocol
      "((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|" + // domain name "((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|" + // domain name
      ...@@ -39,7 +42,7 @@ const LinkForm = (props) =>{ ...@@ -39,7 +42,7 @@ const LinkForm = (props) =>{
      //Evento que escucha al enviar el formulario, simplemente para ver que en consola esta funcionando: //Evento que escucha al enviar el formulario, simplemente para ver que en consola esta funcionando:
      const handleSubmit = e => { const handleSubmit = (e: { preventDefault: () => void; }) => {
      e.preventDefault(); e.preventDefault();
      //Utilizamos el validador de de la URL para que la gente ponga bien la URL: //Utilizamos el validador de de la URL para que la gente ponga bien la URL:
      ...@@ -52,18 +55,44 @@ const LinkForm = (props) =>{ ...@@ -52,18 +55,44 @@ const LinkForm = (props) =>{
      } }
      // Le pasamos las props al addOrEditLink que esta en el component Links y este lo guardara en la base de datos (FIN DEL ASUNTO....) // Le pasamos las props al addOrEditLink que esta en el component Links y este lo guardara en la base de datos (FIN DEL ASUNTO....)
      props.addOrEditLink(values); props.addOrEditLink(values);
      //Una vez guardados los datos procedemos a setearlos y de esta manera dejamos limpios los intput: //Una vez guardados los datos procedemos a setearlos y de esta manera dejamos limpios los intput:
      setValues({...initialStateValues}) setValues({...initialStateValues})
      } }
      const getLinkById = async (id) => { const getLinkById = async (id: any, ) => {
      const doc = await Firebase.collection("links").doc(id).get();
      setValues({ ...doc.data() }); const doc = await db.collection("links").doc(id).get();
      };
      if (doc.exists) {
      // console.log(doc.id, " => ", doc.data());
      var nomb = [doc.data()?.name];
      var pagina = [doc.data()?.url];
      var descripcion = [doc.data()?.description];
      /* console.log("Nombre del sitio: ",nomb.toString());
      console.log("URL del sito: ",pagina.toString());
      console.log("Breve descripción: ",descripcion.toString());*/
      setValues({
      url: pagina.toString(),
      name: nomb.toString(),
      description: descripcion.toString(),
      });
      }else {
      // doc.data() will be undefined in this case
      console.log("No such document!");
      }
      }
      useEffect(() => { useEffect(() => {
      if (props.currentId === "") { if (props.currentId === "") {
      setValues({ ...initialStateValues }); setValues({ ...initialStateValues });
      ...@@ -90,7 +119,7 @@ const LinkForm = (props) =>{ ...@@ -90,7 +119,7 @@ const LinkForm = (props) =>{
      </div> </div>
      <br/> <br/>
      <div className="form-group"> <div className="form-group">
      <textarea style={{ color: "white" }} rows="3" className="form-control" placeholder="Write a Description" name="description" value={values.description} onChange={handleInputChange}/> <textarea style={{ color: "white" }} className="form-control" placeholder="Write a Description" name="description" value={values.description} onChange={handleInputChange}/>
      </div> </div>
      <br/> <br/>
      <button className="btn btn-primary btn-block"> <button className="btn btn-primary btn-block">
      ...@@ -101,3 +130,4 @@ const LinkForm = (props) =>{ ...@@ -101,3 +130,4 @@ const LinkForm = (props) =>{
      } }
      export default LinkForm; export default LinkForm;
      src/pages/auth/Links.js → src/pages/auth/Links.tsx
      View file @ 5b5b770d
      ...@@ -4,10 +4,12 @@ import LinksForm from "./LinkForm"; ...@@ -4,10 +4,12 @@ import LinksForm from "./LinkForm";
      import db from "../../config/firestore"; import db from "../../config/firestore";
      //Importamos toast para mensajes dinamicos (instalamos librería => npm install --save react-toastify) //Importamos toast para mensajes dinamicos (instalamos librería => npm install --save react-toastify)
      import { toast } from "react-toastify"; import { toast } from "react-toastify";
      //import firebase from "firebase";
      const Links = () => { const Links = () => {
      //Creamos el useState con su estado inicial de los (links) y su cambio posterior (setLinks): //Creamos el useState con su estado inicial de los (links) y su cambio posterior (setLinks):
      const [links, setLinks] = useState([]); ;
      const [links, setLinks] = useState<any[]>([]);
      //Creamos el useState con su estado inicial de los (currentId) y su cambio posterior (setCurrentId): //Creamos el useState con su estado inicial de los (currentId) y su cambio posterior (setCurrentId):
      const [currentId, setCurrentId] = useState(""); const [currentId, setCurrentId] = useState("");
      ...@@ -16,7 +18,8 @@ const Links = () => { ...@@ -16,7 +18,8 @@ const Links = () => {
      const getLinks = async () => { const getLinks = async () => {
      db.collection("links").onSnapshot((querySnapshot) => { db.collection("links").onSnapshot((querySnapshot) => {
      const docs = []; const docs = [] as any;
      querySnapshot.forEach((doc) => { querySnapshot.forEach((doc) => {
      docs.push({ ...doc.data(), id: doc.id }); docs.push({ ...doc.data(), id: doc.id });
      }); });
      ...@@ -26,7 +29,7 @@ const Links = () => { ...@@ -26,7 +29,7 @@ const Links = () => {
      //Borramos los datos facilmente con el delete() Mandamos un mensaje de si esta seguro de borrar los datos. //Borramos los datos facilmente con el delete() Mandamos un mensaje de si esta seguro de borrar los datos.
      // Y creamos un toast para mandar un mensaje dimamico diciendo que lo hemos borrado // Y creamos un toast para mandar un mensaje dimamico diciendo que lo hemos borrado
      const onDeleteLink = async (id) => { const onDeleteLink = async (id: string | undefined) => {
      if (window.confirm("are you sure you want to delete this link?")) { if (window.confirm("are you sure you want to delete this link?")) {
      await db.collection("links").doc(id).delete(); await db.collection("links").doc(id).delete();
      toast("Link Removed Successfully", { toast("Link Removed Successfully", {
      ...@@ -44,15 +47,17 @@ const Links = () => { ...@@ -44,15 +47,17 @@ const Links = () => {
      // 2 OPCIONES: // 2 OPCIONES:
      // 1. Añadimos los datos a la colección de firbase seteando el linkObject y creamos otro mensaje dimamico para que se vea. // 1. Añadimos los datos a la colección de firbase seteando el linkObject y creamos otro mensaje dimamico para que se vea.
      // 2. Actualizamos los datos a la colección de firbase haciendo un update el linkObject y creamos otro mensaje dimamico para que se vea. // 2. Actualizamos los datos a la colección de firbase haciendo un update el linkObject y creamos otro mensaje dimamico para que se vea.
      const addOrEditLink = async (linkObject) => { const addOrEditLink = async (linkObject: { [x: string]: any; }) => {
      try { try {
      if (currentId === "") { if (currentId === "") {
      console.log("Añado datos a la base");
      await db.collection("links").doc().set(linkObject); await db.collection("links").doc().set(linkObject);
      toast("New Link Added", { toast("New Link Added", {
      type: "success", // success => color verde type: "success", // success => color verde
      autoClose: 2000 // El mensaje se autocierra pasado 2 segundos autoClose: 2000 // El mensaje se autocierra pasado 2 segundos
      }); });
      } else { } else {
      console.log("Entro en el update");
      await db.collection("links").doc(currentId).update(linkObject); await db.collection("links").doc(currentId).update(linkObject);
      toast("Link Updated Successfully", { toast("Link Updated Successfully", {
      type: "info", // info => color azul type: "info", // info => color azul
      ......
      src/pages/home.tsx
      View file @ 5b5b770d
      ...@@ -3,6 +3,8 @@ import { Link } from 'react-router-dom'; ...@@ -3,6 +3,8 @@ import { Link } from 'react-router-dom';
      import { Card, CardBody, Container } from 'reactstrap'; import { Card, CardBody, Container } from 'reactstrap';
      import IPageProps from '../interfaces/page'; import IPageProps from '../interfaces/page';
      import Links from './auth/Links'; import Links from './auth/Links';
      //import { ToastContainer } from "react-toastify";
      //Página de inicio protegida: //Página de inicio protegida:
      const HomePage: React.FunctionComponent<IPageProps> = props => { const HomePage: React.FunctionComponent<IPageProps> = props => {
      ...@@ -21,10 +23,16 @@ const HomePage: React.FunctionComponent<IPageProps> = props => { ...@@ -21,10 +23,16 @@ const HomePage: React.FunctionComponent<IPageProps> = props => {
      {/**Creamos pequeño enlace para cambiar contraseña si queremos una vez dentro de home nos redirige a la page de cambio*/} {/**Creamos pequeño enlace para cambiar contraseña si queremos una vez dentro de home nos redirige a la page de cambio*/}
      Click <Link to='/logout'>here</Link> to logout. Click <Link to='/logout'>here</Link> to logout.
      </p> </p>
      <p>Prueba de concepto:</p> <p>Facilita los linKs a la comunidad, para así aprender juntos:</p>
      <div> <div>
      <p>¡El saber es poder!</p>
      <Links/> <Links/>
      </div> </div>
      <div>
      {/** <ToastContainer/> */}
      </div>
      </CardBody> </CardBody>
      </Card> </Card>
      </Container> </Container>
      ......
      Markdown is supported
      0% or
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment