Merge pull request #2 from DemocraciaEnRed/dev/removeRedux

Dev/remove redux
DemocraciaEnRed · Feb 8, 2024 · 12d4263 · 12d4263
2 parents 17d9499 + 4e857f7
commit 12d4263
Show file tree

Hide file tree

Showing 58 changed files with 888 additions and 1,521 deletions.
diff --git a/next.config.js b/next.config.js
@@ -1,5 +1,8 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
+    experimental: {
+        serverActions: true,
+    },
 }
 
 module.exports = nextConfig
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -19,11 +19,10 @@
     "@mdxeditor/editor": "^1.13.5",
     "@mui/material": "^5.14.18",
     "@react-input/mask": "^1.0.20",
-    "@reduxjs/toolkit": "^1.9.7",
+    "@reduxjs/toolkit": "^2.1.0",
     "axios": "^1.6.2",
     "bulma": "^0.9.4",
-    "cookies-js": "^1.2.3",
-    "cookies-next": "^4.1.0",
+    "js-cookie": "^3.0.5",
     "next": "13.5.5",
     "next-transpile-modules": "^10.0.1",
     "react": "^18",
@@ -32,7 +31,6 @@
     "react-remark": "^2.1.0",
     "react-share": "^5.0.3",
     "redux-persist": "^6.0.0",
-    "redux-persist-cookie-storage": "^1.0.0",
     "slate-react": "^0.99.0",
     "slugify": "^1.6.6",
     "swiper": "^11.0.5"

diff --git a/src/app/admin/page.jsx b/src/app/admin/page.jsx
@@ -1,23 +1,12 @@
-"use client"
-import { useState } from "react"
+'use client'
 import { useRouter, redirect } from "next/navigation"
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faFile } from "@fortawesome/free-regular-svg-icons";
-import { faPencil } from "@fortawesome/free-solid-svg-icons";
-import { useSelector } from "react-redux";
-import axiosServices from "@/utils/axios";
-import ProjectFormComponent from "@/components/pacto/form/projectForm";
-import { useEffect } from "react";
+import { useAuthContext } from "@/context/auth-context";
 
