code7-leia 0.1.113 → 0.1.115

package/dist/code7-leia.esm.js

@@ -3,7 +3,7 @@ import React, { forwardRef, useRef, useCallback, useEffect, useState, createCont
 import { useRouteMatch, useLocation, useHistory, Switch, Route } from 'react-router-dom';
 import PropTypes from 'prop-types';
 import cc from 'classcat';
-import styled from 'styled-components';
+import styled, { css } from 'styled-components';
 import { FaSearch, FaUpload, FaList, FaPlus, FaMicrophone } from 'react-icons/fa';
 import unorm from 'unorm';
 import { MdClose, MdPerson2 } from 'react-icons/md';
@@ -14,6 +14,8 @@ import { createStore, applyMiddleware } from 'redux';
 import createSagaMiddleware from 'redux-saga';
 import { produce } from 'immer';
 import { all, takeLatest, put, call } from 'redux-saga/effects';
+import { toast as toast$1 } from 'react-toastify';
+import 'react-toastify/dist/ReactToastify.css';
 
 function _regeneratorRuntime() {
   _regeneratorRuntime = function () {
@@ -478,6 +480,34 @@ var defaultLanguage = {
       title: 'No data for analysis',
       description: 'Do a search, click the "Test" button.'
     }
+  },
+  toast: {
+    deleteFile: {
+      success: {
+        title: 'Success',
+        description: 'File deleted successfully!'
+      },
+      fail: {
+        title: 'Failure',
+        description: 'Error deleting the file!'
+      }
+    },
+    uploadFile: {
+      success: {
+        title: 'Success',
+        description: 'File uploaded successfully!'
+      },
+      fail: {
+        title: 'Failure',
+        description: 'Error uploading the file!'
+      }
+    },
+    Test: {
+      fail: {
+        title: 'Failure',
+        description: 'Error testing Le-IA'
+      }
+    }
   }
 };
 var getLanguage = function getLanguage(language) {
@@ -518,7 +548,35 @@ var getLanguage = function getLanguage(language) {
           title: 'Sem dados para análise',
           description: 'Faça uma pesquisa, clique no botão "Teste".'
         })
-      })
+      }),
+      toast: {
+        deleteFile: {
+          success: {
+            title: 'Sucesso',
+            description: 'Arquivo deletado com sucesso!'
+          },
+          fail: {
+            title: 'Falha',
+            description: 'Erro ao deletar o arquivo!'
+          }
+        },
+        uploadFile: {
+          success: {
+            title: 'Sucesso',
+            description: 'Arquivo enviado com sucesso!'
+          },
+          fail: {
+            title: 'Falha',
+            description: 'Erro ao enviar o arquivo!'
+          }
+        },
+        Test: {
+          fail: {
+            title: 'Falha',
+            description: 'Erro ao testar a Le-IA'
+          }
+        }
+      }
     },
     es: _extends({}, defaultLanguage, {
       files: 'Archivos',
@@ -554,20 +612,50 @@ var getLanguage = function getLanguage(language) {
           title: 'Sin datos para el análisis',
           description: 'Realiza una búsqueda, haz clic en el botón "Prueba".'
         })
-      })
+      }),
+      toast: {
+        deleteFile: {
+          success: {
+            title: 'Éxito',
+            description: '¡Archivo eliminado correctamente!'
+          },
+          fail: {
+            title: 'Fallo',
+            description: 'Error al eliminar el archivo!'
+          }
+        },
+        uploadFile: {
+          success: {
+            title: 'Éxito',
+            description: '¡Archivo subido correctamente!'
+          },
+          fail: {
+            title: 'Fallo',
+            description: 'Error al subir el archivo!'
+          }
+        },
+        Test: {
+          fail: {
+            title: 'Fallo',
+            description: 'Error al probar Le-IA'
+          }
+        }
+      }
     })
   };
   return languages[language] || defaultLanguage;
 };
 
