From 72ea9d203304cb64e0ef8ff81b97c6d0b4efad5a Mon Sep 17 00:00:00 2001
From: Mariela <mbonilla.guti@gmail.com>
Date: Sat, 23 Jul 2022 23:54:05 -0600
Subject: [PATCH 1/7] obtener inquilinos api

---
 api-gateway/src/app.controller.ts               |  6 ++++++
 api-gateway/src/app.service.ts                  | 11 +++++++++++
 servicio-usuarios/src/users/users.controller.ts | 12 ++++++++++++
 servicio-usuarios/src/users/users.service.ts    | 11 +++++++++++
 4 files changed, 40 insertions(+)

diff --git a/api-gateway/src/app.controller.ts b/api-gateway/src/app.controller.ts
index 2d02bfe4..205c4339 100644
--- a/api-gateway/src/app.controller.ts
+++ b/api-gateway/src/app.controller.ts
@@ -77,6 +77,7 @@ export class AppController {
   allUsersAdminComunidad() {
     return this.appService.allUsersAdminComunidad();
   }
+
   @Get('user/findGuards/:community')
   findGuardsCommunity(
     @Param('community_id') community_id: string
@@ -84,6 +85,11 @@ export class AppController {
     return this.appService.findGuardsCommunity(community_id);
   }
 
+  @Get('user/findTenants')
+  allUsersTenants() {
+    return this.appService.allUsersTenants();
+  }
+  
   @Get('user/find/:dni')
   findUser(
     @Param('dni') paramUserDNI: string
diff --git a/api-gateway/src/app.service.ts b/api-gateway/src/app.service.ts
index 65ebd4f8..541d7907 100644
--- a/api-gateway/src/app.service.ts
+++ b/api-gateway/src/app.service.ts
@@ -95,6 +95,17 @@ export class AppService {
       );
   }
 
+  allUsersTenants() {
+    const pattern = { cmd: 'findTenants' };
+    const payload = {};
+    return this.clientUserApp
+      .send<string>(pattern, payload)
+      .pipe(
+        map((message: string) => ({ message })),
+      );
+  }
+  
+
   //GET parameter from API
   findUser(paramUserDNI: string) {
     const pattern = { cmd: 'findUserDNI' };
diff --git a/servicio-usuarios/src/users/users.controller.ts b/servicio-usuarios/src/users/users.controller.ts
index ea3c70a9..03fb4fcd 100644
--- a/servicio-usuarios/src/users/users.controller.ts
+++ b/servicio-usuarios/src/users/users.controller.ts
@@ -41,6 +41,18 @@ export class UsersController {
   }
   
 
+  @MessagePattern({ cmd: 'findTenantsCommunity' })
+  findTenantsCommunity(@Payload() community_id: string) {
+    let pcommunity_id = community_id['community_id'];
+    return this.userService.findTenantsCommunity(pcommunity_id);
+  }
+
+  @MessagePattern({ cmd: 'findTenants' })
+  findTenants() {
+    return this.userService.findTenants();
+  }
+
+
   @MessagePattern({ cmd: 'updateUser' })
   update(@Payload() user: UserDocument) {
     return this.userService.update(user.id, user);
diff --git a/servicio-usuarios/src/users/users.service.ts b/servicio-usuarios/src/users/users.service.ts
index edaf2ed0..e282108c 100644
--- a/servicio-usuarios/src/users/users.service.ts
+++ b/servicio-usuarios/src/users/users.service.ts
@@ -87,6 +87,17 @@ export class UsersService {
     return this.userModel.find({ user_type: 2 }).exec();
   }
 
+  
+  //find inquilinos
+  async findTenants(): Promise<User[]> {
+    return this.userModel.find({ user_type: 3 }).exec();
+  }
+
+  
+  //find inquilinos
+  async findTenantsCommunity(pcommunity_id: string): Promise<User[]> {
+    return this.userModel.find({ community_id: pcommunity_id, user_type: 4 }).exec();
+  }
 
   async testSendMail(user: UserDocument) {
     let passwordEncriptada = Md5.init(user.password);

From 305a343936dddfdc7af6cd86b2b584ad3bc744c6 Mon Sep 17 00:00:00 2001
From: Mariela <mbonilla.guti@gmail.com>
Date: Sat, 23 Jul 2022 23:54:26 -0600
Subject: [PATCH 2/7] set list inquilinos

---
 web-ui/web-react/src/components/Inquilinos.js | 34 +++++++++++++++++--
 1 file changed, 32 insertions(+), 2 deletions(-)

diff --git a/web-ui/web-react/src/components/Inquilinos.js b/web-ui/web-react/src/components/Inquilinos.js
index 608a0a6b..661af956 100644
--- a/web-ui/web-react/src/components/Inquilinos.js
+++ b/web-ui/web-react/src/components/Inquilinos.js
@@ -1,10 +1,40 @@
 import { Button } from 'primereact/button';
 import { Dropdown } from 'primereact/dropdown';
 import { InputText } from 'primereact/inputtext'
-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useState, useRef } from 'react'
+import { DataTable } from 'primereact/datatable';
+import { Column } from 'primereact/column';
+import { Dropdown } from 'primereact/dropdown';
+import { Toast } from 'primereact/toast';
+import classNames from 'classnames';
 
 const Inquilinos = () => {
   const [communitiesList, setCommunitiesList] = useState([]);
+  const [tenants, setTenants] = useState([]);
+
+  const [tenant, setTenant] = useState(emptyTenant);
+
+  let emptyTenant = {
+    _id: null,
+    dni: '',
+    name: '',
+    last_name: '',
+    email: '',
+    phone: '',
+    password: '',
+    user_type: '1',
+    community_id: '',
+    community_name: '',
+    number_house: '',
+    status: ''
+  };
+
+
+  async function getTenants() {
+
+  }
+
+
   const communityIdList = communitiesList.map(community => community.id);
   async function getCommunites() {
     let response = await fetch('http://localhost:4000/community/allCommunities', { method: 'GET' });
@@ -53,7 +83,7 @@ const Inquilinos = () => {
               <label htmlFor="numero_vivienda">Número de Vivienda</label>
               <Dropdown id="numero_vivienda" value={communityIdList[0]} options={communitiesList} />
             </div>
-          <Button label="Registrar" onClick={registrarInquilino} />
+            <Button label="Registrar" onClick={registrarInquilino} />
           </div>
         </div>
       </div>

From 9b8e324bf1748203a5324091452b1bcc261b2687 Mon Sep 17 00:00:00 2001
From: Mariela <mbonilla.guti@gmail.com>
Date: Sun, 24 Jul 2022 17:44:25 -0600
Subject: [PATCH 3/7] add get tenants

---
 .../components/AdministradoresComunidad.js    |  37 +----
 web-ui/web-react/src/components/Inquilinos.js | 150 ++++++++++++++++--
 2 files changed, 145 insertions(+), 42 deletions(-)

diff --git a/web-ui/web-react/src/components/AdministradoresComunidad.js b/web-ui/web-react/src/components/AdministradoresComunidad.js
index 06416d5d..6d6cdb34 100644
--- a/web-ui/web-react/src/components/AdministradoresComunidad.js
+++ b/web-ui/web-react/src/components/AdministradoresComunidad.js
@@ -152,10 +152,7 @@ const AdministradoresComunidad = () => {
         setDeleteAdminCommunityDialog(true);
     }
 
-    const confirmDeleteSelected = () => {
-        setDeleteAdminsCommunitiesDialog(true);
-    }
-
+   
     const actionsAdminCommunity = (rowData) => {
         return (
             <div className="actions">
@@ -164,34 +161,6 @@ const AdministradoresComunidad = () => {
         );
     }
 
-    const leftToolbarTemplate = () => {
-        return (
-            <React.Fragment>
-                <div className="my-2">
-                    <Button label="Eliminar" icon="pi pi-trash" className="p-button-danger" onClick={confirmDeleteSelected} disabled={!selectedAdminsCommunities || !selectedAdminsCommunities.length} />
-                </div>
-            </React.Fragment>
-        )
-    }
-
-    const rightToolbarTemplate = () => {
-        return (
-            <React.Fragment>
-                <Button label="Exportar" icon="pi pi-upload" className="p-button-help" />
-            </React.Fragment>
-        )
-    }
-
-
-    const header = (
-        <div className="flex flex-column md:flex-row md:justify-content-between md:align-items-center">
-            <h5 className="m-0">Administradores de Comunidades</h5>
-            <span className="block mt-2 md:mt-0 p-input-icon-left">
-                <i className="pi pi-search" />
-                <InputText type="search" onInput={(e) => setGlobalFilter(e.target.value)} placeholder="Buscar..." />
-            </span>
-        </div>
-    );
 
     const deleteAdminCommunityDialogFooter = (
         <>
@@ -346,9 +315,11 @@ const AdministradoresComunidad = () => {
         )
     }
 
+   
+
     const header = (
         <div className="flex flex-column md:flex-row md:justify-content-between md:align-items-center">
-            <h5 className="m-0">Administradores del sistema <i class="fal fa-user"></i></h5>
+            <h5 className="m-0">Administradores de Comunidades</h5>
             <span className="block mt-2 md:mt-0 p-input-icon-left">
                 <i className="pi pi-search" />
                 <InputText type="search" onInput={(e) => setGlobalFilter(e.target.value)} placeholder="Buscar..." />
diff --git a/web-ui/web-react/src/components/Inquilinos.js b/web-ui/web-react/src/components/Inquilinos.js
index 661af956..d4fdfae0 100644
--- a/web-ui/web-react/src/components/Inquilinos.js
+++ b/web-ui/web-react/src/components/Inquilinos.js
@@ -1,18 +1,35 @@
 import { Button } from 'primereact/button';
-import { Dropdown } from 'primereact/dropdown';
 import { InputText } from 'primereact/inputtext'
 import React, { useEffect, useState, useRef } from 'react'
 import { DataTable } from 'primereact/datatable';
 import { Column } from 'primereact/column';
 import { Dropdown } from 'primereact/dropdown';
 import { Toast } from 'primereact/toast';
-import classNames from 'classnames';
+import { Dialog } from 'primereact/dialog';
+import { Toolbar } from 'primereact/toolbar';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faHome } from '@fortawesome/free-solid-svg-icons';
+import { faUserAlt } from '@fortawesome/free-solid-svg-icons';
+import { faPhoneAlt } from '@fortawesome/free-solid-svg-icons';
+import { faAt } from '@fortawesome/free-solid-svg-icons';
+import { faIdCardAlt } from '@fortawesome/free-solid-svg-icons';
+import { faEllipsis } from '@fortawesome/free-solid-svg-icons';
+import { faHashtag } from '@fortawesome/free-solid-svg-icons';
+
+
 
 const Inquilinos = () => {
   const [communitiesList, setCommunitiesList] = useState([]);
+  const [communityId, setCommunityId] = useState(null);
   const [tenants, setTenants] = useState([]);
-
   const [tenant, setTenant] = useState(emptyTenant);
+  const [selectedAdministrators, setSelectedAdministrators] = useState(null);
+  const [globalFilter, setGlobalFilter] = useState(null);
+  const [deleteAdminSystemDialog, setDeleteAdminSystemDialog] = useState(false);
+  const [deleteAdminsSystemDialog, setDeleteAdminsSystemDialog] = useState(false);
+  const toast = useRef(null);
+  const dt = useRef(null);
+
 
   let emptyTenant = {
     _id: null,
@@ -31,20 +48,32 @@ const Inquilinos = () => {
 
 
   async function getTenants() {
-
+    let response = await fetch('http://localhost:4000/users/findTenants', { method: 'GET' });
+    let resJson = await response.json();
+    await resJson.message.map((item) => {
+      item.name = communitiesList.find(p => p.code === item.province).name
+      item.canton = cList.find(p => p.code === item.canton).name
+      item.district = dList.find(p => p.code === item.district).name
+      if (!item.id_admin) {
+          item.name_admin = "Sin Administrador"
+      }
+  })
   }
 
-
-  const communityIdList = communitiesList.map(community => community.id);
   async function getCommunites() {
     let response = await fetch('http://localhost:4000/community/allCommunities', { method: 'GET' });
-    let list = await response.json();
-    setCommunitiesList(list.message);
+    let resList = await response.json();
+    let list = await resList.message;
+    console.log(list);
+
+    setCommunitiesList(await list);
   }
 
   useEffect(() => {
     getCommunites();
   }, [])
+
+
   function registrarInquilino() {
     let data = {
       email: document.getElementById('correo_electronico').value,
@@ -69,6 +98,109 @@ const Inquilinos = () => {
     })
   }
 
+  const cList = communitiesList.map((item) => ({
+    label: item.name,
+    value: item.id,
+}))
+
+
+const actionsAdmin = (rowData) => {
+  return (
+      <div className="actions">
+          <Button icon="pi pi-trash" className="p-button-rounded p-button-danger mt-2" onClick={() => confirmDeleteAdminSystem(rowData)} />
+      </div>
+  );
+}
+
+const leftToolbarTemplate = () => {
+  return (
+      <React.Fragment>
+          <div className="my-2">
+              <Button label="Eliminar" icon="pi pi-trash" className="p-button-danger" onClick={confirmDeleteSelected} disabled={!selectedAdministrators || !selectedAdministrators.length} />
+          </div>
+      </React.Fragment>
+  )
+}
+
+const rightToolbarTemplate = () => {
+  return (
+      <React.Fragment>
+          <Button label="Exportar" icon="pi pi-upload" className="p-button-help" />
+      </React.Fragment>
+  )
+}
+
+const header = (
+  <div className="flex flex-column md:flex-row md:justify-content-between md:align-items-center">
+      <h5 className="m-0">Administradores del sistema</h5>
+      <span className="block mt-2 md:mt-0 p-input-icon-left">
+          <i className="pi pi-search" />
+          <InputText type="search" onInput={(e) => setGlobalFilter(e.target.value)} placeholder="Buscar..." />
+      </span>
+  </div>
+);
+
+const deleteAdminSystemDialogFooter = (
+  <>
+      <Button label="No" icon="pi pi-times" className="p-button-text" onClick={hideDeleteAdminSystemDialog} />
+      <Button label="Yes" icon="pi pi-check" className="p-button-text" onClick={deleteSysAdmin} />
+  </>
+);
+
+const deleteAdminsSystemDialogFooter = (
+  <>
+      <Button label="No" icon="pi pi-times" className="p-button-text" onClick={hideDeleteAdminsSystemsDialog} />
+      <Button label="Yes" icon="pi pi-check" className="p-button-text" onClick={deleteSelectedAdminsSystem} />
+  </>
+);
+
+const headerName = (
+  <>
+      <p> <FontAwesomeIcon icon={faUserAlt} style={{color: "#C08135"}} />  Nombre</p>
+  </>
+)
+
+const headerLastName = (
+  <>
+      <p> <FontAwesomeIcon icon={faUserAlt} style={{color: "#D7A86E"}} />    Apellidos</p>
+  </>
+)
+
+const headerDNI = (
+  <>
+      <p> <FontAwesomeIcon icon={faIdCardAlt} style={{color: "#C08135"}} />    Identificación</p>
+  </>
+)
+
+const headerEmail = (
+  <>
+      <p> <FontAwesomeIcon icon={faAt} style={{color: "#D7A86E"}} />    Correo Electrónico</p>
+  </>
+)
+
+const headerPhone = (
+  <>
+      <p> <FontAwesomeIcon icon={faPhoneAlt} style={{color: "#C08135"}} />   Teléfono</p>
+  </>
+)
+
+const headerCommuntiy = (
+  <>
+      <p> <FontAwesomeIcon icon={faHome} style={{ color: "#D7A86E" }} />   Comunidad</p>
+  </>
+)
+
+const headerNumberHouse = (
+  <>
+      <p> <FontAwesomeIcon icon={faHashtag} style={{ color: "#C08135" }} />   Número de vivienda</p>
+  </>
+)
+
+const headerOptions = (
+  <>
+      <p>Opciones <FontAwesomeIcon icon={faEllipsis} style={{ color: "#D7A86E" }} /></p>
+  </>
+)
   return (
     <div className="grid">
       <div className="col-12">
@@ -81,7 +213,7 @@ const Inquilinos = () => {
             </div>
             <div className="p-field col-12 md:col-6">
               <label htmlFor="numero_vivienda">Número de Vivienda</label>
-              <Dropdown id="numero_vivienda" value={communityIdList[0]} options={communitiesList} />
+              <Dropdown id="numero_vivienda" value={communityId} options={cList} />
             </div>
             <Button label="Registrar" onClick={registrarInquilino} />
           </div>

From 8ff8382d548710c30341568116ff657cedf9f283 Mon Sep 17 00:00:00 2001
From: Mariela <mbonilla.guti@gmail.com>
Date: Sun, 31 Jul 2022 18:19:20 -0600
Subject: [PATCH 4/7] listar inquilinos de una comunidad

---
 api-gateway/src/app.controller.ts             |   6 +-
 api-gateway/src/app.service.ts                |   7 +
 web-ui/web-react/package-lock.json            | 125 +++++++
 web-ui/web-react/package.json                 |   1 +
 .../components/AdministradoresComunidad.js    |   5 +-
 web-ui/web-react/src/components/Inquilinos.js | 331 +++++++++++++-----
 web-ui/web-react/src/index.js                 |   5 +-
 7 files changed, 388 insertions(+), 92 deletions(-)

diff --git a/api-gateway/src/app.controller.ts b/api-gateway/src/app.controller.ts
index 05c15dd9..b1910262 100644
--- a/api-gateway/src/app.controller.ts
+++ b/api-gateway/src/app.controller.ts
@@ -108,9 +108,9 @@ export class AppController {
     return this.appService.findGuardsCommunity(community_id);
   }
 
-  @Get('user/findTenants')
-  allUsersTenants() {
-    return this.appService.allUsersTenants();
+  @Get('user/findTenants/:community_id')
+  allUsersTenants(@Param('community_id') paramCommunity_id: string) {
+    return this.appService.findTenantsCommunity(paramCommunity_id);
   }
   
   @Get('user/find/:dni')
diff --git a/api-gateway/src/app.service.ts b/api-gateway/src/app.service.ts
index 5fab9782..2f5102f5 100644
--- a/api-gateway/src/app.service.ts
+++ b/api-gateway/src/app.service.ts
@@ -147,6 +147,13 @@ export class AppService {
       .pipe(map((message: string) => ({ message })));
   }
 
+  findTenantsCommunity(community_id: string) {
+    const pattern = { cmd: 'findTenantsCommunity' };
+    const payload = { community_id: community_id };
+    return this.clientUserApp
+      .send<string>(pattern, payload)
+      .pipe(map((message: string) => ({ message })));
+  }
 
   deleteAdminSystem(id: string) {
     const pattern = { cmd: 'deleteAdminSystem' };
diff --git a/web-ui/web-react/package-lock.json b/web-ui/web-react/package-lock.json
index 5ddda7d4..e9ff9cd3 100644
--- a/web-ui/web-react/package-lock.json
+++ b/web-ui/web-react/package-lock.json
@@ -27,6 +27,7 @@
                 "prismjs": "1.9.0",
                 "react": "^17.0.1",
                 "react-app-polyfill": "^1.0.6",
+                "react-cookie": "^4.1.1",
                 "react-dom": "^17.0.1",
                 "react-router-dom": "^5.2.0",
                 "react-scripts": "3.4.1",
@@ -2475,6 +2476,11 @@
                 "@babel/types": "^7.3.0"
             }
         },
+        "node_modules/@types/cookie": {
+            "version": "0.3.3",
+            "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.3.3.tgz",
+            "integrity": "sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow=="
+        },
         "node_modules/@types/eslint-visitor-keys": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/@types/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz",
@@ -2489,6 +2495,15 @@
                 "@types/node": "*"
             }
         },
+        "node_modules/@types/hoist-non-react-statics": {
+            "version": "3.3.1",
+            "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
+            "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
+            "dependencies": {
+                "@types/react": "*",
+                "hoist-non-react-statics": "^3.3.0"
+            }
+        },
         "node_modules/@types/istanbul-lib-coverage": {
             "version": "2.0.4",
             "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz",
@@ -2531,11 +2546,31 @@
             "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.0.tgz",
             "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA=="
         },
+        "node_modules/@types/prop-types": {
+            "version": "15.7.5",
+            "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
+            "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
+        },
         "node_modules/@types/q": {
             "version": "1.5.5",
             "resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.5.tgz",
             "integrity": "sha512-L28j2FcJfSZOnL1WBjDYp2vUHCeIFlyYI/53EwD/rKUBQ7MtUUfbQWiyKJGpcnv4/WgrhWsFKrcPstcAt/J0tQ=="
         },
+        "node_modules/@types/react": {
+            "version": "18.0.15",
+            "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.15.tgz",
+            "integrity": "sha512-iz3BtLuIYH1uWdsv6wXYdhozhqj20oD4/Hk2DNXIn1kFsmp9x8d9QB6FnPhfkbhd2PgEONt9Q1x/ebkwjfFLow==",
+            "dependencies": {
+                "@types/prop-types": "*",
+                "@types/scheduler": "*",
+                "csstype": "^3.0.2"
+            }
+        },
+        "node_modules/@types/scheduler": {
+            "version": "0.16.2",
+            "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
+            "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
+        },
         "node_modules/@types/stack-utils": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-1.0.1.tgz",
@@ -13402,6 +13437,19 @@
                 "node": ">=6"
             }
         },
+        "node_modules/react-cookie": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/react-cookie/-/react-cookie-4.1.1.tgz",
+            "integrity": "sha512-ffn7Y7G4bXiFbnE+dKhHhbP+b8I34mH9jqnm8Llhj89zF4nPxPutxHT1suUqMeCEhLDBI7InYwf1tpaSoK5w8A==",
+            "dependencies": {
+                "@types/hoist-non-react-statics": "^3.0.1",
+                "hoist-non-react-statics": "^3.0.0",
+                "universal-cookie": "^4.0.0"
+            },
+            "peerDependencies": {
+                "react": ">= 16.3.0"
+            }
+        },
         "node_modules/react-dev-utils": {
             "version": "10.2.1",
             "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-10.2.1.tgz",
@@ -16599,6 +16647,23 @@
                 "imurmurhash": "^0.1.4"
             }
         },
+        "node_modules/universal-cookie": {
+            "version": "4.0.4",
+            "resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-4.0.4.tgz",
+            "integrity": "sha512-lbRVHoOMtItjWbM7TwDLdl8wug7izB0tq3/YVKhT/ahB4VDvWMyvnADfnJI8y6fSvsjh51Ix7lTGC6Tn4rMPhw==",
+            "dependencies": {
+                "@types/cookie": "^0.3.3",
+                "cookie": "^0.4.0"
+            }
+        },
+        "node_modules/universal-cookie/node_modules/cookie": {
+            "version": "0.4.2",
+            "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
+            "integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
         "node_modules/universalify": {
             "version": "0.1.2",
             "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
@@ -19769,6 +19834,11 @@
                 "@babel/types": "^7.3.0"
             }
         },
+        "@types/cookie": {
+            "version": "0.3.3",
+            "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.3.3.tgz",
+            "integrity": "sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow=="
+        },
         "@types/eslint-visitor-keys": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/@types/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz",
@@ -19783,6 +19853,15 @@
                 "@types/node": "*"
             }
         },
+        "@types/hoist-non-react-statics": {
+            "version": "3.3.1",
+            "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
+            "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
+            "requires": {
+                "@types/react": "*",
+                "hoist-non-react-statics": "^3.3.0"
+            }
+        },
         "@types/istanbul-lib-coverage": {
             "version": "2.0.4",
             "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz",
@@ -19825,11 +19904,31 @@
             "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.0.tgz",
             "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA=="
         },
+        "@types/prop-types": {
+            "version": "15.7.5",
+            "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
+            "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
+        },
         "@types/q": {
             "version": "1.5.5",
             "resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.5.tgz",
             "integrity": "sha512-L28j2FcJfSZOnL1WBjDYp2vUHCeIFlyYI/53EwD/rKUBQ7MtUUfbQWiyKJGpcnv4/WgrhWsFKrcPstcAt/J0tQ=="
         },
+        "@types/react": {
+            "version": "18.0.15",
+            "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.15.tgz",
+            "integrity": "sha512-iz3BtLuIYH1uWdsv6wXYdhozhqj20oD4/Hk2DNXIn1kFsmp9x8d9QB6FnPhfkbhd2PgEONt9Q1x/ebkwjfFLow==",
+            "requires": {
+                "@types/prop-types": "*",
+                "@types/scheduler": "*",
+                "csstype": "^3.0.2"
+            }
+        },
+        "@types/scheduler": {
+            "version": "0.16.2",
+            "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
+            "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
+        },
         "@types/stack-utils": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-1.0.1.tgz",
@@ -28396,6 +28495,16 @@
                 "whatwg-fetch": "^3.0.0"
             }
         },
+        "react-cookie": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/react-cookie/-/react-cookie-4.1.1.tgz",
+            "integrity": "sha512-ffn7Y7G4bXiFbnE+dKhHhbP+b8I34mH9jqnm8Llhj89zF4nPxPutxHT1suUqMeCEhLDBI7InYwf1tpaSoK5w8A==",
+            "requires": {
+                "@types/hoist-non-react-statics": "^3.0.1",
+                "hoist-non-react-statics": "^3.0.0",
+                "universal-cookie": "^4.0.0"
+            }
+        },
         "react-dev-utils": {
             "version": "10.2.1",
             "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-10.2.1.tgz",
@@ -30926,6 +31035,22 @@
                 "imurmurhash": "^0.1.4"
             }
         },
+        "universal-cookie": {
+            "version": "4.0.4",
+            "resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-4.0.4.tgz",
+            "integrity": "sha512-lbRVHoOMtItjWbM7TwDLdl8wug7izB0tq3/YVKhT/ahB4VDvWMyvnADfnJI8y6fSvsjh51Ix7lTGC6Tn4rMPhw==",
+            "requires": {
+                "@types/cookie": "^0.3.3",
+                "cookie": "^0.4.0"
+            },
+            "dependencies": {
+                "cookie": {
+                    "version": "0.4.2",
+                    "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
+                    "integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA=="
+                }
+            }
+        },
         "universalify": {
             "version": "0.1.2",
             "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
diff --git a/web-ui/web-react/package.json b/web-ui/web-react/package.json
index 876ccccc..12dd1f1d 100644
--- a/web-ui/web-react/package.json
+++ b/web-ui/web-react/package.json
@@ -27,6 +27,7 @@
         "prismjs": "1.9.0",
         "react": "^17.0.1",
         "react-app-polyfill": "^1.0.6",
+        "react-cookie": "^4.1.1",
         "react-dom": "^17.0.1",
         "react-router-dom": "^5.2.0",
         "react-scripts": "3.4.1",
diff --git a/web-ui/web-react/src/components/AdministradoresComunidad.js b/web-ui/web-react/src/components/AdministradoresComunidad.js
index 37c4dae6..3e8b8aa9 100644
--- a/web-ui/web-react/src/components/AdministradoresComunidad.js
+++ b/web-ui/web-react/src/components/AdministradoresComunidad.js
@@ -75,7 +75,6 @@ const AdministradoresComunidad = () => {
         let response = await fetch('http://localhost:4000/community/allCommunities', { method: 'GET' });
         let resList = await response.json();
         let list = await resList.message;
-        console.log(list);
 
         setCommunitiesList(await list);
     }
@@ -323,7 +322,7 @@ const AdministradoresComunidad = () => {
         <>
             <p> {' '}
                 <FontAwesomeIcon icon={faAt} style={{ color: "#D7A86E" }} />{' '}
-                Correo Electrónic
+                Correo Electrónico
             </p>
         </>
     )
@@ -389,7 +388,7 @@ const AdministradoresComunidad = () => {
                         <Column field="dni" sortable header={headerDNI} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}>
                         </Column>
                         <Column field="email" sortable header={headerEmail} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
-                        <Column field="phone" sortable header={headerPhone} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
+                        <Column field="phone" header={headerPhone} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
                         <Column field="community_name" header={headerCommuntiy} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
                         <Column header={headerOptions} style={{ flexGrow: 1, flexBasis: '130px', minWidth: '130px' }} body={actionsAdminCommunity}></Column>
                     </DataTable>
diff --git a/web-ui/web-react/src/components/Inquilinos.js b/web-ui/web-react/src/components/Inquilinos.js
index 17f65d12..221a30d5 100644
--- a/web-ui/web-react/src/components/Inquilinos.js
+++ b/web-ui/web-react/src/components/Inquilinos.js
@@ -4,8 +4,6 @@ import React, { useEffect, useState, useRef } from 'react'
 import { DataTable } from 'primereact/datatable';
 import { Column } from 'primereact/column';
 import { Dropdown } from 'primereact/dropdown';
-import { InputText } from 'primereact/inputtext';
-import React, { useEffect, useState } from 'react';
 import { Toast } from 'primereact/toast';
 import { Dialog } from 'primereact/dialog';
 import { Toolbar } from 'primereact/toolbar';
@@ -18,24 +16,70 @@ import { faIdCardAlt } from '@fortawesome/free-solid-svg-icons';
 import { faEllipsis } from '@fortawesome/free-solid-svg-icons';
 import { faHashtag } from '@fortawesome/free-solid-svg-icons';
 
+import { useCookies } from "react-cookie";
 
 
 const Inquilinos = () => {
+
+  let emptyTenant = {
+    _id: null,
+    dni: '',
+    name: '',
+    last_name: '',
+    email: '',
+    phone: '',
+    password: '',
+    community_id: '',
+    community_name: '',
+    user_type: '4',
+    date_entry: new Date(),
+    status: '1'
+  };
+
+  const [tenants, setTenants] = useState([]);
+  const [tenant, setTenant] = useState(emptyTenant);
+  const [selectedTentants, setSelectedTenants] = useState(null);
+  const [globalFilter, setGlobalFilter] = useState(null);
+  const [deleteTenantDialog, setDeleteTenantDialog] = useState(false);
+  const [deleteTenantsDialog, setDeleteTenantsDialog,] = useState(false);
   const [communitiesList, setCommunitiesList] = useState([]);
-  const communityIdList = communitiesList.map((community) => community.id);
+  const [communityId, setCommunityId] = useState(null);
+  const [submitted, setSubmitted] = useState(false);
+  const toast = useRef(null);
+  const dt = useRef(null);
+
+  const [cookies, setCookie] = useCookies();
+
+
+  async function tenantsList() {
+    await fetch(`http://localhost:4000/user/findTenants/${cookies.community_id}`, { method: 'GET' })
+      .then((response) => response.json())
+      .then(data => data.message)
+      .then(data => setTenants(data));
+  }
+
+
   async function getCommunites() {
-    let response = await fetch(
-      'http://localhost:4000/community/allCommunities',
-      { method: 'GET' },
-    );
-    let list = await response.json();
+    let response = await fetch('http://localhost:4000/community/allCommunities', { method: 'GET' });
+    let resList = await response.json();
+    let list = await resList.message;
+
     setCommunitiesList(await list);
   }
 
+  useEffect(() => {
+    tenantsList();
+  }, [])
+
+
   useEffect(() => {
     getCommunites();
   }, [])
 
+  const cList = communitiesList.map((item) => ({
+    label: item.name,
+    value: item._id,
+  }))
 
   function registrarInquilino() {
     let data = {
@@ -66,111 +110,228 @@ const Inquilinos = () => {
     });
   }
 
-  const cList = communitiesList.map((item) => ({
-    label: item.name,
-    value: item.id,
-}))
+  const deleteTenant = () => {
+    /*   fetch('http://localhost:4000/community/deleteCommunity/' + community._id, {
+           cache: 'no-cache',
+           method: 'DELETE',
+           headers: {
+               'Content-Type': 'application/json'
+           }
+       })
+           .then(
+               function (response) {
+                   if (response.status != 201)
+                       console.log('Ocurrió un error con el servicio: ' + response.status);
+                   else
+                       return response.json();
+               }
+           )
+           .then(
+               function (response) {
+                   
+                   let _community = communities.filter(val => val._id !== community._id);
+                   setCommunities(_community);
+                   setDeleteCommunityDialog(false);
+                   setCommunity(emptyCommunity);
+                   toast.current.show({ severity: 'success', summary: 'Exito', detail: 'Comunidad de Viviendas Eliminada', life: 3000 });
+               }
+           )
+           .catch(
+               err => {
+                   console.log('Ocurrió un error con el fetch', err)
+                   toast.current.show({ severity: 'danger', summary: 'Error', detail: 'Comunidad de Viviendas no se pudo eliminar', life: 3000 });
+               }
+           ); 
+    */
+    let _tenants = tenants.filter(
+      (val) => val._id !== tenant._id,
+    );
+    setTenants(_tenants);
+    setDeleteTenantDialog(false);
+    setTenant(emptyTenant);
+    toast.current.show({
+      severity: 'success',
+      summary: 'Inquilino Eliminado',
+      life: 3000,
+    });
+  };
+
+  const deleteSelectedTenants = () => {
+    let _tenants = tenants.filter(
+      (val) => !selectedTentants.includes(val),
+    );
+    /*  selectedCommunities.map((item) => {
+             fetch('http://localhost:4000/user/deleteCommunity/' + item._id, {
+                 cache: 'no-cache',
+                 method: 'DELETE',
+                 headers: {
+                     'Content-Type': 'application/json'
+                 }
+             })
+         })*/
+    setTenants(_tenants);
+    setDeleteTenantsDialog(false);
+    setSelectedTenants(null);
+    toast.current.show({
+      severity: 'success',
+      summary: 'Éxito',
+      detail: 'Inquilinos Eliminados',
+      life: 3000,
+    });
+  };
 
 
-const actionsAdmin = (rowData) => {
-  return (
+  const hideDeleteTenantDialog = () => {
+    setDeleteTenantDialog(false);
+  }
+
+  const hideDeleteTenantsDialog = () => {
+    setDeleteTenantsDialog(false);
+  }
+
+  const confirmDeleteTenant = (tenant) => {
+    setTenant(tenant);
+    setDeleteTenantDialog(true);
+  }
+
+  const confirmDeleteSelected = () => {
+    setDeleteTenantsDialog(true);
+  };
+
+
+  const actionsTenant = (rowData) => {
+    return (
       <div className="actions">
-          <Button icon="pi pi-trash" className="p-button-rounded p-button-danger mt-2" onClick={() => confirmDeleteAdminSystem(rowData)} />
+        <Button icon="pi pi-trash" className="p-button-rounded p-button-danger mt-2" onClick={() => confirmDeleteTenant(rowData)} />
       </div>
-  );
-}
+    );
+  }
 
-const leftToolbarTemplate = () => {
-  return (
+  const leftToolbarTemplate = () => {
+    return (
       <React.Fragment>
-          <div className="my-2">
-              <Button label="Eliminar" icon="pi pi-trash" className="p-button-danger" onClick={confirmDeleteSelected} disabled={!selectedAdministrators || !selectedAdministrators.length} />
-          </div>
+        <div className="my-2">
+          <Button label="Eliminar" icon="pi pi-trash" className="p-button-danger" onClick={confirmDeleteSelected} disabled={!selectedTentants || !selectedTentants.length} />
+        </div>
       </React.Fragment>
-  )
-}
+    )
+  }
 
-const rightToolbarTemplate = () => {
-  return (
+  const rightToolbarTemplate = () => {
+    return (
       <React.Fragment>
-          <Button label="Exportar" icon="pi pi-upload" className="p-button-help" />
+        <Button label="Exportar" icon="pi pi-upload" className="p-button-help" />
       </React.Fragment>
-  )
-}
+    )
+  }
 
-const header = (
-  <div className="flex flex-column md:flex-row md:justify-content-between md:align-items-center">
-      <h5 className="m-0">Administradores del sistema</h5>
+  const header = (
+    <div className="flex flex-column md:flex-row md:justify-content-between md:align-items-center">
+      <h5 className="m-0">Inquilinos</h5>
       <span className="block mt-2 md:mt-0 p-input-icon-left">
-          <i className="pi pi-search" />
-          <InputText type="search" onInput={(e) => setGlobalFilter(e.target.value)} placeholder="Buscar..." />
+        <i className="pi pi-search" />
+        <InputText type="search" onInput={(e) => setGlobalFilter(e.target.value)} placeholder="Buscar..." />
       </span>
-  </div>
-);
+    </div>
+  );
 
-const deleteAdminSystemDialogFooter = (
-  <>
-      <Button label="No" icon="pi pi-times" className="p-button-text" onClick={hideDeleteAdminSystemDialog} />
-      <Button label="Yes" icon="pi pi-check" className="p-button-text" onClick={deleteSysAdmin} />
-  </>
-);
+  const deleteTenantDialogFooter = (
+    <>
+      <Button label="No" icon="pi pi-times" className="p-button-text" onClick={hideDeleteTenantDialog} />
+      <Button label="Yes" icon="pi pi-check" className="p-button-text" onClick={deleteTenant} />
+    </>
+  );
 
-const deleteAdminsSystemDialogFooter = (
-  <>
-      <Button label="No" icon="pi pi-times" className="p-button-text" onClick={hideDeleteAdminsSystemsDialog} />
-      <Button label="Yes" icon="pi pi-check" className="p-button-text" onClick={deleteSelectedAdminsSystem} />
-  </>
-);
+  const deleteTenantsDialogFooter = (
+    <>
+      <Button label="No" icon="pi pi-times" className="p-button-text" onClick={hideDeleteTenantsDialog} />
+      <Button label="Yes" icon="pi pi-check" className="p-button-text" onClick={deleteSelectedTenants} />
+    </>
+  );
 
-const headerName = (
-  <>
-      <p> <FontAwesomeIcon icon={faUserAlt} style={{color: "#C08135"}} />  Nombre</p>
-  </>
-)
+  const headerName = (
+    <>
+      <p> <FontAwesomeIcon icon={faUserAlt} style={{ color: "#C08135" }} />  Nombre</p>
+    </>
+  )
 
-const headerLastName = (
-  <>
-      <p> <FontAwesomeIcon icon={faUserAlt} style={{color: "#D7A86E"}} />    Apellidos</p>
-  </>
-)
+  const headerLastName = (
+    <>
+      <p> <FontAwesomeIcon icon={faUserAlt} style={{ color: "#D7A86E" }} />    Apellidos</p>
+    </>
+  )
 
-const headerDNI = (
-  <>
-      <p> <FontAwesomeIcon icon={faIdCardAlt} style={{color: "#C08135"}} />    Identificación</p>
-  </>
-)
+  const headerDNI = (
+    <>
+      <p> <FontAwesomeIcon icon={faIdCardAlt} style={{ color: "#C08135" }} />    Identificación</p>
+    </>
+  )
 
-const headerEmail = (
-  <>
-      <p> <FontAwesomeIcon icon={faAt} style={{color: "#D7A86E"}} />    Correo Electrónico</p>
-  </>
-)
+  const headerEmail = (
+    <>
+      <p> <FontAwesomeIcon icon={faAt} style={{ color: "#D7A86E" }} />    Correo Electrónico</p>
+    </>
+  )
 
-const headerPhone = (
-  <>
-      <p> <FontAwesomeIcon icon={faPhoneAlt} style={{color: "#C08135"}} />   Teléfono</p>
-  </>
-)
+  const headerPhone = (
+    <>
+      <p> <FontAwesomeIcon icon={faPhoneAlt} style={{ color: "#C08135" }} />   Teléfono</p>
+    </>
+  )
 
-const headerCommuntiy = (
-  <>
+  const headerCommuntiy = (
+    <>
       <p> <FontAwesomeIcon icon={faHome} style={{ color: "#D7A86E" }} />   Comunidad</p>
-  </>
-)
+    </>
+  )
 
-const headerNumberHouse = (
-  <>
+  const headerNumberHouse = (
+    <>
       <p> <FontAwesomeIcon icon={faHashtag} style={{ color: "#C08135" }} />   Número de vivienda</p>
-  </>
-)
+    </>
+  )
 
-const headerOptions = (
-  <>
+  const headerOptions = (
+    <>
       <p>Opciones <FontAwesomeIcon icon={faEllipsis} style={{ color: "#D7A86E" }} /></p>
-  </>
-)
+    </>
+  )
   return (
     <div className="grid">
+      <div className="col-12">
+        <Toast ref={toast} />
+        <div className="card">
+          <Toolbar className="mb-4" left={leftToolbarTemplate} right={rightToolbarTemplate}></Toolbar>
+          <DataTable ref={dt} value={tenants} dataKey="_id" paginator rows={5} selection={selectedTentants} onSelectionChange={(e) => setSelectedTenants(e.value)}
+            scrollable scrollHeight="400px" scrollDirection="both" header={header}
+            rowsPerPageOptions={[5, 10, 25]} className="datatable-responsive mt-3"
+            paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
+            currentPageReportTemplate="Mostrando {first} a {last} de {totalRecords} inquilinos"
+            globalFilter={globalFilter} emptyMessage="No hay inquilinos en esta comunidad registrados.">
+            <Column selectionMode="multiple" headerStyle={{ width: '3rem' }}></Column>
+            <Column field="name" sortable header={headerName} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
+            <Column field="last_name" sortable header={headerLastName} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }} alignFrozen="left"></Column>
+            <Column field="dni" sortable header={headerDNI} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}>
+            </Column>
+            <Column field="email" sortable header={headerEmail} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
+            <Column field="phone" header={headerPhone} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
+            <Column field="community_name" header={headerCommuntiy} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
+            <Column header={headerOptions} style={{ flexGrow: 1, flexBasis: '130px', minWidth: '130px' }} body={actionsTenant}></Column>
+          </DataTable>
+          <Dialog visible={deleteTenantDialog} style={{ width: '450px' }} header="Confirmar" modal footer={deleteTenantDialogFooter} onHide={hideDeleteTenantDialog}>
+            <div className="flex align-items-center justify-content-center">
+              <i className="pi pi-exclamation-triangle mr-3" style={{ fontSize: '2rem' }} />
+              {tenant && <span>¿Estás seguro que desea eliminar a <b>{tenant.name}</b>?</span>}
+            </div>
+          </Dialog>
+          <Dialog visible={deleteTenantsDialog} style={{ width: '450px' }} header="Confirmar" modal footer={deleteTenantsDialogFooter} onHide={hideDeleteTenantsDialog}>
+            <div className="flex align-items-center justify-content-center">
+              <i className="pi pi-exclamation-triangle mr-3" style={{ fontSize: '2rem' }} />
+              {selectedTentants && <span>¿Está seguro eliminar los Inquilinos seleccionados?</span>}
+            </div>
+          </Dialog>
+        </div>
+      </div>
       <div className="col-12">
         <div className="card">
           <h5 className="card-header">Registrar Inquilino</h5>
diff --git a/web-ui/web-react/src/index.js b/web-ui/web-react/src/index.js
index 9a5f6b56..895cf3a2 100644
--- a/web-ui/web-react/src/index.js
+++ b/web-ui/web-react/src/index.js
@@ -5,11 +5,14 @@ import App from './App';
 //import * as serviceWorker from './serviceWorker';
 import { HashRouter } from 'react-router-dom';
 import ScrollToTop from './ScrollToTop';
+import { CookiesProvider } from "react-cookie";
 
 ReactDOM.render(
   <HashRouter>
     <ScrollToTop>
-      <App></App>
+      <CookiesProvider>
+        <App></App>
+      </CookiesProvider>
     </ScrollToTop>
   </HashRouter>,
   document.getElementById('root'),

From 9cac88f333d7c9e0e5b4baa469e37e7516aefa41 Mon Sep 17 00:00:00 2001
From: Mariela <mbonilla.guti@gmail.com>
Date: Sun, 31 Jul 2022 18:34:26 -0600
Subject: [PATCH 5/7] function para obtener los numeros de casas de los
 inquilinos

---
 .../src/schemas/house.schema.ts               |  2 +-
 servicio-usuarios/src/users/users.service.ts  | 57 ++++++++++++-------
 2 files changed, 39 insertions(+), 20 deletions(-)

diff --git a/servicio-comunidad-viviendas/src/schemas/house.schema.ts b/servicio-comunidad-viviendas/src/schemas/house.schema.ts
index d85c31c6..75aeda0f 100644
--- a/servicio-comunidad-viviendas/src/schemas/house.schema.ts
+++ b/servicio-comunidad-viviendas/src/schemas/house.schema.ts
@@ -7,7 +7,7 @@ import { Tenant, TenantSchema } from './tenant.schema';
 @Schema()
 export class House extends Document {
   @Prop({ default: ' ' })
-  number_house: string;
+  number: string;
 
   @Prop({ default: 'desocupada' })
   state: string;
diff --git a/servicio-usuarios/src/users/users.service.ts b/servicio-usuarios/src/users/users.service.ts
index 2a33b593..6ff98cf6 100644
--- a/servicio-usuarios/src/users/users.service.ts
+++ b/servicio-usuarios/src/users/users.service.ts
@@ -25,24 +25,26 @@ export class UsersService {
 
 
   async createAdminCommunity(user: UserDocument) {
-      let password = user.password;
-      let passwordEncriptada = Md5.init(user.password);
-      user.password = passwordEncriptada;
+    let password = user.password;
+    let passwordEncriptada = Md5.init(user.password);
+    user.password = passwordEncriptada;
 
-       this.userModel.create(user)
-        
+    this.userModel.create(user)
 
-      let community = await this.findCommunity(user.community_id);
-      user.community_id = community['name'];
-  
-      const pattern = { cmd: 'emailCreateUserAdminCommunity' };
-      const payload = { email: user['email'], password: password, name: user['name'], 
-      date_entry: user['date_entry'], community_name: community['name'] };
-      return this.clientNotificationtApp
-        .send<string>(pattern, payload)
-        .pipe(
-          map((message: string) => ({ message })),
-        );
+
+    let community = await this.findCommunity(user.community_id);
+    user.community_id = community['name'];
+
+    const pattern = { cmd: 'emailCreateUserAdminCommunity' };
+    const payload = {
+      email: user['email'], password: password, name: user['name'],
+      date_entry: user['date_entry'], community_name: community['name']
+    };
+    return this.clientNotificationtApp
+      .send<string>(pattern, payload)
+      .pipe(
+        map((message: string) => ({ message })),
+      );
   }
 
   async findCommunity(community_id: string) {
@@ -117,16 +119,19 @@ export class UsersService {
     return this.userModel.find({ user_type: 2 }).exec();
   }
 
-  
+
   //find inquilinos
   async findTenants(): Promise<User[]> {
     return this.userModel.find({ user_type: 3 }).exec();
   }
 
-  
+
   //find inquilinos
   async findTenantsCommunity(pcommunity_id: string): Promise<User[]> {
-    return this.userModel.find({ community_id: pcommunity_id, user_type: 4 }).exec();
+    let houses = await this.findCommunityHouses(pcommunity_id);
+
+    return this.userModel.find({ community_id: pcommunity_id, user_type: 4 }).exec()
+    .then();
   }
 
   async testSendMail(user: UserDocument) {
@@ -174,5 +179,19 @@ export class UsersService {
     });
   }
 
+  async findCommunityHouses(community_id: string) {
+    const pattern = { cmd: 'findOneCommunity' }
+    const payload = { _id: community_id }
+
+    let callback = await this.clientCommunityApp
+      .send<string>(pattern, payload)
+      .pipe(
+        map((response: string) => ({ response }))
+      )
+    const finalValue = await lastValueFrom(callback);
+    const response = finalValue['response'];
+    console.log(response['houses']);
+    return response['houses'];
+  }
 }
 

From 18ab1f4700506540c4edb4812a3a4e99f7c3d507 Mon Sep 17 00:00:00 2001
From: Mariela <mbonilla.guti@gmail.com>
Date: Sun, 31 Jul 2022 20:02:13 -0600
Subject: [PATCH 6/7] add column numero de vivienda

---
 .../src/schemas/house.schema.ts               |  2 +-
 servicio-usuarios/src/schemas/user.schema.ts  |  3 ++
 servicio-usuarios/src/users/users.service.ts  | 36 +++++++++++++++----
 web-ui/web-react/src/components/Inquilinos.js | 19 ++++++----
 4 files changed, 45 insertions(+), 15 deletions(-)

diff --git a/servicio-comunidad-viviendas/src/schemas/house.schema.ts b/servicio-comunidad-viviendas/src/schemas/house.schema.ts
index 75aeda0f..d85c31c6 100644
--- a/servicio-comunidad-viviendas/src/schemas/house.schema.ts
+++ b/servicio-comunidad-viviendas/src/schemas/house.schema.ts
@@ -7,7 +7,7 @@ import { Tenant, TenantSchema } from './tenant.schema';
 @Schema()
 export class House extends Document {
   @Prop({ default: ' ' })
-  number: string;
+  number_house: string;
 
   @Prop({ default: 'desocupada' })
   state: string;
diff --git a/servicio-usuarios/src/schemas/user.schema.ts b/servicio-usuarios/src/schemas/user.schema.ts
index 02d1cf81..f09a3231 100644
--- a/servicio-usuarios/src/schemas/user.schema.ts
+++ b/servicio-usuarios/src/schemas/user.schema.ts
@@ -36,6 +36,9 @@ export class User {
 
   @Prop()
   community_id?: string;
+
+  @Prop()
+  number_house?: string;
 }
 
 export const UserSchema = SchemaFactory.createForClass(User);
diff --git a/servicio-usuarios/src/users/users.service.ts b/servicio-usuarios/src/users/users.service.ts
index 6ff98cf6..1054116f 100644
--- a/servicio-usuarios/src/users/users.service.ts
+++ b/servicio-usuarios/src/users/users.service.ts
@@ -127,13 +127,28 @@ export class UsersService {
 
 
   //find inquilinos
-  async findTenantsCommunity(pcommunity_id: string): Promise<User[]> {
-    let houses = await this.findCommunityHouses(pcommunity_id);
+  async findTenantsCommunity(pcommunity_id: string) {
+    //let tenants = await this.findCommunityTenants(pcommunity_id);
 
-    return this.userModel.find({ community_id: pcommunity_id, user_type: 4 }).exec()
-    .then();
+
+
+    return await this.userModel.find({ community_id: pcommunity_id, user_type: 4 })
+      .then(async (users) => {
+        if (users) {
+          await Promise.all(
+            users.map(async (u) => {
+              //buscar al usuario con el id de la comunidad anexado
+              let number_house = await this.findNumHouseTenant(pcommunity_id, u['_id']);
+              u['number_house'] = number_house;
+              return u;
+            }),
+          )
+        }
+        return users;
+      })
   }
 
+
   async testSendMail(user: UserDocument) {
     let passwordEncriptada = Md5.init(user.password);
     user.password = passwordEncriptada;
@@ -179,7 +194,7 @@ export class UsersService {
     });
   }
 
-  async findCommunityHouses(community_id: string) {
+  async findNumHouseTenant(community_id: string, tenant_id: string) {
     const pattern = { cmd: 'findOneCommunity' }
     const payload = { _id: community_id }
 
@@ -190,8 +205,15 @@ export class UsersService {
       )
     const finalValue = await lastValueFrom(callback);
     const response = finalValue['response'];
-    console.log(response['houses']);
-    return response['houses'];
+    const houses = response['houses'];
+    let num_house = "";
+    await houses.forEach(async house => {
+        if (tenant_id == house.tenants.tenant_id) {
+          num_house = house.number_house;
+        }
+    })
+    return num_house;
   }
+
 }
 
diff --git a/web-ui/web-react/src/components/Inquilinos.js b/web-ui/web-react/src/components/Inquilinos.js
index 221a30d5..c47d81c9 100644
--- a/web-ui/web-react/src/components/Inquilinos.js
+++ b/web-ui/web-react/src/components/Inquilinos.js
@@ -31,6 +31,7 @@ const Inquilinos = () => {
     password: '',
     community_id: '',
     community_name: '',
+    number_house: 'Sin número de vivienda',
     user_type: '4',
     date_entry: new Date(),
     status: '1'
@@ -55,7 +56,15 @@ const Inquilinos = () => {
     await fetch(`http://localhost:4000/user/findTenants/${cookies.community_id}`, { method: 'GET' })
       .then((response) => response.json())
       .then(data => data.message)
-      .then(data => setTenants(data));
+      .then(data => {
+
+        data.map((item) => {
+          if(item.number_house ==""){
+            item.number_house = "Sin vivienda asignada";
+          }
+        })
+        setTenants(data)
+      });
   }
 
 
@@ -279,11 +288,7 @@ const Inquilinos = () => {
     </>
   )
 
-  const headerCommuntiy = (
-    <>
-      <p> <FontAwesomeIcon icon={faHome} style={{ color: "#D7A86E" }} />   Comunidad</p>
-    </>
-  )
+
 
   const headerNumberHouse = (
     <>
@@ -315,7 +320,7 @@ const Inquilinos = () => {
             </Column>
             <Column field="email" sortable header={headerEmail} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
             <Column field="phone" header={headerPhone} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
-            <Column field="community_name" header={headerCommuntiy} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
+            <Column field="number_house" header={headerNumberHouse} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
             <Column header={headerOptions} style={{ flexGrow: 1, flexBasis: '130px', minWidth: '130px' }} body={actionsTenant}></Column>
           </DataTable>
           <Dialog visible={deleteTenantDialog} style={{ width: '450px' }} header="Confirmar" modal footer={deleteTenantDialogFooter} onHide={hideDeleteTenantDialog}>

From 16b00e9284a7aa5417c8efd16292f5e777e502ec Mon Sep 17 00:00:00 2001
From: Mariela <mbonilla.guti@gmail.com>
Date: Sun, 31 Jul 2022 21:00:50 -0600
Subject: [PATCH 7/7] agregar sortable en numero de vivienda

---
 web-ui/web-react/src/components/Inquilinos.js | 12 ++++--------
 1 file changed, 4 insertions(+), 8 deletions(-)

diff --git a/web-ui/web-react/src/components/Inquilinos.js b/web-ui/web-react/src/components/Inquilinos.js
index c47d81c9..78fa76df 100644
--- a/web-ui/web-react/src/components/Inquilinos.js
+++ b/web-ui/web-react/src/components/Inquilinos.js
@@ -296,11 +296,7 @@ const Inquilinos = () => {
     </>
   )
 
-  const headerOptions = (
-    <>
-      <p>Opciones <FontAwesomeIcon icon={faEllipsis} style={{ color: "#D7A86E" }} /></p>
-    </>
-  )
+ 
   return (
     <div className="grid">
       <div className="col-12">
@@ -319,9 +315,9 @@ const Inquilinos = () => {
             <Column field="dni" sortable header={headerDNI} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}>
             </Column>
             <Column field="email" sortable header={headerEmail} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
-            <Column field="phone" header={headerPhone} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
-            <Column field="number_house" header={headerNumberHouse} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
-            <Column header={headerOptions} style={{ flexGrow: 1, flexBasis: '130px', minWidth: '130px' }} body={actionsTenant}></Column>
+            <Column field="phone" header={headerPhone} style={{ flexGrow: 1, flexBasis: '80px', minWidth: '80px', wordBreak: 'break-word' }}></Column>
+            <Column field="number_house" sortable header={headerNumberHouse} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word', justifyContent: 'center' }}></Column>
+            <Column  style={{ flexGrow: 1, flexBasis: '130px', minWidth: '130px' }} body={actionsTenant}></Column>
           </DataTable>
           <Dialog visible={deleteTenantDialog} style={{ width: '450px' }} header="Confirmar" modal footer={deleteTenantDialogFooter} onHide={hideDeleteTenantDialog}>
             <div className="flex align-items-center justify-content-center">