Criação do botao para fazer upload de csv

frontend/src/components/MessageInput/index.js

@@ -266,6 +266,8 @@ const MessageInput = ({ ticketStatus }) => {
 
   const handleInputPaste = (e) => {
     if (e.clipboardData.files[0]) {
+
+      console.log('clipboardData: ', e.clipboardData.files[0])
       setMedias([e.clipboardData.files[0]]);
     }
   };

frontend/src/pages/Contacts/index.js

@@ -35,6 +35,17 @@ import toastError from "../../errors/toastError";
 import { AuthContext } from "../../context/Auth/AuthContext";
 import { Can } from "../../components/Can";
 
+import apiBroker from "../../services/apiBroker";
+
+import {
+  FormControlLabel,
+  Hidden,
+  Menu,
+  MenuItem,
+  Switch,
+} from "@material-ui/core";
+
+
 const reducer = (state, action) => {
 
 
@@ -110,6 +121,16 @@ const Contacts = () => {
   const [confirmOpen, setConfirmOpen] = useState(false);
   const [hasMore, setHasMore] = useState(false);
 
+  const [file, setFile] = useState()
+
+
+
+  function handleChange(event) {
+
+    console.log('THE FILE: ', event.target.files[0])
+
+    setFile(event.target.files[0])
+  }
 
 
   useEffect(() => {
@@ -237,6 +258,33 @@ const Contacts = () => {
     }
   };
 
+  const handleImportCSVContact = async () => {
+    console.log('kkkkkkkkkkk')
+    try {
+
+      const formData = new FormData();
+      const filename = `${new Date().getTime()}.mp3`;
+      formData.append("medias", filename);
+      formData.append("body", filename);
+      formData.append("fromMe", true);
+
+      const config = {
+        headers: {
+          'content-type': 'multipart/form-data',
+        },
+      };
+
+      const bulk_contact_insert = await apiBroker.post("/contacts/bulk/insert", formData, config);
+
+
+      // await api.post("/contacts/csv/import"); 
+
+      history.go(0);
+    } catch (err) {
+      toastError(err);
+    }
+  };
+
   const loadMore = () => {
     setPageNumber((prevState) => prevState + 1);
   };
@@ -295,13 +343,36 @@ const Contacts = () => {
               ),
             }}
           />
-          <Button
-            variant="contained"
-            color="primary"
-            onClick={(e) => setConfirmOpen(true)}
-          >
-            {i18n.t("contacts.buttons.import")}
-          </Button>
+
+          <Can
+            role={user.profile}
+            perform="contacts-page:import-csv-contacts"
+            yes={() => ( 
+              <Button
+                variant="contained"
+                color="primary"
+                onClick={(e) => handleImportCSVContact()}
+              >
+                IMPORTAR CONTACTO CSV
+                {/* {i18n.t("contacts.buttons.import")} */}
+              </Button>
+            )}
+          />
+
+          <Can
+            role={user.profile}
+            perform="contacts-page:import-contacts"
+            yes={() => (
+              <Button
+                variant="contained"
+                color="primary"
+                onClick={(e) => setConfirmOpen(true)}
+              >
+                {i18n.t("contacts.buttons.import")}
+              </Button>
+            )}
+          />
+
           <Button
             variant="contained"
             color="primary"

frontend/src/rules.js

@@ -13,6 +13,7 @@ const rules = {
 			"user-modal:editQueues",
 			"ticket-options:deleteTicket",
 			"contacts-page:deleteContact",
+			"contacts-page:import-csv-contacts",
 			"connections-view:show",
 			"dashboard-view:show",
 			"queues-view:show",
@@ -38,6 +39,8 @@ const rules = {
 			"user-modal:editQueues",
 			"ticket-options:deleteTicket",
 			"contacts-page:deleteContact",
+			"contacts-page:import-contacts",
+			"contacts-page:import-csv-contacts",
 			"connections-view:show",
 			"dashboard-view:show",
 			"queues-view:show",