QUE SEA CLICKEABLE LA LIGA DE LA FILA https://prnt.sc/j--vbUTjgWMf

src/views/administracion/dependencias/DependenciasListado.js

@@ -7,6 +7,7 @@ import { ActionsButton } from '../../../components';
 import { SimpleTableLayout } from '../../../components/layouts'
 import { collection, onSnapshot, doc, updateDoc } from "firebase/firestore";
 import moment from 'moment';
+import { Link } from 'react-router-dom/cjs/react-router-dom';
 
 const DependenciasListado = () => {
 
@@ -30,14 +31,14 @@ const DependenciasListado = () => {
       key: "id",
       align: "center",
       width: 100,
-      render: (_, item ) => (
+      render: (_, item) => (
         <ActionsButton
           key={item}
           options={[
             {
               name: "Editar",
               icon: <EditOutlined />,
-              onClick: () => history.push(url+'/detalle?id='+item.id)
+              onClick: () => history.push(url + '/detalle?id=' + item.id)
             },
             {
               name: "Eliminar",
@@ -55,21 +56,27 @@ const DependenciasListado = () => {
       title: "Nombre",
       dataIndex: "nombre",
       key: "nombre",
-      render: defaultText,
+      render: (item, row) => (
+        <Link to={`${url}/detalle?id=${row.id}`} style={{ color: 'black' }}>
+          {defaultText(item)}
+        </Link>
+      ),
     },
     {
       title: "Creado",
       dataIndex: "timestamp",
       key: "timestamp",
       render: (_, item) => (
-        moment(item?.timestamp?.toDate()).format('DD-MM-YYYY')
+        <Link to={`${url}/detalle?id=${item.id}`} style={{ color: 'black' }}>
+          {moment(item?.timestamp?.toDate()).format('DD-MM-YYYY')}
+        </Link>
       ),
     },
   ];
-  
+
   const multipleButtonData = [{
     text: "Agregar",
-    to: () => history.push(url+'/nueva'),
+    to: () => history.push(url + '/nueva'),
     icon: <PlusCircleOutlined />,
     props: { disabled: false, type: 'primary', }
   }];
@@ -81,48 +88,48 @@ const DependenciasListado = () => {
       content: '¿Seguro que desea eliminar este registro?',
       onOk: async () => {
         try {
-          await updateDoc(doc(firestore, firebaseCollection, item.id), {estatus: false}); 
+          await updateDoc(doc(firestore, firebaseCollection, item.id), { estatus: false });
         } catch (error) {
           console.log('error al eliminar: ', error);
         }
       },
-      onCancel() {},
+      onCancel() { },
     });
   };
 
-  const onSearch = (searchValue) =>  {
+  const onSearch = (searchValue) => {
     setSearchInput(searchValue);
-    if( searchValue !== '' ){
+    if (searchValue !== '') {
       const filteredData = dependencias.filter((item) => {
         return Object.values(item).join('').toLowerCase().includes(searchValue.toLowerCase());
       })
       setFilteredResults(filteredData);
-    }else{
+    } else {
       setFilteredResults(dependencias);
     }
   };
 
   // Dependencias
-  useEffect (() => {  
+  useEffect(() => {
     try {
-      onSnapshot( collection(firestore, firebaseCollection), (querySnapshot) => {
-         const docs = [];
-         querySnapshot.forEach((doc) => {
-          if( doc.data().estatus ) {
-            docs.push({ ...doc.data(), id:doc.id });
+      onSnapshot(collection(firestore, firebaseCollection), (querySnapshot) => {
+        const docs = [];
+        querySnapshot.forEach((doc) => {
+          if (doc.data().estatus) {
+            docs.push({ ...doc.data(), id: doc.id });
           }
-         });
-         setDependencias(docs);
-       })
-     } catch (error) {
-       console.log('error al cargar dependencias de firebase: ', error);
-     } finally {
+        });
+        setDependencias(docs);
+      })
+    } catch (error) {
+      console.log('error al cargar dependencias de firebase: ', error);
+    } finally {
       setCargandoDependencias(false);
-     }
+    }
   }, []);
-  
+
   return (
-    <SimpleTableLayout 
+    <SimpleTableLayout
       title={titulo}
       multipleButtonData={multipleButtonData}
       onSearchClicked={onSearch}

src/views/administracion/eventos/EventosListado.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useState, useCallback } from 'react';
-import { Table, Modal, Button, message, Input, Row, Col, Tabs,  Divider } from 'antd';
+import { Table, Modal, Button, message, Input, Row, Col, Tabs, Divider } from 'antd';
 import { EditOutlined, DeleteOutlined, BarChartOutlined, PlusCircleOutlined, ExclamationCircleOutlined, DeliveredProcedureOutlined } from "@ant-design/icons";
 import { useHistory } from 'react-router-dom';
 import moment from 'moment';
@@ -8,6 +8,7 @@ import { ActionsButton } from '../../../components';
 import { SimpleTableLayout } from '../../../components/layouts';
 import { collection, limit, orderBy, updateDoc, doc, getDocs, query, where, addDoc } from "firebase/firestore";
 import { useAuth } from '../../../hooks';
+import { Link } from 'react-router-dom/cjs/react-router-dom';
 
 const { REACT_APP_WEB_URL } = process.env;
 
@@ -19,18 +20,18 @@ const EventosListado = () => {
   const url = "/administracion/eventos";
   const history = useHistory();
   const { confirm } = Modal;
-  
-  const [ eventos, setEventos ] = useState([]);
-  const [ grupoEventos, setGrupoEventos ] = useState([]);
-  const [ filteredResults, setFilteredResults ] = useState([]);
-  const [ searchInput, setSearchInput ] = useState('');
-  const [ visible, setVisible ] = useState(false);
-  const [ textAreaData, setTextAreaData ] = useState('');
-  const [ evento, setEvento ] = useState(null);
-  const [ procesando, setProcesando ] = useState(false);
-  const [ eventosPorPagina, setEventosPorPagina] = useState(10);
-  const [ currentPage, setCurrentPage] = useState(1);
-  
+
+  const [eventos, setEventos] = useState([]);
+  const [grupoEventos, setGrupoEventos] = useState([]);
+  const [filteredResults, setFilteredResults] = useState([]);
+  const [searchInput, setSearchInput] = useState('');
+  const [visible, setVisible] = useState(false);
+  const [textAreaData, setTextAreaData] = useState('');
+  const [evento, setEvento] = useState(null);
+  const [procesando, setProcesando] = useState(false);
+  const [eventosPorPagina, setEventosPorPagina] = useState(10);
+  const [currentPage, setCurrentPage] = useState(1);
+
   const defaultText = prop => prop || <span style={{ color: '#c7c3c3' }}>---</span>;
 
   const pageSizeOptions = ['10', '20', '30', '40', '50', '60', '70', '80'];
@@ -42,20 +43,20 @@ const EventosListado = () => {
       key: "id",
       align: "center",
       width: 100,
-      render: (_, item ) => (
+      render: (_, item) => (
         <ActionsButton
           key={item}
           options={[
             {
               name: "Editar",
               icon: <EditOutlined />,
-              onClick: () => history.push(url+'/detalle?id='+item.id)
+              onClick: () => history.push(url + '/detalle?id=' + item.id)
             },
             {
               name: "Ver resultados",
               disabled: !item?.resultado,
               icon: <BarChartOutlined />,
-              onClick: () => history.push(url+'/resultado-acciones?id='+item?.id),
+              onClick: () => history.push(url + '/resultado-acciones?id=' + item?.id),
             },
             {
               name: "Procesador",
@@ -80,15 +81,21 @@ const EventosListado = () => {
       title: "Nombre",
       dataIndex: "nombre",
       key: "nombre",
-      render: defaultText,
+      render: (item, row) => (
+        <Link to={`${url}/detalle?id=${row.id}`} style={{ color: 'black' }}>
+          {defaultText(item)}
+        </Link>
+      ),
     },
     {
       title: "Red social",
       dataIndex: "redSocial",
       key: "redSocial",
       align: 'center',
-      render: ( _, item ) => (
-        <img src={  '/assets/'+item?.redSocial+'.png'  } width='40' alt="Red social" />
+      render: (_, item) => (
+        <Link to={`${url}/detalle?id=${item.id}`} style={{ color: 'black' }}>
+          <img src={'/assets/' + item?.redSocial + '.png'} width='40' alt="Red social" />
+        </Link>
       ),
     },
     {
@@ -96,21 +103,23 @@ const EventosListado = () => {
       dataIndex: "timestamp",
       key: "timestamp",
       render: (_, item) => (
-        moment(item?.timestamp?.toDate()).format('DD-MM-YYYY')
+        <Link to={`${url}/detalle?id=${item.id}`} style={{ color: 'black' }}>
+          {moment(item?.timestamp?.toDate()).format('DD-MM-YYYY')}
+        </Link>
       ),
     },
     {
-      title: 'URL Laud', 
+      title: 'URL Laud',
       dataIndex: "id",
       key: "id",
       align: "center",
       width: 100,
-      render: (_, item ) => (
+      render: (_, item) => (
         <Button
           type='link'
-          onClick={ () => obtenerEnlaceYager(item) }
+          onClick={() => obtenerEnlaceYager(item)}
         >
-          <img src="/assets/LAUD-Avatar.png" width='40' alt="icono" style={{ position: 'relative', marginTop: -11  }} />
+          <img src="/assets/LAUD-Avatar.png" width='40' alt="icono" style={{ position: 'relative', marginTop: -11 }} />
         </Button>
       )
     }
@@ -123,7 +132,7 @@ const EventosListado = () => {
       key: "id",
       align: "center",
       width: 100,
-      render: (_, item ) => (
+      render: (_, item) => (
         <ActionsButton
           key={item}
           options={[
@@ -146,41 +155,54 @@ const EventosListado = () => {
       title: "Nombre",
       dataIndex: "nombre",
       key: "nombre",
-      render: defaultText,
+      render: (item, row) => (
+        <Link to={`${url}/detalleGrupo?id=${row?.id}&tag=${row?.tag}`} style={{ color: 'black' }}>
+          {defaultText(item)}
+        </Link>
+      ),
     },
     {
       title: "Redes",
       dataIndex: "redes",
       key: "redes",
       align: 'center',
-      render: ( _, item ) => {
-        return item?.redes.map( (i, index) => Array.from(item.redes.keys()).pop() !== index ? i.redSocial + ', ' : i.redSocial + '' )        
-      },
+      render: (_, item) => (
+        <Link to={`${url}/detalleGrupo?id=${item?.id}&tag=${item?.tag}`} style={{ color: 'black' }}>
+          {item?.redes.map((i, index) => Array.from(item.redes.keys()).pop() !== index ? i.redSocial + ', ' : i.redSocial + '')}
+        </Link>
+      ),
     },
     {
       title: "Creado",
       dataIndex: "timestamp",
       key: "timestamp",
       render: (_, item) => (
-        moment(item?.timestamp?.toDate()).format('DD-MM-YYYY')
+        <Link to={`${url}/detalleGrupo?id=${item?.id}&tag=${item?.tag}`} style={{ color: 'black' }}>
+          {moment(item?.timestamp?.toDate()).format('DD-MM-YYYY')}
+        </Link>
       ),
     },
     {
       title: "Grupo",
       dataIndex: "tag",
       key: "tag",
+      render: (item, row) => (
+        <Link to={`${url}/detalleGrupo?id=${row?.id}&tag=${row?.tag}`} style={{ color: 'black' }}>
+          {defaultText(item)}
+        </Link>
+      ),
     },
   ];
 
   const multipleButtonData = [
     {
       text: "Agregar",
-      to: () => history.push(url+'/nuevo'),
+      to: () => history.push(url + '/nuevo'),
       icon: <PlusCircleOutlined />,
       props: { disabled: false, type: 'primary', }
-    }, 
+    },
   ];
- 
+
   const ModalProcesar = () => {
     return (
       <Modal
@@ -225,10 +247,10 @@ const EventosListado = () => {
         columns={columnasGrupos}
         size='small'
         scroll={{ x: 700 }}
-        pagination={{ 
+        pagination={{
           current: currentPage,
-          defaultPageSize: eventosPorPagina, 
-          showSizeChanger: true, 
+          defaultPageSize: eventosPorPagina,
+          showSizeChanger: true,
           pageSizeOptions: pageSizeOptions,
           onChange: (page, pageSize) => {
             setCurrentPage(page)
@@ -247,10 +269,10 @@ const EventosListado = () => {
         columns={columnasEventos}
         size='small'
         scroll={{ x: 700 }}
-        pagination={{ 
+        pagination={{
           current: currentPage,
-          defaultPageSize: eventosPorPagina, 
-          showSizeChanger: true, 
+          defaultPageSize: eventosPorPagina,
+          showSizeChanger: true,
           pageSizeOptions: pageSizeOptions,
           onChange: (page, pageSize) => {
             setCurrentPage(page)
@@ -260,16 +282,16 @@ const EventosListado = () => {
       />
     )
   };
-   
-  function b64_to_utf8( str ) {
-    return decodeURIComponent(escape(window.atob( str )));
+
+  function b64_to_utf8(str) {
+    return decodeURIComponent(escape(window.atob(str)));
   };
 
   const guardarRegistro = async () => {
     try {
 
       const json = JSON.parse(textAreaData);
-      const accion =  b64_to_utf8(json.accion).split(".");  
+      const accion = b64_to_utf8(json.accion).split(".");
       const lista = json[json.tipo][accion[0]];
 
       const body = {
@@ -296,30 +318,30 @@ const EventosListado = () => {
       const usuarios = await obtenerUsuariosGrupo();
 
       const json = JSON.parse(textAreaData);
-      const accion =  b64_to_utf8(json.accion).split(".");  
+      const accion = b64_to_utf8(json.accion).split(".");
       const lista = json[json.tipo][accion[0]];
 
-      if( json?.tipo !==  evento?.redSocial?.toLowerCase() ) {
+      if (json?.tipo !== evento?.redSocial?.toLowerCase()) {
         message.warning({
           content: 'La red social es incorrecta',
         });
         return
       }
 
-      let resultado = {...evento.resultado};
-      for( let u = 0; u < usuarios?.length; u++ ) {
+      let resultado = { ...evento.resultado };
+      for (let u = 0; u < usuarios?.length; u++) {
         let usuarioTipo = usuarios[u][json.tipo]?.toLowerCase();
 
-        if( resultado[usuarios[u]?.uid] === undefined ) {
+        if (resultado[usuarios[u]?.uid] === undefined) {
           resultado[usuarios[u]?.uid] = [];
         }
 
-        if( usuarioTipo?.toLowerCase() ) {
-          for( let i = 0; i < lista.length; i++ ) {       
+        if (usuarioTipo?.toLowerCase()) {
+          for (let i = 0; i < lista.length; i++) {
             const nick = lista[i]?.replace("@", "").toLowerCase();
 
-            if(nick?.includes(usuarios[u][json.tipo])) {
-              if( !resultado[usuarios[u]?.uid].includes(accion[0]) ) {
+            if (nick?.includes(usuarios[u][json.tipo])) {
+              if (!resultado[usuarios[u]?.uid].includes(accion[0])) {
                 resultado[usuarios[u]?.uid].push(accion[0])
               }
             }
@@ -333,10 +355,10 @@ const EventosListado = () => {
       }
 
       await updateDoc(doc(firestore, "eventos", evento?.id), body);
-      if(evento?.tag){ 
-        history.push( url+'/resultado-grupo-evento?id='+evento?.id+"&tag="+evento?.tag);
-      } else  {
-        history.push( url+'/resultado?id='+evento?.id);
+      if (evento?.tag) {
+        history.push(url + '/resultado-grupo-evento?id=' + evento?.id + "&tag=" + evento?.tag);
+      } else {
+        history.push(url + '/resultado?id=' + evento?.id);
       }
       setVisible(false);
 
@@ -345,7 +367,7 @@ const EventosListado = () => {
       message.warning({
         content: 'Atención: hubo un problema al procesar la información',
       });
-    }  finally {
+    } finally {
       setProcesando(false);
     };
 
@@ -357,7 +379,7 @@ const EventosListado = () => {
     const _grupos = evento?.grupos;
 
     // Verificar que el evento no tenga grupos
-    if( _grupos?.length === 0 ) {
+    if (_grupos?.length === 0) {
       message.warning({
         content: 'Atención: el evento no tiene grupos.',
       });
@@ -365,27 +387,27 @@ const EventosListado = () => {
     };
 
     try {
-      
-      const q = query(collection(firestore, "usuarios"), where('grupos', 'array-contains-any',  _grupos ));
+
+      const q = query(collection(firestore, "usuarios"), where('grupos', 'array-contains-any', _grupos));
       const querySnapshot = await getDocs(q);
       const docs = []
 
       querySnapshot.forEach((doc) => {
         const data = doc.data();
-        if(data?.estatus) {
-          docs.push({ 
-            grupos: data?.grupos, 
-            facebook: data?.facebook?.toLowerCase().trim(), 
-            twitter: data?.twitter?.toLowerCase().trim(), 
+        if (data?.estatus) {
+          docs.push({
+            grupos: data?.grupos,
+            facebook: data?.facebook?.toLowerCase().trim(),
+            twitter: data?.twitter?.toLowerCase().trim(),
             instagram: data?.instagram?.toLowerCase().trim(),
-            telefono: data?.telefono, 
-            nombre: data?.nombre, 
+            telefono: data?.telefono,
+            nombre: data?.nombre,
             uid: data?.uid,
-            id:doc.id 
+            id: doc.id
           });
         }
       });
-    
+
       return docs;
 
     } catch (error) {
@@ -395,7 +417,7 @@ const EventosListado = () => {
   };
 
   const obtenerEnlaceYager = (item) => {
-    const url = REACT_APP_WEB_URL+'evento-laud?id='+item?.id;
+    const url = REACT_APP_WEB_URL + 'evento-laud?id=' + item?.id;
     navigator.clipboard.writeText(url);
     message.info({
       content: 'Se ha copiado el enlace al portapapeles.',
@@ -411,32 +433,32 @@ const EventosListado = () => {
       content: '¿Seguro que desea eliminar este registro?',
       onOk: async () => {
         try {
-          await updateDoc(doc(firestore, docs, item?.id), {estatus: false}); 
+          await updateDoc(doc(firestore, docs, item?.id), { estatus: false });
         } catch (error) {
           console.log('error al eliminar: ', error);
         } finally {
           window.location.reload(false);
         }
       },
-      onCancel() {},
+      onCancel() { },
     });
   };
 
   const onSearch = (searchValue) => {
     setSearchInput(searchValue);
-    if( searchValue !== '' ){
+    if (searchValue !== '') {
       const filteredData = eventos.filter((item) => {
         return Object.values(item).join('').toLowerCase().includes(searchValue.toLowerCase());
       })
       setFilteredResults(filteredData);
-    }else{
+    } else {
       setFilteredResults(eventos)
     }
   };
 
-  const obtenerRegistrosFirebase =  useCallback(async (coleccion) => {
+  const obtenerRegistrosFirebase = useCallback(async (coleccion) => {
 
-    if(!coleccion) {
+    if (!coleccion) {
       console.log('Se necesita coleccion');
       return
     }
@@ -447,7 +469,7 @@ const EventosListado = () => {
       const querySnapshot = await getDocs(q);
       const docs = [];
       querySnapshot.forEach((doc) => {
-        if( doc.data()?.estatus ) { 
+        if (doc.data()?.estatus) {
           docs.push({ ...doc.data(), id: doc.id });
         }
       });

src/views/administracion/grupos/GruposListado.js

@@ -1,20 +1,21 @@
 import React, { useEffect, useState } from 'react';
 import { Table, Modal } from 'antd';
 import { useHistory } from 'react-router-dom';
-import { 
+import {
   EditOutlined,
-  DeleteOutlined, 
+  DeleteOutlined,
   FileExcelOutlined,
   PlusCircleOutlined,
-  ExclamationCircleOutlined, 
-} 
-from "@ant-design/icons";
+  ExclamationCircleOutlined,
+}
+  from "@ant-design/icons";
 import moment from 'moment';
 import { firestore } from "../../../services/firebase";
 import exportarExcelJS from '../../../services/exportarExcel';
 import { ActionsButton } from '../../../components';
 import { SimpleTableLayout } from '../../../components/layouts'
 import { collection, onSnapshot, doc, updateDoc, getDocs, query, where } from "firebase/firestore";
+import { Link } from 'react-router-dom/cjs/react-router-dom';
 
 const GruposListado = () => {
 
@@ -23,11 +24,11 @@ const GruposListado = () => {
   const history = useHistory();
   const { confirm } = Modal;
 
-  const [ reporteCargando, setReporteCargando ] = useState(false)
-  const [ cargandoGrupos, setCargandoGrupos ] = useState(true);
-  const [ grupos, setGrupos ] = useState([]);
-  const [ filteredResults, setFilteredResults ] = useState([]);
-  const [ searchInput, setSearchInput ] = useState('');
+  const [reporteCargando, setReporteCargando] = useState(false)
+  const [cargandoGrupos, setCargandoGrupos] = useState(true);
+  const [grupos, setGrupos] = useState([]);
+  const [filteredResults, setFilteredResults] = useState([]);
+  const [searchInput, setSearchInput] = useState('');
 
   const defaultText = prop => prop || <span style={{ color: '#c7c3c3' }}>---</span>;
 
@@ -38,12 +39,12 @@ const GruposListado = () => {
       key: "id",
       align: "center",
       width: 100,
-      render: (_, item ) => (
+      render: (_, item) => (
         <ActionsButton
           key={item}
           options={[
             {
-              disabled: reporteCargando, 
+              disabled: reporteCargando,
               name: "Descargar reporte",
               icon: <FileExcelOutlined />,
               onClick: () => obtenerReporte(item)
@@ -51,7 +52,7 @@ const GruposListado = () => {
             {
               name: "Editar",
               icon: <EditOutlined />,
-              onClick: () => history.push(url+'/detalle?id='+item.id)
+              onClick: () => history.push(url + '/detalle?id=' + item.id)
             },
             {
               name: "Eliminar",
@@ -69,27 +70,37 @@ const GruposListado = () => {
       title: "Nombre",
       dataIndex: "nombre",
       key: "nombre",
-      render: defaultText,
+      render: (item, row) => (
+        <Link to={`${url}/detalle?id=${row.id}`} style={{ color: 'black' }}>
+          {defaultText(item)}
+        </Link>
+      ),
     },
     {
       title: "Ciudad",
       dataIndex: "ciudad",
       key: "ciudad",
-      render: defaultText,
+      render: (item, row) => (
+        <Link to={`${url}/detalle?id=${row.id}`} style={{ color: 'black' }}>
+          {defaultText(item)}
+        </Link>
+      ),
     },
     {
       title: "Creado",
       dataIndex: "timestamp",
       key: "timestamp",
       render: (_, item) => (
-        moment(item?.timestamp?.toDate()).format('DD-MM-YYYY')
+        <Link to={`${url}/detalle?id=${item.id}`} style={{ color: 'black' }}>
+          {moment(item?.timestamp?.toDate()).format('DD-MM-YYYY')}
+        </Link>
       ),
     },
   ];
-  
+
   const multipleButtonData = [{
     text: "Agregar",
-    to: () => history.push(url+'/nuevo'),
+    to: () => history.push(url + '/nuevo'),
     icon: <PlusCircleOutlined />,
     props: { disabled: false, type: 'primary', }
   }];
@@ -100,10 +111,10 @@ const GruposListado = () => {
       setReporteCargando(true);
       const idGrupo = item?.id;
 
-      const q = query( collection(firestore, "usuarios"), where('grupos', 'array-contains-any', [idGrupo]));
+      const q = query(collection(firestore, "usuarios"), where('grupos', 'array-contains-any', [idGrupo]));
       const querySnapshot = await getDocs(q);
       const docs = []
-      
+
       querySnapshot.forEach((doc) => {
         const data = doc.data();
         docs.push({
@@ -127,7 +138,7 @@ const GruposListado = () => {
         { title: 'Verificado', key: 'verificado' },
       ];
 
-      await exportarExcelJS(columnas, docs, 'reporte grupos', "Reporte Yager", 'Grupos', '/LAUD-Logotipo.png',"")
+      await exportarExcelJS(columnas, docs, 'reporte grupos', "Reporte Yager", 'Grupos', '/LAUD-Logotipo.png', "")
 
 
     } catch (error) {
@@ -139,7 +150,7 @@ const GruposListado = () => {
     } finally {
       setReporteCargando(false)
     }
-    
+
   };
 
   const eliminarRegistro = async (item) => {
@@ -149,49 +160,49 @@ const GruposListado = () => {
       content: '¿Seguro que desea eliminar este registro?',
       onOk: async () => {
         try {
-          await updateDoc(doc(firestore, "grupos", item.id), {estatus: false}); 
+          await updateDoc(doc(firestore, "grupos", item.id), { estatus: false });
         } catch (error) {
           console.log('error al eliminar: ', error);
         }
       },
-      onCancel() {},
+      onCancel() { },
     });
   };
 
-  const onSearch = (searchValue) =>  {
+  const onSearch = (searchValue) => {
     setSearchInput(searchValue);
-    if( searchValue !== '' ){
+    if (searchValue !== '') {
       const filteredData = grupos.filter((item) => {
         return Object.values(item).join('').toLowerCase().includes(searchValue.toLowerCase());
       })
       setFilteredResults(filteredData);
-    }else{
+    } else {
       setFilteredResults(grupos)
     }
   };
 
   // Grupos
-  useEffect (() => {  
+  useEffect(() => {
     try {
-      onSnapshot( collection(firestore, "grupos"), (querySnapshot) => {
-         const docs = [];
-         querySnapshot.forEach((doc) => {
-          if( doc.data().estatus ) {
-            docs.push({ ...doc.data(), id:doc.id });
+      onSnapshot(collection(firestore, "grupos"), (querySnapshot) => {
+        const docs = [];
+        querySnapshot.forEach((doc) => {
+          if (doc.data().estatus) {
+            docs.push({ ...doc.data(), id: doc.id });
           }
-         });
-         setGrupos(docs);
-       })
-     } catch (error) {
-       console.log('error al cargar eventos de firebase: ', error);
-     } finally {
-       setCargandoGrupos(false);
-     }
-  }, [] );
+        });
+        setGrupos(docs);
+      })
+    } catch (error) {
+      console.log('error al cargar eventos de firebase: ', error);
+    } finally {
+      setCargandoGrupos(false);
+    }
+  }, []);
 
 
   return (
-    <SimpleTableLayout 
+    <SimpleTableLayout
       title={titulo}
       multipleButtonData={multipleButtonData}
       onSearchClicked={onSearch}

src/views/administracion/usuarios/UsuariosListado.js

@@ -88,32 +88,38 @@ const UsuariosListado = () => {
       dataIndex: "nombre",
       key: "nombre",
       render: (_, item) => (
-        <Link to={url + "/detalle?id=" + item.id}>{item.nombre}</Link>
+        <Link to={url + "/detalle?id=" + item.id} style={{ color: 'black' }}>{item.nombre}</Link>
       ),
     },
     {
       title: "Ciudad",
       dataIndex: "ciudad",
       key: "ciudad",
-      render: defaultText,
+      render: (_, item) => (
+        <Link to={url + "/detalle?id=" + item.id} style={{ color: 'black' }}>{defaultText(item?.ciudad)}</Link>
+      ),
     },
     {
       title: "Fecha de verificación",
       dataIndex: "verificado",
       key: "verificado",
       render: (_, item) =>
-        item.verificado === "" ? (
-          <span style={{ color: "#c7c3c3" }}>---</span>
-        ) : (
-          moment(item?.verificado?.toDate()).format("DD-MM-YYYY")
-        ),
+        <Link to={url + "/detalle?id=" + item.id} style={{ color: 'black' }}>
+          {item.verificado === "" ? (
+            <span style={{ color: "#c7c3c3" }}>---</span>
+          ) : (
+            moment(item?.verificado?.toDate()).format("DD-MM-YYYY")
+          )},
+        </Link>
     },
     {
       title: "Registro",
       dataIndex: "timestamp",
       key: "timestamp",
       render: (_, item) =>
-        moment(item?.timestamp?.toDate()).format("DD-MM-YYYY"),
+        <Link to={url + "/detalle?id=" + item.id} style={{ color: 'black' }}>
+          {moment(item?.timestamp?.toDate()).format("DD-MM-YYYY")}
+        </Link>
     },
     {
       title: "Verificado",
@@ -231,7 +237,7 @@ const UsuariosListado = () => {
           console.log("error al eliminar: ", error);
         }
       },
-      onCancel() {},
+      onCancel() { },
     });
   };