From e3527af1e3b0392d0cea1b42affa49675966ce06 Mon Sep 17 00:00:00 2001 From: edwin6666 Date: Tue, 4 Jul 2023 10:46:59 -0400 Subject: [PATCH 1/7] Fix: Format to DateTime in post --- package-lock.json | 9 +++++++++ package.json | 1 + src/components/Login/index.jsx | 2 +- src/components/PostCard.jsx | 6 ++++-- src/components/PostCardUser.jsx | 6 +++--- yarn.lock | 5 +++++ 6 files changed, 23 insertions(+), 6 deletions(-) diff --git a/package-lock.json b/package-lock.json index 7ef275d..96947db 100644 --- a/package-lock.json +++ b/package-lock.json @@ -20,6 +20,7 @@ "eslint-config-react-app": "^7.0.1", "formik": "^2.2.9", "jsonwebtoken": "^9.0.0", + "moment": "^2.29.4", "react": "^18.2.0", "react-dom": "^18.2.0", "react-hot-toast": "^2.4.0", @@ -12087,6 +12088,14 @@ "mkdirp": "bin/cmd.js" } }, + "node_modules/moment": { + "version": "2.29.4", + "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz", + "integrity": "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==", + "engines": { + "node": "*" + } + }, "node_modules/ms": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", diff --git a/package.json b/package.json index c2e2499..1b69b34 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "eslint-config-react-app": "^7.0.1", "formik": "^2.2.9", "jsonwebtoken": "^9.0.0", + "moment": "^2.29.4", "react": "^18.2.0", "react-dom": "^18.2.0", "react-hot-toast": "^2.4.0", diff --git a/src/components/Login/index.jsx b/src/components/Login/index.jsx index 44278b9..cc8c21f 100644 --- a/src/components/Login/index.jsx +++ b/src/components/Login/index.jsx @@ -68,7 +68,7 @@ const Signin = () => {

- TechTalk{" "} + TechTalk