-var _templateObject$1, _templateObject2$1;
-var Container = /*#__PURE__*/styled.div(_templateObject$1 || (_templateObject$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .tag {\n    padding: 4px 8px 4px 8px;\n    background: #C7F9ED;\n    border-radius: 4px;\n  }\n\n  .tags {\n    display: flex;\n    justify-content: left;\n    gap: 4px;\n  }\n\n  .divDelete {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 4px;\n  }\n\n  .buttonDelete {\n    color: #5b0a1f;\n    background: #fae0d2;\n    padding: 12px 20px;\n    border-radius: 4px;\n  }\n\n  .buttonDelete:hover {\n      background: #f5bba7;\n  }\n\n  .button {\n    padding: 8px 16px 8px 16px;\n    border-radius: 4px;\n    gap: 10px;\n  }\n\n  .cancel {\n    background: #F3F5F9;\n    color: #5A5D68;\n  }\n\n  .send {\n    background: #102693;\n    color: white;\n  }\n\n  .delete {\n    background: #871821;\n    color: white;\n  }\n\n  .presset {\n    padding-top: 10px;\n    display: flex;\n    flex-direction: column;\n  }\n\n  #warning {\n    padding: 10px;\n    background: #FAE0D2;\n    color: #871821;\n  }\n"])));
-var Header = /*#__PURE__*/styled.div(_templateObject2$1 || (_templateObject2$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n\n  .infos {\n    display: flex;\n    flex-direction: column;\n    padding: 14px 0;\n\n    h2 {\n      font-size: 20px\n    }\n\n    p {\n      font-size: 14px\n    }\n  }\n\n  .actions {\n    display: flex;\n    justify-content: space-between;\n    padding-bottom: 14px;\n\n    button {\n      background: #102693;\n      padding: 10px 20px;\n      color: white;\n      border-radius: 4px;\n    }\n  }\n\n"])));
+var _templateObject$1, _templateObject2$1, _templateObject3;
+var Container = /*#__PURE__*/styled.div(_templateObject$1 || (_templateObject$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n\n\n  .tag {\n    padding: 4px 8px 4px 8px;\n    background: #C7F9ED;\n    border-radius: 4px;\n  }\n\n  .tags {\n    display: flex;\n    justify-content: left;\n    gap: 4px;\n  }\n\n  .divDelete {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 4px;\n  }\n\n  .buttonDelete {\n    color: #5b0a1f;\n    background: #fae0d2;\n    padding: 12px 20px;\n    border-radius: 4px;\n  }\n\n  .buttonDelete:hover {\n      background: #f5bba7;\n  }\n\n  .button {\n    padding: 8px 16px 8px 16px;\n    border-radius: 4px;\n    gap: 10px;\n  }\n\n  .cancel {\n    background: #F3F5F9;\n    color: #5A5D68;\n  }\n\n  .send {\n    background: #102693;\n    color: white;\n  }\n\n  .delete {\n    background: #871821;\n    color: white;\n  }\n\n  .presset {\n    padding-top: 10px;\n    display: flex;\n    flex-direction: column;\n  }\n\n  #warning {\n    padding: 10px;\n    background: #FAE0D2;\n    color: #871821;\n  }\n"])), function (props) {
+  return props.isLoading && css(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n      #loading {\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        background-color: #979aa5;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        z-index: 9999;\n      }\n\n      #loading::after {\n        content: \"\";\n        border: 4px solid #f3f3f3; /* Cor do s\xEDmbolo de carregamento */\n        border-top: 4px solid #3498db; /* Cor do s\xEDmbolo de carregamento */\n        border-radius: 50%;\n        width: 30px;\n        height: 30px;\n        animation: spin 1s linear infinite;\n      }\n\n      @keyframes spin {\n        0% { transform: rotate(0deg); }\n        100% { transform: rotate(360deg); }\n      }\n    "])));
+});
+var Header = /*#__PURE__*/styled.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n\n  .infos {\n    display: flex;\n    flex-direction: column;\n    padding: 14px 0;\n\n    h2 {\n      font-size: 20px\n    }\n\n    p {\n      font-size: 14px\n    }\n  }\n\n  .actions {\n    display: flex;\n    justify-content: space-between;\n    padding-bottom: 14px;\n\n    button {\n      background: #102693;\n      padding: 10px 20px;\n      color: white;\n      border-radius: 4px;\n    }\n  }\n\n"])));
 
-var _templateObject$2, _templateObject2$2, _templateObject3;
+var _templateObject$2, _templateObject2$2, _templateObject3$1;
 var TableWrapper = /*#__PURE__*/styled.div(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  height: max-content;\n  min-height: 50px;\n  position: relative;\n"])));
 var Table = /*#__PURE__*/styled.table(_templateObject2$2 || (_templateObject2$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: 14px;\n  line-height: 143%;\n  color: black;\n  width: 100%;\n  border-collapse: collapse;\n  border-radius: 4px;\n\n  th {\n    font-weight: 600;\n    font-size: 14px;\n    line-height: 143%;\n    letter-spacing: 0.018em;\n    color: #5A5D68;\n    text-align: left;\n    padding: 8px;\n    border-radius: 4px;\n  }\n\n  thead tr {\n    background: #dadce3;\n  }\n\n  tbody tr {\n    border: 1px solid #dadce3;\n  }\n\n  &.small td {\n    padding: 4px;\n  }\n\n  &.medium td {\n    padding: 8px;\n  }\n\n  &.large td {\n    padding: 16px;\n  }\n"])));
-var TableLoadingWrapper = /*#__PURE__*/styled.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: #f3f5f961;\n"])));
+var TableLoadingWrapper = /*#__PURE__*/styled.div(_templateObject3$1 || (_templateObject3$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: #f3f5f961;\n"])));
 
 var _templateObject$3;
 var SpinnerWrapper = /*#__PURE__*/styled.span(_templateObject$3 || (_templateObject$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-block;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  &.spinner--sm {\n    width: 24px;\n    height: 24px;\n  }\n\n  &.spinner--md {\n    width: 32px;\n    height: 32px;\n  }\n\n  &.spinner--lg {\n    width: 60px;\n    height: 60px;\n  }\n\n  span {\n    box-sizing: border-box;\n    display: block;\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    margin: 8px;\n    border: 4px solid #fff;\n    border-radius: 50%;\n    animation: rotateSpinner 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n    border-color: ", " transparent transparent\n      transparent;\n  }\n\n  & span:nth-child(1) {\n    animation-delay: -0.45s;\n  }\n\n  & span:nth-child(2) {\n    animation-delay: -0.3s;\n  }\n\n  & span:nth-child(3) {\n    animation-delay: -0.15s;\n  }\n\n  @keyframes rotateSpinner {\n    0% {\n      transform: rotate(0deg);\n    }\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n"])), function (props) {
@@ -651,7 +739,7 @@ var SearchInput = function SearchInput(_ref) {
   }, React.createElement(FaSearch, null)));
 };
 
-var _templateObject$4, _templateObject2$3, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+var _templateObject$4, _templateObject2$3, _templateObject3$2, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
 var FullScreen = /*#__PURE__*/styled.div(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: ", ";\n  cursor: ", ";\n\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  justify-content: center;\n  align-items: center;\n  z-index: ", ";\n  animation: fadeIn 380ms ease-in-out 1;\n  background-color: #2f3845b8;\n  backdrop-filter: blur(2px);\n\n  @keyframes fadeIn {\n    from {\n      background-color: #2f384521;\n    }\n    to {\n      background-color: #2f3845b8;\n    }\n  }\n"])), function (_ref) {
   var isOpen = _ref.isOpen;
   return isOpen === 1 ? 'flex' : 'none';
@@ -666,7 +754,7 @@ var Modal = /*#__PURE__*/styled.div(_templateObject2$3 || (_templateObject2$3 =
   var maxWidth = _ref4.maxWidth;
   return maxWidth;
 });
-var ModalContainer = /*#__PURE__*/styled.div(_templateObject3$1 || (_templateObject3$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  overflow-y: auto;\n  max-height: ", ";\n"])), function (_ref5) {
+var ModalContainer = /*#__PURE__*/styled.div(_templateObject3$2 || (_templateObject3$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  overflow-y: auto;\n  max-height: ", ";\n"])), function (_ref5) {
   var maxHeight = _ref5.maxHeight;
   return maxHeight;
 });
@@ -1114,7 +1202,13 @@ var Types = {
   UPLOAD_FILES_REQUEST: 'UPLOAD_FILES_REQUEST',
   UPLOAD_FILES_SUCCESS: 'UPLOAD_FILES_SUCCESS',
   TEST_REQUEST: 'TEST_REQUEST',
-  TEST_SUCCESS: 'TEST_SUCCESS'
+  TEST_SUCCESS: 'TEST_SUCCESS',
+  LOADING_START: 'LOADING_START',
+  LOADING_FINISH: 'LOADING_FINISH',
+  CHANGING_START: 'CHANGING_START',
+  CHANGING_FINISH: 'CHANGING_FINISH',
+  NETWORK_ONLINE: 'NETWORK_ONLINE',
+  NETWORK_OFFLINE: 'NETWORK_OFFLINE'
 };
 
 var getFilesAction = function getFilesAction(id) {
@@ -1134,12 +1228,13 @@ var getFilesActionSuccess = function getFilesActionSuccess(_ref) {
     }
   };
 };
-var deleteFilesAction = function deleteFilesAction(name, id) {
+var deleteFilesAction = function deleteFilesAction(name, id, language) {
   return {
     type: Types.DELETE_FILES_REQUEST,
     payload: {
       name: name,
-      id: id
+      id: id,
+      language: language
     }
   };
 };
@@ -1152,13 +1247,14 @@ var deleteFilesActionSuccess = function deleteFilesActionSuccess(_ref2) {
     }
   };
 };
-var uploadFilesAction = function uploadFilesAction(file, id, pressets) {
+var uploadFilesAction = function uploadFilesAction(file, id, pressets, language) {
   return {
     type: Types.UPLOAD_FILES_REQUEST,
     payload: {
       file: file,
       id: id,
-      pressets: pressets
+      pressets: pressets,
+      language: language
     }
   };
 };
@@ -1191,6 +1287,16 @@ var testActionSuccess = function testActionSuccess(_ref4) {
     }
   };
 };
+var commonLoadingStart = function commonLoadingStart() {
+  return {
+    type: Types.LOADING_START
+  };
+};
+var commonLoadingFinish = function commonLoadingFinish() {
+  return {
+    type: Types.LOADING_FINISH
+  };
+};
 
 var FileArea = function FileArea() {
   var _useSharedProps = useSharedProps(),
@@ -1224,6 +1330,9 @@ var FileArea = function FileArea() {
   var initFiles = useSelector(function (state) {
     return state.files;
   });
+  var isLoading = useSelector(function (state) {
+    return state.isLoading;
+  });
   var tags = propTags ? propTags.tags : [];
   useEffect(function () {
     dispatch(getFilesAction(id));
@@ -1232,6 +1341,8 @@ var FileArea = function FileArea() {
     if (!!initFiles) {
       setFiles(initFiles);
       setInitialFiles(initFiles);
+      setModal(false);
+      setModalDelete(false);
     }
   }, [initFiles]);
   var optionsPresset = tags.map(function (tag) {
@@ -1256,13 +1367,17 @@ var FileArea = function FileArea() {
     setModalDelete(!modalDelete);
   };
   var deleteFile = function deleteFile() {
-    dispatch(deleteFilesAction(fileDelete, id));
+    dispatch(deleteFilesAction(fileDelete, id, language));
   };
   var handleUploadFile = function handleUploadFile() {
-    dispatch(uploadFilesAction(uploadFile, id, [presset]));
+    dispatch(uploadFilesAction(uploadFile, id, [presset], language));
   };
   var renderFiles = function renderFiles() {
-    return React.createElement(Container, null, React.createElement(Header, null, React.createElement("div", {
+    return React.createElement(Container, {
+      isLoading: isLoading
+    }, React.createElement("div", {
+      id: 'loading'
+    }), React.createElement(Header, null, React.createElement("div", {
       className: 'infos'
     }, React.createElement("h2", null, t.files), React.createElement("p", null, t.fileArea.description)), React.createElement("div", {
       className: 'actions'
@@ -1364,16 +1479,16 @@ var FileArea = function FileArea() {
   }, React.createElement(Container, null, renderFiles()));
 };
 
-var _templateObject$8, _templateObject2$4, _templateObject3$2, _templateObject4$1;
+var _templateObject$8, _templateObject2$4, _templateObject3$3, _templateObject4$1;
 var Container$4 = /*#__PURE__*/styled.div(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n\n"])));
 var Header$1 = /*#__PURE__*/styled.div(_templateObject2$4 || (_templateObject2$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  .infos {\n    display: flex;\n    flex-direction: column;\n    padding: 14px 0;\n\n    h2 {\n      font-size: 20px\n    }\n\n    p {\n      font-size: 14px\n    }\n  }\n"])));
-var Inputs = /*#__PURE__*/styled.div(_templateObject3$2 || (_templateObject3$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 10px;\n\n  button {\n    background: #102693;\n    padding: 10px 20px;\n    color: white;\n    border-radius: 4px;\n    width: 190px;\n    height: 40px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    svg {\n      width: 23px;\n      height: 23px;\n    }\n  }\n"])));
+var Inputs = /*#__PURE__*/styled.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 10px;\n\n  button {\n    background: #102693;\n    padding: 10px 20px;\n    color: white;\n    border-radius: 4px;\n    width: 190px;\n    height: 40px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    svg {\n      width: 23px;\n      height: 23px;\n    }\n  }\n"])));
 var Result = /*#__PURE__*/styled.div(_templateObject4$1 || (_templateObject4$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: left;\n  background: #F3F5F9;\n  padding: 15px;\n  border-radius: 5px;\n  margin-top: 15px;\n\n  .text{\n    margin-left: 5px;\n    font-size: 14px;\n    line-height: 1.5;\n  }\n\n  .icon {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin-right: 5px;\n\n    svg {\n      width: 35px;\n      height: 35px;\n    }\n  }\n\n"])));
 
-var _templateObject$9, _templateObject2$5, _templateObject3$3, _templateObject4$2;
+var _templateObject$9, _templateObject2$5, _templateObject3$4, _templateObject4$2;
 var Container$5 = /*#__PURE__*/styled.div(_templateObject$9 || (_templateObject$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  width: 100%;\n  margin-right: 5px;\n"])));
 var StyledInput = /*#__PURE__*/styled.input(_templateObject2$5 || (_templateObject2$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-left: 10px;\n  padding-right: 40px;\n  border-radius: 5px;\n  border: 1px solid #ccc;\n  height: 40px;\n  width: 100%;\n\n  &:focus {\n    outline: none;\n    box-shadow: 0 0 0 3px #6690ff;\n  }\n"])));
-var RecordAudioButton = /*#__PURE__*/styled.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 10px;\n  right: 10px;\n  cursor: pointer;\n"])));
+var RecordAudioButton = /*#__PURE__*/styled.div(_templateObject3$4 || (_templateObject3$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 10px;\n  right: 10px;\n  cursor: pointer;\n"])));
 var StyledMicrophoneIcon = /*#__PURE__*/styled(FaMicrophone)(_templateObject4$2 || (_templateObject4$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  pointer-events: none;\n"])));
 
 var InputTest = function InputTest(_ref) {
@@ -1517,7 +1632,10 @@ var Leia = function Leia(props) {
 
 var INITIAL_STATE = {
   files: [],
-  message: ''
+  message: '',
+  isLoading: false,
+  isChanging: false,
+  isOffline: true
 };
 function filesReducer(state, action) {
   if (state === void 0) {
@@ -1534,12 +1652,76 @@ function filesReducer(state, action) {
       case Types.TEST_SUCCESS:
         draft.message = action.payload.message;
         break;
+      case Types.LOADING_START:
+        draft.isLoading = true;
+        break;
+      case Types.LOADING_FINISH:
+        draft.isLoading = false;
+        break;
+      case Types.CHANGING_START:
+        draft.isChanging = true;
+        break;
+      case Types.CHANGING_FINISH:
+        draft.isChanging = false;
+        break;
+      case Types.NETWORK_ONLINE:
+        draft.isOffline = false;
+        break;
+      case Types.NETWORK_OFFLINE:
+        draft.isOffline = true;
+        break;
       default:
         return action.payload;
     }
   });
 }
 
+var CustomToastContent = function CustomToastContent(_ref) {
+  var title = _ref.title,
+    description = _ref.description;
+  return React.createElement(React.Fragment, null, React.createElement("div", {
+    className: "custom-toastify-content"
+  }, React.createElement("strong", {
+    className: "custom-toastify-title"
+  }, title), description && React.createElement("p", {
+    className: "custom-toastify-description"
+  }, description)));
+};
+var toast = {
+  "default": function _default(_ref2) {
+    var title = _ref2.title,
+      description = _ref2.description;
+    return toast$1(React.createElement(CustomToastContent, {
+      title: title,
+      description: description
+    }));
+  },
+  success: function success(_ref3) {
+    var title = _ref3.title,
+      description = _ref3.description;
+    return toast$1.success(React.createElement(CustomToastContent, {
+      title: title,
+      description: description
+    }));
+  },
+  error: function error(_ref4) {
+    var title = _ref4.title,
+      description = _ref4.description;
+    return toast$1.error(React.createElement(CustomToastContent, {
+      title: title,
+      description: description
+    }));
+  },
+  warn: function warn(_ref5) {
+    var title = _ref5.title,
+      description = _ref5.description;
+    return toast$1.warn(React.createElement(CustomToastContent, {
+      title: title,
+      description: description
+    }));
+  }
+};
+
 var _marked = /*#__PURE__*/_regeneratorRuntime().mark(getFilesSaga),
   _marked2 = /*#__PURE__*/_regeneratorRuntime().mark(deleteFilesSaga),
   _marked3 = /*#__PURE__*/_regeneratorRuntime().mark(testSaga),
@@ -1575,36 +1757,51 @@ function getFilesSaga(action) {
   }, _marked, null, [[0, 10]]);
 }
 function deleteFilesSaga(action) {
-  var _action$payload, id, name, _yield$call2, data;
+  var t, _action$payload, id, name, _yield$call2, data;
   return _regeneratorRuntime().wrap(function deleteFilesSaga$(_context2) {
     while (1) switch (_context2.prev = _context2.next) {
       case 0:
-        _context2.prev = 0;
-        _action$payload = action.payload, id = _action$payload.id, name = _action$payload.name;
+        t = getLanguage(action.payload.language);
+        _context2.prev = 1;
         _context2.next = 4;
-        return call(api["delete"], "/delete/" + id + "/" + name);
+        return put(commonLoadingStart());
       case 4:
-        _context2.next = 6;
+        _action$payload = action.payload, id = _action$payload.id, name = _action$payload.name;
+        _context2.next = 7;
+        return call(api["delete"], "/delete/" + id + "/" + name);
+      case 7:
+        _context2.next = 9;
         return call(api.get, "/files/" + id);
-      case 6:
+      case 9:
         _yield$call2 = _context2.sent;
         data = _yield$call2.data;
-        _context2.next = 10;
+        _context2.next = 13;
         return put(deleteFilesActionSuccess({
-          files: data.files
+          files: data.files,
+          success: true
         }));
-      case 10:
-        _context2.next = 15;
+      case 13:
+        _context2.next = 19;
         break;
-      case 12:
-        _context2.prev = 12;
-        _context2.t0 = _context2["catch"](0);
-        console.log('-----------deleteFilesSaga.error------------------->', _context2.t0);
       case 15:
+        _context2.prev = 15;
+        _context2.t0 = _context2["catch"](1);
+        toast.error({
+          title: t.toast.deleteFile.fail.title,
+          description: t.toast.deleteFile.fail.description
+        });
+        console.log('-----------deleteFilesSaga.error------------------->', _context2.t0);
+      case 19:
+        _context2.prev = 19;
+        _context2.next = 22;
+        return put(commonLoadingFinish());
+      case 22:
+        return _context2.finish(19);
+      case 23:
       case "end":
         return _context2.stop();
     }
-  }, _marked2, null, [[0, 12]]);
+  }, _marked2, null, [[1, 15, 19, 23]]);
 }
 function testSaga(action) {
   var _action$payload2, question, profile, presset, files_directory, _yield$call3, data;
@@ -1641,11 +1838,15 @@ function testSaga(action) {
   }, _marked3, null, [[0, 10]]);
 }
 function uploadFilesSaga(action) {
-  var _action$payload3, id, file, pressets, tags, blob, formData, queryParams, _yield$call4, data;
+  var t, _action$payload3, id, file, pressets, tags, blob, formData, queryParams, _yield$call4, data;
   return _regeneratorRuntime().wrap(function uploadFilesSaga$(_context4) {
     while (1) switch (_context4.prev = _context4.next) {
       case 0:
-        _context4.prev = 0;
+        t = getLanguage(action.payload.language);
+        _context4.prev = 1;
+        _context4.next = 4;
+        return put(commonLoadingStart());
+      case 4:
         _action$payload3 = action.payload, id = _action$payload3.id, file = _action$payload3.file, pressets = _action$payload3.pressets;
         tags = pressets.join(',');
         blob = new Blob([file.content]);
@@ -1654,34 +1855,44 @@ function uploadFilesSaga(action) {
         queryParams = new URLSearchParams({
           tags: tags
         }).toString();
-        _context4.next = 9;
+        _context4.next = 12;
         return call(api.post, "/upload/" + id + "?" + queryParams, formData, {
           headers: {
             'Content-Type': 'multipart/form-data'
           }
         });
-      case 9:
-        _context4.next = 11;
+      case 12:
+        _context4.next = 14;
         return call(api.get, "/files/" + id);
-      case 11:
+      case 14:
         _yield$call4 = _context4.sent;
         data = _yield$call4.data;
-        _context4.next = 15;
+        _context4.next = 18;
         return put(uploadFilesActionSuccess({
           files: data.files
         }));
-      case 15:
-        _context4.next = 20;
+      case 18:
+        _context4.next = 24;
         break;
-      case 17:
-        _context4.prev = 17;
-        _context4.t0 = _context4["catch"](0);
-        console.log('-----------uploadFilesSaga.error------------------->', _context4.t0);
       case 20:
+        _context4.prev = 20;
+        _context4.t0 = _context4["catch"](1);
+        toast.error({
+          title: t.toast.uploadFile.fail.title,
+          description: t.toast.uploadFile.fail.description
+        });
+        console.log('-----------uploadFilesSaga.error------------------->', _context4.t0);
+      case 24:
+        _context4.prev = 24;
+        _context4.next = 27;
+        return put(commonLoadingFinish());
+      case 27:
+        return _context4.finish(24);
+      case 28:
       case "end":
         return _context4.stop();
     }
-  }, _marked4, null, [[0, 17]]);
+  }, _marked4, null, [[1, 20, 24, 28]]);
 }
 function filesSagas() {
   return _regeneratorRuntime().wrap(function filesSagas$(_context5) {