templeta and logic edit

src/App.css

@@ -266,3 +266,12 @@
 .title_td{
     font-weight: bold;
 }
+.operation_buttons{
+    display: flex;
+    flex-direction:row;
+}
+.icon_op{
+    border : 1px solid var(--main);
+    color : var(--main);
+    margin :5px;
+}

src/Components/Password/Rows.js

@@ -1,3 +1,6 @@
+import EditIcon from '@mui/icons-material/Edit';
+import SendIcon from '@mui/icons-material/Send';
+
 export const Encabezados = [
     {
         name: 'pass',
@@ -23,6 +26,16 @@ export const Encabezados = [
         disablePadding: true,
         label: 'Correo',
     },
+    {
+        name: 'op',
+        numeric: false,
+        disablePadding: true,
+        label: 'Operación',
+        options: {
+            filter: true,
+            sort: false,
+        }
+    },
 ]
 
 export const niveles_educativos = [
@@ -47,14 +60,25 @@ export const departamentos = [
     "Guatemala",
 ]
 
-export function Build(pwds){
-    return pwds.map( pwd => {
-        let { candidato: user } = pwd
+export function Build(pwds) {
+    return pwds.map(password => {
+        let { candidato: user, plaza_id, pwd } = password
         return {
-            pass : pwd.pwd,
+            pass: pwd,
             name: user.nombre,
             apell: user.apellidos,
             mail: user.mail,
+            op: <OpButtons plz={plaza_id} pwd={pwd}  />
         }
     })
 }
+
+
+function OpButtons(props){
+    return(
+        <div className="operation_buttons">
+            <EditIcon onClick={() => console.log(props)} className="icon_op"/>
+            <SendIcon className="icon_op"/>
+        </div>
+    )
+}