contentoh-components-library 21.2.86 → 21.2.88

package/src/components/atoms/InputText/InputText.stories.js

@@ -1,5 +1,4 @@
-import { useRef } from "react";
-import InputText from "./index";
+import { InputText } from "./index";
 
 export default {
   title: "Components/atoms/InputText",

package/src/components/atoms/InputText/index.js

@@ -1,10 +1,8 @@
 import { Container } from "./styles";
 import React from "react";
 import { TextField } from "@mui/material";
-import { useState } from "react";
-import { useEffect } from "react";
 
-export default function InputText(props) {
+export const InputText = (props) => {
   const {
     id,
     key,
@@ -60,4 +58,4 @@ export default function InputText(props) {
       </Container>
     </>
   );
-}
+};

package/src/components/atoms/NotFound/NotFound.stories.js

@@ -1,4 +1,4 @@
-import NotFound from "./index";
+import { NotFound } from "./index";
 
 export default {
   title: "Components/atoms/NotFound",

package/src/components/atoms/NotFound/index.js

@@ -1,13 +1,12 @@
 import { Container } from "./styles";
-import ButtonV2 from "../ButtonV2";
-import Modal from "../../organisms/Modal";
+import { ButtonV2 } from "../ButtonV2";
+import { Modal } from "../../organisms/Modal";
 import { FontAwesomeIcon as Icon } from "@fortawesome/react-fontawesome";
 import { faCircleInfo as iconInfo } from "@fortawesome/free-solid-svg-icons";
 import imgNotFountDefault from "../../../assets/images/defaultImages/notFound.svg";
-import PropTypes from "prop-types";
 import { useState, useEffect } from "react";
 
-export default function NotFound(props) {
+export const NotFound = (props) => {
   const {
     className, // string
     code, // string
@@ -50,4 +49,4 @@ export default function NotFound(props) {
       </Container>
     </>
   );
-}
+};

package/src/components/atoms/Tooltip/Tooltip.stories.js

@@ -1,4 +1,4 @@
-import Tooltip from "./index";
+import { Tooltip } from "./index";
 
 export default {
   title: "Components/atoms/Tooltip",

package/src/components/atoms/Tooltip/index.js

@@ -3,7 +3,7 @@ import { Fade, Grow, Popper, Tooltip as TooltipMUI, Zoom } from "@mui/material";
 import { Container } from "./styles";
 import React from "react";
 
-export default function Tooltip(props) {
+export const Tooltip = (props) => {
   const {
     componentTooltip, // (jsx) componente que aparecera en el tooltip
     children, // (jsx) componente interno que va dentro de la etiqueta <Tooltip>
@@ -56,4 +56,4 @@ export default function Tooltip(props) {
       <Container className={className}> {children} </Container>
     </TooltipMUI>
   );
-}
+};

package/src/components/molecules/ButtonDownloadFile/DownloadFile.stories.js

@@ -1,4 +1,4 @@
-import ButtonDownloadFile from "./index";
+import { ButtonDownloadFile } from "./index";
 export default {
   title: "Components/molecules/ButtonDownloadFile",
   component: ButtonDownloadFile,

package/src/components/molecules/ButtonDownloadFile/index.js

@@ -1,14 +1,12 @@
 import { Container } from "./styles";
-import { FontAwesomeIcon as Icon } from "@fortawesome/react-fontawesome";
 import { faArrowDown as IconDownload } from "@fortawesome/free-solid-svg-icons";
 import { useState } from "react";
-import PropTypes from "prop-types";
-import ButtonV2 from "../../atoms/ButtonV2";
-import IconFile from "../../atoms/IconFile";
+import { ButtonV2 } from "../../atoms/ButtonV2";
+import { IconFile } from "../../atoms/IconFile";
 import axios from "axios";
 import { getFileExtension } from "../../../global-files/utils";
 
-export default function ButtonDownloadFile(props) {
+export const ButtonDownloadFile = (props) => {
   const {
     id,
     key,
@@ -110,4 +108,4 @@ export default function ButtonDownloadFile(props) {
       </Container>
     </>
   );
-}
+};

package/src/components/molecules/HeaderTop/index.js

@@ -2,7 +2,7 @@ import { Container } from "./styles";
 import { ScreenHeader } from "../../atoms/ScreenHeader/index";
 import { Button } from "../../atoms/GeneralButton/index";
 import { useEffect, useRef } from "react";
-import Chat from "../../organisms/Chat";
+import { Chat } from "../../organisms/Chat";
 
 export const HeaderTop = ({ setHeaderTop }) => {
   const headerTop = useRef();

package/src/components/molecules/ImageTooltip/ImageTooltip.stories.js

@@ -1,4 +1,4 @@
-import ImageTooltip from "./index";
+import { ImageTooltip } from "./index";
 
 export default {
   title: "Components/molecules/ImageTooltip",

package/src/components/molecules/ImageTooltip/index.js

@@ -1,12 +1,10 @@
 import { Container, ContainerLoading, Img } from "./styles";
 import { FontAwesomeIcon as Icon } from "@fortawesome/react-fontawesome";
 import { faSpinner as iconLoading } from "@fortawesome/free-solid-svg-icons";
-import ImageDefault from "../../../assets/images/defaultImages/defaultUpdate.png";
-import PropTypes from "prop-types";
 import { useState, useEffect } from "react";
-import Tooltip from "../../atoms/Tooltip";
+import { Tooltip } from "../../atoms/Tooltip";
 
-export default function ImageTooltip(props) {
+export const ImageTooltip = (props) => {
   const {
     className, // string
     width, // string
@@ -61,4 +59,4 @@ export default function ImageTooltip(props) {
       />
     </Tooltip>
   );
-}
+};

package/src/components/organisms/Chat/Chat.stories.js

@@ -1,4 +1,4 @@
-import Chat from "./index";
+import { Chat } from "./index";
 
 export default {
   title: "Components/organisms/Chat",

package/src/components/organisms/Chat/ChatLists/ChatLists.stories.js

@@ -1,4 +1,4 @@
-import ChatLists from "./index";
+import { ChatLists } from "./index";
 import THD from "./THD.png";
 import Rotoplas from "./Rotoplas.jpeg";
 

package/src/components/organisms/Chat/ChatLists/index.js

@@ -2,11 +2,11 @@ import { Container, ContainerItemChat, ContainerTooltip } from "./styles";
 import { useEffect, useState } from "react";
 import { getCustomDate } from "../../../../global-files/utils";
 import { faImage as IconImage } from "@fortawesome/free-solid-svg-icons";
-import CustomIcon from "../../../atoms/CustomIcon";
-import Image from "../../../atoms/Image";
-import Tooltip from "../../../atoms/Tooltip";
+import { CustomIcon } from "../../../atoms/CustomIcon";
+import { Image } from "../../../atoms/Image";
+import { Tooltip } from "../../../atoms/Tooltip";
 
-export default function ChatLists(props) {
+export const ChatLists = (props) => {
   const {
     companies /* {
         id: { name , src , statusChat , items } ,
@@ -138,4 +138,4 @@ export default function ChatLists(props) {
       </Container>
     </>
   );
-}
+};

package/src/components/organisms/Chat/ContainerItems/ContainerItems.stories.js

@@ -1,4 +1,4 @@
-import ContainerItems from "./index";
+import { ContainerItems } from "./index";
 
 export default {
   title: "Components/organisms/Chat/ContainerItems",

package/src/components/organisms/Chat/ContainerItems/index.js

@@ -1,7 +1,7 @@
 import { Container } from "./styles";
 import { useEffect, useState } from "react";
 import { getProfilePicture } from "../../../../global-files/data";
-import ImageTooltip from "../../../molecules/ImageTooltip";
+import { ImageTooltip } from "../../../molecules/ImageTooltip";
 import {
   decodeJSON,
   getFullDate,
@@ -14,16 +14,16 @@ import {
   faImage as IconImage,
   faRedoAlt as IconReload,
 } from "@fortawesome/free-solid-svg-icons";
-import CustomIcon from "../../../atoms/CustomIcon";
-import ButtonV2 from "../../../atoms/ButtonV2";
-import ButtonDownloadFile from "../../../molecules/ButtonDownloadFile";
-import Modal from "../../Modal";
-import Tooltip from "../../../atoms/Tooltip";
+import { CustomIcon } from "../../../atoms/CustomIcon";
+import { ButtonV2 } from "../../../atoms/ButtonV2";
+import { ButtonDownloadFile } from "../../../molecules/ButtonDownloadFile";
+import { Modal } from "../../Modal";
+import { Tooltip } from "../../../atoms/Tooltip";
 import { Slide, Zoom } from "@mui/material";
 import { useRef } from "react";
-import ImagePreview from "../../../atoms/ImagePreview";
+import { ImagePreview } from "../../../atoms/ImagePreview";
 
-export default function ContainerItems(props) {
+export const ContainerItems = (props) => {
   const {
     items /* [
       { id , date , type , value , userId } ,
@@ -548,4 +548,4 @@ export default function ContainerItems(props) {
       />
     </>
   );
-}
+};

package/src/components/organisms/Chat/ContentChat/index.js

@@ -1,20 +1,20 @@
 import { Container, ContainerError } from "./styles";
 import { useEffect, useState } from "react";
-import Tooltip from "../../../atoms/Tooltip";
-import NotFound from "../../../atoms/NotFound";
-import ButtonV2 from "../../../atoms/ButtonV2";
-import Header from "../Header";
+import { Tooltip } from "../../../atoms/Tooltip";
+import { NotFound } from "../../../atoms/NotFound";
+import { ButtonV2 } from "../../../atoms/ButtonV2";
+import { Header } from "../Header";
 import {
   faComments as IconChat,
   faExclamationTriangle as IconWarning,
 } from "@fortawesome/free-solid-svg-icons";
 import { Loading } from "../../../atoms/Loading";
-import ContainerItems from "../ContainerItems";
-import Footer from "../Footer";
-import ChatLists from "../ChatLists";
-import CustomIcon from "../../../atoms/CustomIcon";
+import { ContainerItems } from "../ContainerItems";
+import { Footer } from "../Footer";
+import { ChatLists } from "../ChatLists";
+import { CustomIcon } from "../../../atoms/CustomIcon";
 import { fetchGET, fetchPOST } from "../../../../global-files/handle_http";
-import Modal from "../../Modal";
+import { Modal } from "../../Modal";
 import { isStringEmpty } from "../../../../global-files/utils";
 
 export const ContentChat = (props) => {
@@ -70,7 +70,7 @@ export const ContentChat = (props) => {
   useEffect(() => {
     return () => {
       console.log("componente chat desmontado");
-      stopUpdate();
+      if (processUpdateID !== undefined) clearTimeout(processUpdateID);
     };
   }, []);
   // al cargar el componente

package/src/components/organisms/Chat/Footer/Footer.stories.js

@@ -1,4 +1,4 @@
-import Footer from "./index";
+import { Footer } from "./index";
 
 export default {
   title: "Components/organisms/Chat/Footer",

package/src/components/organisms/Chat/Footer/index.js

@@ -8,21 +8,21 @@ import {
 import { useEffect, useState, useRef } from "react";
 import AWS from "aws-sdk";
 import { v4 as uuidv4 } from "uuid";
-import CustomImage from "../../../atoms/Image";
-import ImageTooltip from "../../../molecules/ImageTooltip";
+import { Image as CustomImage } from "../../../atoms/Image";
+import { ImageTooltip } from "../../../molecules/ImageTooltip";
 import {
   faArrowUp as IconSend,
   faImage as IconImage,
   faTrash as IconDelete,
   faExclamationTriangle as IconWarning,
 } from "@fortawesome/free-solid-svg-icons";
-import CustomIcon from "../../../atoms/CustomIcon";
-import ButtonV2 from "../../../atoms/ButtonV2";
-import IconFile from "../../../atoms/IconFile";
-import Modal from "../../Modal";
-import Tooltip from "../../../atoms/Tooltip";
+import { CustomIcon } from "../../../atoms/CustomIcon";
+import { ButtonV2 } from "../../../atoms/ButtonV2";
+import { IconFile } from "../../../atoms/IconFile";
+import { Modal } from "../../Modal";
+import { Tooltip } from "../../../atoms/Tooltip";
 import { Fade, Tooltip as TooltipMUI, Zoom } from "@mui/material";
-import ButtonFileChooser from "../../../atoms/ButtonFileChooser";
+import { ButtonFileChooser } from "../../../atoms/ButtonFileChooser";
 import { Slide } from "@mui/material";
 // carrousel
 import { Swiper, SwiperSlide } from "swiper/react";
@@ -39,7 +39,7 @@ import {
   isStringEmpty,
   isValidNaturalNumber,
 } from "../../../../global-files/utils";
-import InputText from "../../../atoms/InputText";
+import { InputText } from "../../../atoms/InputText";
 
 const S3_BUCKET = process.env.REACT_APP_IMAGES_BUCKET;
 const REGION = "us-east-1";
@@ -54,7 +54,7 @@ const myBucket = new AWS.S3({
   region: REGION,
 });
 
-export default function Footer(props) {
+export const Footer = (props) => {
   const {
     chatType, // "merchant_product" | "order_product" | "ticket"
     dataChat /* {
@@ -666,4 +666,4 @@ export default function Footer(props) {
       />
     </>
   );
-}
+};

package/src/components/organisms/Chat/Header/Header.stories.js

@@ -1,4 +1,4 @@
-import Header from "./index";
+import { Header } from "./index";
 
 export default {
   title: "Components/organisms/Chat/Header",

package/src/components/organisms/Chat/Header/index.js

@@ -1,15 +1,15 @@
 import { Container } from "./styles";
 import { useEffect, useState } from "react";
-import CustomIcon from "../../../atoms/CustomIcon";
-import ButtonV2 from "../../../atoms/ButtonV2";
-import Image from "../../../atoms/Image";
+import { CustomIcon } from "../../../atoms/CustomIcon";
+import { ButtonV2 } from "../../../atoms/ButtonV2";
+import { Image } from "../../../atoms/Image";
 import {
   faComments as IconChat,
   faClose as IconX,
   faImage as IconImage,
 } from "@fortawesome/free-solid-svg-icons";
 
-export default function Header(props) {
+export const Header = (props) => {
   const {
     showBtnClose, // boolean
     showChatsList, // boolean
@@ -91,4 +91,4 @@ export default function Header(props) {
       </Container>
     </>
   );
-}
+};

package/src/components/organisms/Chat/index.js

@@ -4,8 +4,7 @@ import {
   ContainerPopUp,
 } from "./styles";
 import { useEffect, useState } from "react";
-import PropTypes from "prop-types";
-import ButtonV2 from "../../atoms/ButtonV2";
+import { ButtonV2 } from "../../atoms/ButtonV2";
 import { ContentChat } from "./ContentChat";
 import { faComments as IconChat } from "@fortawesome/free-solid-svg-icons";
 import { Slide } from "@mui/material";
@@ -14,7 +13,7 @@ import {
   isValidNaturalNumber,
 } from "../../../global-files/utils";
 
-export default function Chat(props) {
+export const Chat = (props) => {
   const {
     chatType, // "merchant_product" | "order_product" | "ticket"
     chatContainerType, // ("fixed") | ("popUp")
@@ -292,4 +291,4 @@ export default function Chat(props) {
       )}
     </>
   );
-}
+};

package/src/components/organisms/Modal/Modal.stories.js

@@ -1,5 +1,5 @@
-import Modal from "./index";
-import ButtonV2 from "../../atoms/ButtonV2";
+import { Modal } from "./index";
+import { ButtonV2 } from "../../atoms/ButtonV2";
 
 export default {
   title: "Components/organisms/Modal",

package/src/components/organisms/Modal/index.js

@@ -8,10 +8,10 @@ import {
 } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon as Icon } from "@fortawesome/react-fontawesome";
 import { Fade, Grow, Zoom, Modal as ModalMUI, Backdrop } from "@mui/material";
-import ButtonV2 from "../../atoms/ButtonV2";
-import CustomIcon from "../../atoms/CustomIcon";
+import { ButtonV2 } from "../../atoms/ButtonV2";
+import { CustomIcon } from "../../atoms/CustomIcon";
 
-export default function Modal(props) {
+export const Modal = (props) => {
   const {
     className, // clases CSS del componente raiz del modal
     show, // boolean
@@ -94,4 +94,4 @@ export default function Modal(props) {
       </Fade>
     </Backdrop>
   );
-}
+};

package/src/index.js

@@ -23,7 +23,16 @@ export * from "./components/atoms/Status/index";
 export * from "./components/atoms/TabSection/index";
 export * from "./components/atoms/ValidationPanel/index";
 export * from "./components/atoms/VerticalSideMenuMainPage/index";
+export * from "./components/atoms/ButtonFileChooser/index";
 export * from "./components/atoms/ButtonV2/index";
+export * from "./components/atoms/CustomIcon/index";
+export * from "./components/atoms/IconFile/index";
+export * from "./components/atoms/Image/index";
+export * from "./components/atoms/ImageLink/index";
+export * from "./components/atoms/ImagePreview/index";
+export * from "./components/atoms/InputText/index";
+export * from "./components/atoms/NotFound/index";
+export * from "./components/atoms/Tooltip/index";
 
 //molecules
 export * from "./components/molecules/AvatarAndValidation/index";
@@ -50,6 +59,8 @@ export * from "./components/molecules/TagAndInput/index";
 export * from "./components/molecules/VerificationCodeResetPasswordLogin/index";
 export * from "./components/molecules/RetailerSelector/index";
 export * from "./components/molecules/CustomSelect/index";
+export * from "./components/molecules/ButtonDownloadFile/index";
+export * from "./components/molecules/ImageTooltip/index";
 
 //organisms
 export * from "./components/organisms/ChangePassword/index";
@@ -61,6 +72,8 @@ export * from "./components/organisms/ImagePreviewer/index";
 export * from "./components/organisms/ImagesGroup/index";
 export * from "./components/organisms/InputGroup/index";
 export * from "./components/organisms/ProductImageModal/index";
+export * from "./components/organisms/Chat/index";
+export * from "./components/organisms/Modal/index";
 
 //pages
 export * from "./components/pages/ChangePasswordLogin";