feat: implementa o delete ao clicar o botão

ui/src/components/ListaMedicos.jsx

@@ -4,33 +4,10 @@ import {
   DeleteOutlined,
 } from '@ant-design/icons';
 
-import { Button, Table } from 'antd';
+import { Popconfirm, Button, Table } from 'antd';
 
 import _service from '@netuno/service-client';
 
-const medicosColumns = [
-  {
-    title: 'UID',
-    dataIndex: 'uid',
-    key: 'uid',
-  },
-  {
-    title: 'Nome',
-    dataIndex: 'nome',
-    key: 'nome',
-  },
-  {
-    title: 'CRM',
-    dataIndex: 'crm',
-    key: 'crm',
-  },
-  {
-    title: 'Delete',
-    dataIndex: 'delete',
-    key: 'delete',
-  }
-]
-
 function ListaMedicos() {
   const [medicos, setMedicos] = useState([]);
 
@@ -43,12 +20,6 @@ function ListaMedicos() {
     _service({
       url: "/services/medicos",
       success: (response) => {
-        response.json.map(item => item.delete = 
-          <Button
-            type="text"
-            icon={<DeleteOutlined />}
-          />
-        );
         setMedicos(response.json);
       },
       fail: (e) => {
@@ -58,6 +29,52 @@ function ListaMedicos() {
     });
   };
 
+  const handleDelete = record => {
+    _service({
+      url: `/services/medicos?uid=${record.uid}`,
+      method: "DELETE",
+      headers: {
+        'Authorization': `Bearer ${localStorage.getItem('access_token')}`
+      },
+      success: (response) => {
+        const newData = medicos.filter(item => item.uid !== record.uid);
+        setMedicos(newData);
+      },
+      fail: (e) => {
+        console.log("Service Error", e);
+      }
+    });
+  };
+
+  const medicosColumns = [
+    {
+      title: 'UID',
+      dataIndex: 'uid',
+      key: 'uid',
+    },
+    {
+      title: 'Nome',
+      dataIndex: 'nome',
+      key: 'nome',
+    },
+    {
+      title: 'CRM',
+      dataIndex: 'crm',
+      key: 'crm',
+    },
+    {
+      title: 'Delete',
+      dataIndex: 'delete',
+      key: 'delete',
+      render: (_, record) =>
+        <Popconfirm title="Tem certeza que deseja deletar" onConfirm={() => handleDelete(record)}>
+          <a>
+            <DeleteOutlined />
+          </a>
+        </Popconfirm>
+    }
+  ]
+
   return (
     <>
       <Table dataSource={medicos} columns={medicosColumns} />