Sign in to access your account diff --git a/src/components/PostCard.jsx b/src/components/PostCard.jsx index 3eaf805..622b7ad 100644 --- a/src/components/PostCard.jsx +++ b/src/components/PostCard.jsx @@ -1,11 +1,13 @@ import toast from "react-hot-toast"; import { usePosts } from "../context/postContext"; import { useNavigate } from "react-router-dom"; - +import moment from 'moment'; export function PostCard({ post }) { const { deletePost } = usePosts(); const navigate = useNavigate(); + const fechaNormal = moment(post.createdAt).format('DD/MM/YYYY'); + const handleDelete = (id) => { toast( (t) => ( @@ -56,7 +58,7 @@ export function PostCard({ post }) { TechTalk

- {post.createdAt} + {fechaNormal}

diff --git a/src/components/PostCardUser.jsx b/src/components/PostCardUser.jsx index 8130285..d82321c 100644 --- a/src/components/PostCardUser.jsx +++ b/src/components/PostCardUser.jsx @@ -1,8 +1,8 @@ - +import moment from 'moment'; export function PostCardUser({ post }) { - + const fechaNormal = moment(post.createdAt).format('DD/MM/YYYY'); return (
@@ -11,7 +11,7 @@ export function PostCardUser({ post }) { Alex

TechTalk

-

{post.createdAt}

+

{fechaNormal}

diff --git a/yarn.lock b/yarn.lock index 82f7395..11db1b1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6614,6 +6614,11 @@ mkdirp@~0.5.1: dependencies: minimist "^1.2.6" +moment@^2.29.4: + version "2.29.4" + resolved "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz" + integrity sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w== + ms@^2.1.1, ms@2.1.2: version "2.1.2" resolved "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz" From e26816d01dd2d4ffc4b179e28fdfafdbf2333544 Mon Sep 17 00:00:00 2001 From: edwin6666 Date: Tue, 4 Jul 2023 14:38:23 -0400 Subject: [PATCH 2/7] Feat video posting --- src/components/PostCard.jsx | 8 +++--- src/components/PostCardUser.jsx | 44 ++++++++++++++++++++++----------- 2 files changed, 34 insertions(+), 18 deletions(-) diff --git a/src/components/PostCard.jsx b/src/components/PostCard.jsx index 622b7ad..2aa2b2f 100644 --- a/src/components/PostCard.jsx +++ b/src/components/PostCard.jsx @@ -1,12 +1,12 @@ import toast from "react-hot-toast"; import { usePosts } from "../context/postContext"; import { useNavigate } from "react-router-dom"; -import moment from 'moment'; +import moment from "moment"; export function PostCard({ post }) { const { deletePost } = usePosts(); const navigate = useNavigate(); - const fechaNormal = moment(post.createdAt).format('DD/MM/YYYY'); + const fechaNormal = moment(post.createdAt).format("DD/MM/YYYY"); const handleDelete = (id) => { toast( @@ -51,7 +51,7 @@ export function PostCard({ post }) { Alex

@@ -79,7 +79,7 @@ export function PostCard({ post }) {

- {post.image && imagen } + {post.image && }

{post.title}

{post.description}

diff --git a/src/components/PostCardUser.jsx b/src/components/PostCardUser.jsx index d82321c..920f2b0 100644 --- a/src/components/PostCardUser.jsx +++ b/src/components/PostCardUser.jsx @@ -1,32 +1,48 @@ - -import moment from 'moment'; +import moment from "moment"; export function PostCardUser({ post }) { - const fechaNormal = moment(post.createdAt).format('DD/MM/YYYY'); + const fechaNormal = moment(post.createdAt).format("DD/MM/YYYY"); return ( -
- Alex + Alex
-

TechTalk

-

{fechaNormal}

+

+ TechTalk +

+

+ {" "} + {fechaNormal} +

- - + +
- {post.image && imagen } + {post.image && imagen }
-

{post.title}

{post.description}

- -); -}; \ No newline at end of file + ); +} From dd9a9fe0c38b194fbc2d59fb00c8397bee89fcaf Mon Sep 17 00:00:00 2001 From: edwin6666 Date: Tue, 4 Jul 2023 15:07:45 -0400 Subject: [PATCH 3/7] Fix functionality to recognize if the file is image or video --- src/components/PostCard.jsx | 22 ++++++++++++++++++++-- src/components/PostCardUser.jsx | 5 +++-- 2 files changed, 23 insertions(+), 4 deletions(-) diff --git a/src/components/PostCard.jsx b/src/components/PostCard.jsx index 2aa2b2f..6d48325 100644 --- a/src/components/PostCard.jsx +++ b/src/components/PostCard.jsx @@ -2,6 +2,23 @@ import toast from "react-hot-toast"; import { usePosts } from "../context/postContext"; import { useNavigate } from "react-router-dom"; import moment from "moment"; + +// Función para insertar la etiqueta de imagen o video según el tipo de archivo +export function insertarMedia(rutaArchivo) { + var extension = rutaArchivo.split('.').pop().toLowerCase(); + + if (extension === 'jpg' || extension === 'jpeg' || extension === 'png' || extension === 'gif') { + // Es una imagen + return Imagen; + } else if (extension === 'mp4' || extension === 'webm' || extension === 'ogv') { + // Es un video + return ; + } else { + // Otro tipo de archivo, no compatible + return

Tipo de archivo no compatible

; + } +} + export function PostCard({ post }) { const { deletePost } = usePosts(); const navigate = useNavigate(); @@ -79,11 +96,12 @@ export function PostCard({ post }) {
- {post.image && } + {post.image && insertarMedia(post.image.url)} +

{post.title}

{post.description}

); -} +} \ No newline at end of file diff --git a/src/components/PostCardUser.jsx b/src/components/PostCardUser.jsx index 920f2b0..23b1629 100644 --- a/src/components/PostCardUser.jsx +++ b/src/components/PostCardUser.jsx @@ -1,5 +1,5 @@ import moment from "moment"; - +import { insertarMedia } from "./PostCard"; export function PostCardUser({ post }) { const fechaNormal = moment(post.createdAt).format("DD/MM/YYYY"); return ( @@ -38,7 +38,8 @@ export function PostCardUser({ post }) { - {post.image && imagen } + {post.image && insertarMedia(post.image.url)} +

{post.title}

{post.description}

From a907a876c8816d8cba562fad3dc23f853195d38f Mon Sep 17 00:00:00 2001 From: edwin6666 Date: Tue, 4 Jul 2023 15:11:53 -0400 Subject: [PATCH 4/7] Fix bug that restarted the page and deleted user data --- src/components/Navbar/Navbar.jsx | 92 ++++++++++++++++++-------------- 1 file changed, 52 insertions(+), 40 deletions(-) diff --git a/src/components/Navbar/Navbar.jsx b/src/components/Navbar/Navbar.jsx index 827680d..f9e5ed3 100644 --- a/src/components/Navbar/Navbar.jsx +++ b/src/components/Navbar/Navbar.jsx @@ -1,60 +1,72 @@ import React, { useState } from 'react'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faSignOutAlt } from '@fortawesome/free-solid-svg-icons'; +import { Link } from 'react-router-dom'; - - - - const Navbar = () => { - const handleLogout = ()=> { +const Navbar = () => { + const handleLogout = () => { localStorage.removeItem("token"); window.location.reload("/login"); - } + }; + const [open, setOpen] = useState(true); const toggleMenu = () => { setOpen(!open); }; - - - - return ( - -
-
-
-
- TechTalk News - +
+
+
- +
); }; From 3b0d0416dfe4a6288a8d9e862015c31a28d5e172 Mon Sep 17 00:00:00 2001 From: edwin6666 Date: Tue, 4 Jul 2023 18:36:48 -0400 Subject: [PATCH 5/7] Delete comment innecesary --- src/components/PostCard.jsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/src/components/PostCard.jsx b/src/components/PostCard.jsx index 6d48325..b3d6c98 100644 --- a/src/components/PostCard.jsx +++ b/src/components/PostCard.jsx @@ -3,18 +3,17 @@ import { usePosts } from "../context/postContext"; import { useNavigate } from "react-router-dom"; import moment from "moment"; -// Función para insertar la etiqueta de imagen o video según el tipo de archivo export function insertarMedia(rutaArchivo) { var extension = rutaArchivo.split('.').pop().toLowerCase(); if (extension === 'jpg' || extension === 'jpeg' || extension === 'png' || extension === 'gif') { - // Es una imagen + return Imagen; } else if (extension === 'mp4' || extension === 'webm' || extension === 'ogv') { - // Es un video + return ; } else { - // Otro tipo de archivo, no compatible + return

Tipo de archivo no compatible

; } } From 2d41f67432e67ad831cb47ea802408a878ea4cca Mon Sep 17 00:00:00 2001 From: edwin6666 Date: Tue, 4 Jul 2023 19:40:37 -0400 Subject: [PATCH 6/7] Feat Traslation to variables name --- src/components/PostCard.jsx | 16 ++++++++-------- src/components/PostCardUser.jsx | 8 ++++---- 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/src/components/PostCard.jsx b/src/components/PostCard.jsx index b3d6c98..da73160 100644 --- a/src/components/PostCard.jsx +++ b/src/components/PostCard.jsx @@ -3,18 +3,18 @@ import { usePosts } from "../context/postContext"; import { useNavigate } from "react-router-dom"; import moment from "moment"; -export function insertarMedia(rutaArchivo) { - var extension = rutaArchivo.split('.').pop().toLowerCase(); +export function insertMedia(filePath) { + var extension = filePath.split('.').pop().toLowerCase(); if (extension === 'jpg' || extension === 'jpeg' || extension === 'png' || extension === 'gif') { - return Imagen; + return Imagen; } else if (extension === 'mp4' || extension === 'webm' || extension === 'ogv') { - return ; + return ; } else { - return

Tipo de archivo no compatible

; + return

Unsupported file type

; } } @@ -22,7 +22,7 @@ export function PostCard({ post }) { const { deletePost } = usePosts(); const navigate = useNavigate(); - const fechaNormal = moment(post.createdAt).format("DD/MM/YYYY"); + const normalDate= moment(post.createdAt).format("DD/MM/YYYY"); const handleDelete = (id) => { toast( @@ -74,7 +74,7 @@ export function PostCard({ post }) { TechTalk

- {fechaNormal} + {normalDate}

@@ -95,7 +95,7 @@ export function PostCard({ post }) { - {post.image && insertarMedia(post.image.url)} + {post.image && insertMedia(post.image.url)}

{post.title}

diff --git a/src/components/PostCardUser.jsx b/src/components/PostCardUser.jsx index 23b1629..9f5cf5d 100644 --- a/src/components/PostCardUser.jsx +++ b/src/components/PostCardUser.jsx @@ -1,7 +1,7 @@ import moment from "moment"; -import { insertarMedia } from "./PostCard"; +import { insertMedia } from "./PostCard"; export function PostCardUser({ post }) { - const fechaNormal = moment(post.createdAt).format("DD/MM/YYYY"); + const normalDate = moment(post.createdAt).format("DD/MM/YYYY"); return (
@@ -17,7 +17,7 @@ export function PostCardUser({ post }) {

{" "} - {fechaNormal} + {normalDate}

@@ -38,7 +38,7 @@ export function PostCardUser({ post }) {
- {post.image && insertarMedia(post.image.url)} + {post.image && insertMedia(post.image.url)}

{post.title}

From 3900a9eb718f10508835f9a8c16a6410f02c04b3 Mon Sep 17 00:00:00 2001 From: edwin6666 Date: Wed, 5 Jul 2023 14:57:11 -0400 Subject: [PATCH 7/7] Fix route to home --- src/components/Login/index.jsx | 8 +++----- src/components/PostCard.jsx | 26 +++++++++++++++++--------- src/components/PostCardUser.jsx | 4 ++-- 3 files changed, 22 insertions(+), 16 deletions(-) diff --git a/src/components/Login/index.jsx b/src/components/Login/index.jsx index cc8c21f..e587366 100644 --- a/src/components/Login/index.jsx +++ b/src/components/Login/index.jsx @@ -1,5 +1,4 @@ import { useState } from "react"; -import { useNavigate, useLocation } from "react-router-dom"; import useAuth from "../../hooks/useAuth"; import axios from "axios"; @@ -12,9 +11,8 @@ const Signin = () => { const { setAuth } = useAuth(); - const location = useLocation(); - const navigate = useNavigate(); - const from = location.state?.from?.pathname || "/"; + + const handleChange = ({ currentTarget: input }) => { setData({ ...data, [input.name]: input.value }); @@ -30,7 +28,7 @@ const Signin = () => { setAuth({ roles, token }); console.log(roles); - navigate(from, { replace: true }); + window.location= "/homeuser" } catch (error) { if ( error.response && diff --git a/src/components/PostCard.jsx b/src/components/PostCard.jsx index da73160..477e245 100644 --- a/src/components/PostCard.jsx +++ b/src/components/PostCard.jsx @@ -4,16 +4,24 @@ import { useNavigate } from "react-router-dom"; import moment from "moment"; export function insertMedia(filePath) { - var extension = filePath.split('.').pop().toLowerCase(); - - if (extension === 'jpg' || extension === 'jpeg' || extension === 'png' || extension === 'gif') { + var extension = filePath.split(".").pop().toLowerCase(); + if ( + extension === "jpg" || + extension === "jpeg" || + extension === "png" || + extension === "gif" + ) { return Imagen; - } else if (extension === 'mp4' || extension === 'webm' || extension === 'ogv') { - - return ; + } else if ( + extension === "mp4" || + extension === "webm" || + extension === "ogv" + ) { + return ( + + ); } else { - return

Unsupported file type

; } } @@ -22,7 +30,7 @@ export function PostCard({ post }) { const { deletePost } = usePosts(); const navigate = useNavigate(); - const normalDate= moment(post.createdAt).format("DD/MM/YYYY"); + const normalDate = moment(post.createdAt).format("DD/MM/YYYY"); const handleDelete = (id) => { toast( @@ -103,4 +111,4 @@ export function PostCard({ post }) {
); -} \ No newline at end of file +} diff --git a/src/components/PostCardUser.jsx b/src/components/PostCardUser.jsx index 9f5cf5d..f5fcc8c 100644 --- a/src/components/PostCardUser.jsx +++ b/src/components/PostCardUser.jsx @@ -9,7 +9,7 @@ export function PostCardUser({ post }) { Alex

@@ -39,7 +39,7 @@ export function PostCardUser({ post }) {

{post.image && insertMedia(post.image.url)} - +

{post.title}

{post.description}