-export default function AdminHomePage({params}) {
+export default function AdminHomePage({ params }) {
   // get the user from store
-  const { user } = useSelector(state => state.auth)
-  // redirect if user is not logged in
-  if (!user) {
-    redirect('/auth/login')
-  }
+  const { user } = useAuthContext()  // redirect if user is not logged in
   // redirect if user is not admin or author
-  if (user.role !== 'admin') {
+  if (user && user.role !== 'admin') {
     redirect('/')
   }
 
@@ -26,7 +15,7 @@ export default function AdminHomePage({params}) {
       <div className="">
         <h1 className="title is-3">Panel de administración</h1>
         <p>Seleccione una opción del menú lateral</p>
-       </div>
+      </div>
     </>
   )
 }
diff --git a/src/app/admin/proyectos/page.jsx b/src/app/admin/proyectos/page.jsx
@@ -4,14 +4,14 @@ import { useRouter, redirect } from "next/navigation"
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faFile } from "@fortawesome/free-regular-svg-icons";
 import { faPencil } from "@fortawesome/free-solid-svg-icons";
-import { useSelector } from "react-redux";
 import Link from 'next/link'
 import Emoji from "@/components/common/emoji";
-import axiosServices from "@/utils/axios";
+import { useAuthContext } from "@/context/auth-context";
+import { adminFetchProjects } from "@/utils/get-data";
 
 export default function AdminProjectPage({params}) {
   // get the user from store
-  const { user } = useSelector(state => state.auth)
+  const { user } = useAuthContext()
 
   // redirect if user is not logged in
   if (!user) {
@@ -42,27 +42,27 @@ export default function AdminProjectPage({params}) {
   async function initFetch() {
     try {
       // check if admin is the same as the user
-       if(user.role !== 'admin') {
+      if(user.role !== 'admin') {
         console.log('----- not admin')
         // cannot be here, go to home
         router.push('/')
       }
 
       // fetch
       const promises = [
-        axiosServices.get(`/admin/projects?limit=${limit}`),
+        adminFetchProjects(page, limit),
       ]
+
 
-      const [projectRes] = await Promise.all(promises)
-
+      const [projectData] = await Promise.all(promises)
       // attach projects to array "projects"
-      const projects = projectRes.data.projects
+      const projects = projectData.projects
       setProjects(projects)
-      setPage(projectRes.data.page)
-      setPages(projectRes.data.pages)
-      setTotal(projectRes.data.total)
-      setNextPage(projectRes.data.nextPage)
-      setPrevPage(projectRes.data.prevPage)
+      setPage(projectData.page)
+      setPages(projectData.pages)
+      setTotal(projectData.total)
+      setNextPage(projectData.nextPage)
+      setPrevPage(projectData.prevPage)
       setIsLoading(false)
 
     } catch (error) {
@@ -75,19 +75,19 @@ export default function AdminProjectPage({params}) {
     setIsLoadingMore(true)
 
     const promises = [
-      axiosServices.get(`/admin/projects?page=${thePage}&limit=${limit}`),
+      adminFetchProjects(thePage, limit),
     ]
 
-    const [projectRes] = await Promise.all(promises)
+    const [projectData] = await Promise.all(promises)
 
     // attach projects to array "projects"
-    const projects = projectRes.data.projects
+    const projects = projectData.projects
     setProjects(projects)
-    setPage(projectRes.data.page)
-    setPages(projectRes.data.pages)
-    setTotal(projectRes.data.total)
-    setNextPage(projectRes.data.nextPage)
-    setPrevPage(projectRes.data.prevPage)
+    setPage(projectData.page)
+    setPages(projectData.pages)
+    setTotal(projectData.total)
+    setNextPage(projectData.nextPage)
+    setPrevPage(projectData.prevPage)
     setIsLoadingMore(false)
     return;
   }

diff --git a/src/app/admin/usuarios/[id]/page.jsx b/src/app/admin/usuarios/[id]/page.jsx
@@ -2,19 +2,20 @@
 import { useState, useEffect, useRef } from "react"
 import { useRouter, redirect } from "next/navigation"
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { useSelector } from "react-redux";
 import Link from 'next/link'
-import Image from 'next/image'
+import { useAuthContext } from "@/context/auth-context";
+import { adminFetchProjectsByAuthor, adminFetchUserId } from "@/utils/get-data";
+
 import axiosServices from "@/utils/axios";
-import { faAngleDoubleRight, faCheck, faDownload, faExclamationTriangle, faPenClip, faShield, faSync, faTimes, faUserEdit, faUserShield } from "@fortawesome/free-solid-svg-icons";
-import Emoji from "@/components/common/emoji";
+import { faAngleDoubleRight, faExclamationTriangle, faPenClip, faShield, faSync, faUserShield } from "@fortawesome/free-solid-svg-icons";
 import { faCheckCircle, faSave, faTimesCircle, faUser } from "@fortawesome/free-regular-svg-icons";
-import { setMessage } from "@/store/reducers/alert"
 import UserInfoForm from "@/components/admin/userInfoForm";
+import { useAlert } from "@/context/alert-context";
+
 
 export default function AdminUserInfoPage({params}) {
   // get the user from store
-  const { user } = useSelector(state => state.auth)
+  const { user } = useAuthContext()
 
   // redirect if user is not logged in
   if (!user) {
@@ -36,6 +37,8 @@ export default function AdminUserInfoPage({params}) {
   const [isUpdating, setIsUpdating] = useState(false)
   const userInfoRef = useRef(null)
 
+  const{addAlert} = useAlert()
+
   useEffect(() => {
     fetchData()
   }, [])
@@ -44,15 +47,15 @@ export default function AdminUserInfoPage({params}) {
     try {
       // fetch
       const promises = [
-        axiosServices.get(`/admin/users/${userId}`),
-        axiosServices.get(`/projects?author=${userId}`)
+        adminFetchUserId(userId),
+        adminFetchProjectsByAuthor(userId)
       ]
 
-      const [userRes, projectRes] = await Promise.all(promises)
+      const [user, projects] = await Promise.all(promises)
+      const projectsTotal = projects.total
 
       // attach projects to array "projects"
-      const user = userRes.data
-      const projectsTotal = projectRes.data.total
+
       setUserData(user)
       setProjectsTotal(projectsTotal)
       setIsLoading(false)
@@ -80,17 +83,11 @@ export default function AdminUserInfoPage({params}) {
       setIsUpdating(true)
       const response = await axiosServices.put(`/admin/users/${userId}/role`, {role})
       fetchData()
-      setMessage({
-        message: 'Rol de usuario actualizado', 
-        type:'success'
-      })
+      addAlert('Rol de usuario actualizado','success')
 
     } catch (error) {
       console.error(error)
-      setMessage({
-        message: 'Ha ocurrido un error al actualizar el rol del usuario', 
-        type:'danger'
-      })
+      addAlert('Ha ocurrido un error al actualizar el rol del usuario', 'danger')
     }
   }
 
@@ -101,17 +98,11 @@ export default function AdminUserInfoPage({params}) {
       setIsUpdating(true)
       const response = await axiosServices.put(`/admin/users/${userId}`, userInfo)
       fetchData()
-      setMessage({
-        message: 'Datos de usuario actualizados', 
-        type:'success'
-      })
+      addAlert('Datos de usuario actualizados','success')
 
     } catch (error) {
       console.error(error)
-      setMessage({
-        message: 'Ha ocurrido un error al actualizar los datos del usuario', 
-        type:'danger'
-      })
+      addAlert('Ha ocurrido un error al actualizar los datos del usuario', 'danger')
     }
   }
 

diff --git a/src/app/admin/usuarios/page.jsx b/src/app/admin/usuarios/page.jsx
@@ -2,17 +2,17 @@
 import { useState, useEffect } from "react"
 import { useRouter, redirect } from "next/navigation"
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { useSelector } from "react-redux";
 import Link from 'next/link'
 import Image from 'next/image'
-import axiosServices from "@/utils/axios";
 import { faCheck, faDownload, faPenClip, faShield, faSync, faTimes, faUserEdit, faUserShield } from "@fortawesome/free-solid-svg-icons";
 import Emoji from "@/components/common/emoji";
 import { faCheckCircle, faTimesCircle } from "@fortawesome/free-regular-svg-icons";
+import { useAuthContext } from "@/context/auth-context";
+import { adminFetchUsers, adminFetchUsersCsv } from "@/utils/get-data";
 
 export default function AdminUsersListPage({params}) {
   // get the user from store
-  const { user } = useSelector(state => state.auth)
+  const { user } = useAuthContext()
 
   // redirect if user is not logged in
   if (!user) {
@@ -51,19 +51,19 @@ export default function AdminUsersListPage({params}) {
 
       // fetch
       const promises = [
-        axiosServices.get(`/admin/users?limit=${limit}&page=${page}`),
+        adminFetchUsers(page, limit),
       ]
 
-      const [projectRes] = await Promise.all(promises)
+      const [usersData] = await Promise.all(promises)
 
       // attach projects to array "projects"
-      const users = projectRes.data.users
+      const users = usersData.users
       setUsers(users)
-      setPage(projectRes.data.page)
-      setPages(projectRes.data.pages)
-      setTotal(projectRes.data.total)
-      setNextPage(projectRes.data.nextPage)
-      setPrevPage(projectRes.data.prevPage)
+      setPage(usersData.page)
+      setPages(usersData.pages)
+      setTotal(usersData.total)
+      setNextPage(usersData.nextPage)
+      setPrevPage(usersData.prevPage)
       setIsLoading(false)
 
     } catch (error) {
@@ -75,19 +75,19 @@ export default function AdminUsersListPage({params}) {
   async function fetchPage(thePage) {
     setIsLoadingMore(true)
     const promises = [
-      axiosServices.get(`/admin/users?page=${thePage}&limit=${limit}`),
+      adminFetchUsers(thePage, limit),
     ]
 
-    const [projectRes] = await Promise.all(promises)
+    const [usersData] = await Promise.all(promises)
 
     // attach projects to array "projects"
-    const users = projectRes.data.users
+    const users = usersData.users
     setUsers(users)
-    setPage(projectRes.data.page)
-    setPages(projectRes.data.pages)
-    setTotal(projectRes.data.total)
-    setNextPage(projectRes.data.nextPage)
-    setPrevPage(projectRes.data.prevPage)
+    setPage(usersData.page)
+    setPages(usersData.pages)
+    setTotal(usersData.total)
+    setNextPage(usersData.nextPage)
+    setPrevPage(usersData.prevPage)
     setIsLoadingMore(false)
     return;
   }
@@ -159,7 +159,7 @@ export default function AdminUsersListPage({params}) {
   }
 
   function downloadCSV(){
-    axiosServices.get('/admin/users/csv', {
+    adminFetchUsersCsv('/admin/users/csv', {
       responseType: 'blob'
     })
     .then(res => {

diff --git a/src/app/auth/login/page.jsx b/src/app/auth/login/page.jsx
@@ -5,11 +5,6 @@ import { cookies } from 'next/headers';
 
 
 export default async function Login(props) {
-    const token = cookies().get('auth')
-    const user = token ?  await fetchUserMe() : null
-    if (user) {
-        redirect('/')
-    }
     return (
         <div className="auth-wrapper is-flex is-justify-content-center is-align-items-center">
             <div className="login-form-wrapper">

diff --git a/src/app/auth/register/page.jsx b/src/app/auth/register/page.jsx
@@ -5,11 +5,6 @@ import { cookies } from 'next/headers';
 
 
 export default async function Register() {
-    const token = cookies().get('auth')
-    const user = token ?  await fetchUserMe() : null
-    if (user) {
-        redirect('/')
-    }
     return (
         <div className="auth-wrapper is-flex is-justify-content-center is-align-items-center">