{"version":3,"sources":["../node_modules/react-measure/node_modules/@babel/runtime/helpers/esm/extends.js","../node_modules/react-measure/node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js","../node_modules/react-measure/dist/index.esm.js","../node_modules/react-measure/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js","../node_modules/react-measure/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js","components/Shared/Camera.js","hooks/useUserMedia.js","components/Modals/SignView/Ine.js"],"names":["_extends","Object","assign","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","this","_setPrototypeOf","o","p","setPrototypeOf","__proto__","types","getTypes","props","allowedTypes","forEach","type","push","getContentRect","node","calculations","indexOf","client","top","clientTop","left","clientLeft","width","clientWidth","height","clientHeight","offset","offsetTop","offsetLeft","offsetWidth","offsetHeight","scroll","scrollTop","scrollLeft","scrollWidth","scrollHeight","rect","getBoundingClientRect","bounds","right","bottom","styles","getComputedStyle","margin","parseInt","marginTop","marginRight","marginBottom","marginLeft","getWindowOf","ownerDocument","defaultView","window","Measure","WrappedComponent","_class","_temp","_Component","subClass","superClass","WithContentRect","_this","_len","args","Array","_key","concat","state","contentRect","entry","_animationFrameID","_resizeObserver","_node","_window","measure","entries","requestAnimationFrame","setState","onResize","_handleRef","unobserve","innerRef","current","observe","create","constructor","_proto","componentDidMount","ResizeObserver","componentWillUnmount","cancelAnimationFrame","disconnect","render","_this$props","excluded","sourceKeys","keys","_objectWithoutPropertiesLoose","createElement","measureRef","Component","propTypes","PropTypes","bool","oneOfType","object","func","withContentRect","_ref","children","displayName","CAPTURE_OPTIONS","audio","video","facingMode","flashAnimation","keyframes","Wrapper","styled","div","Container","maxWidth","maxHeight","show","Canvas","canvas","Video","Overlay","Flash","flash","css","button","Camera","onCapture","onClear","onGoBack","canvasRef","onContinue","useRef","videoRef","useState","container","setContainer","isVideoPlaying","setIsVideoPlaying","isCanvasEmpty","setIsCanvasEmpty","isFlashing","setIsFlashing","image","setImage","mediaStream","requestedMedia","setMediaStream","navigator","getUserMedia","webkitGetUserMedia","mozGetUserMedia","msGetUserMedia","useEffect","a","mediaDevices","stream","getTracks","track","stop","enableStream","useUserMedia","initialRatio","aspectRatio","setAspectRatio","calculateRatio","useCallback","useCardRatio","offsets","vWidth","vHeight","cWidth","cHeight","x","y","setOffsets","Math","round","useOffsets","videoWidth","videoHeight","handleCanPlay","console","log","play","handleCapture","getContext","drawImage","toBlob","blob","handleClear","clearRect","srcObject","handleChooseFile","eleInput","document","style","display","accept","onchange","e","file","files","URL","createObjectURL","click","src","ref","hidden","onCanPlay","autoPlay","playsInline","muted","onAnimationEnd","className","onClick","initialState","front","back","Ine","useTranslation","t","useSign","modal","contractId","contract","jwt","dispatch","participant","signViewOptions","currentParticipant","useLocalStorage","_id","ineState","setIneState","showCamera","setShowCamera","selectedIne","setSelectedIne","useMutation","payload","fetcher","extractINEData","onSuccess","data","variables","produce","draft","extractedInfo","ineData","mutateExtractINEData","mutate","isLoadingExtract","isLoading","detectText","isTextDetected","fileId","mutateDetectText","isLoadingDetect","action","participantId","clientContractAction","handleClose","mutateSendInformation","isLoadingSend","useFileUpload","isUploaded","startTextExtraction","uploadFrontIne","uploadFile","uploadFrontIneState","uploadFileState","uploadBackIne","uploadBackIneState","CONTROL_MODAL","close","INE_MODAL","onIneItemClick","id","isLoaded","Modal","isOpen","includes","centered","ModalHeader","toggle","ModalBody","Media","body","IneProperty","label","value","lastName","lastName2","name","gender","birthDate","address","curp","claveElector","disabled","File","undefined","IneItem","active","text","isDisabled","isUploading","isExtracting","useHover","hoverRef","isHovered","clsx","Spinner","size"],"mappings":"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","file":"static/js/14.38131009.chunk.js","sourcesContent":["export default function _extends() {\n  _extends = Object.assign || function (target) {\n    for (var i = 1; i < arguments.length; i++) {\n      var source = arguments[i];\n\n      for (var key in source) {\n        if (Object.prototype.hasOwnProperty.call(source, key)) {\n          target[key] = source[key];\n        }\n      }\n    }\n\n    return target;\n  };\n\n  return _extends.apply(this, arguments);\n}","export default function _setPrototypeOf(o, p) {\n  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {\n    o.__proto__ = p;\n    return o;\n  };\n\n  return _setPrototypeOf(o, p);\n}","import _extends from '@babel/runtime/helpers/esm/extends';\nimport _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose';\nimport _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';\nimport { Component, createElement } from 'react';\nimport PropTypes from 'prop-types';\nimport ResizeObserver from 'resize-observer-polyfill';\n\nvar types = ['client', 'offset', 'scroll', 'bounds', 'margin'];\nfunction getTypes(props) {\n  var allowedTypes = [];\n  types.forEach(function (type) {\n    if (props[type]) {\n      allowedTypes.push(type);\n    }\n  });\n  return allowedTypes;\n}\n\nfunction getContentRect(node, types) {\n  var calculations = {};\n\n  if (types.indexOf('client') > -1) {\n    calculations.client = {\n      top: node.clientTop,\n      left: node.clientLeft,\n      width: node.clientWidth,\n      height: node.clientHeight\n    };\n  }\n\n  if (types.indexOf('offset') > -1) {\n    calculations.offset = {\n      top: node.offsetTop,\n      left: node.offsetLeft,\n      width: node.offsetWidth,\n      height: node.offsetHeight\n    };\n  }\n\n  if (types.indexOf('scroll') > -1) {\n    calculations.scroll = {\n      top: node.scrollTop,\n      left: node.scrollLeft,\n      width: node.scrollWidth,\n      height: node.scrollHeight\n    };\n  }\n\n  if (types.indexOf('bounds') > -1) {\n    var rect = node.getBoundingClientRect();\n    calculations.bounds = {\n      top: rect.top,\n      right: rect.right,\n      bottom: rect.bottom,\n      left: rect.left,\n      width: rect.width,\n      height: rect.height\n    };\n  }\n\n  if (types.indexOf('margin') > -1) {\n    var styles = getComputedStyle(node);\n    calculations.margin = {\n      top: styles ? parseInt(styles.marginTop) : 0,\n      right: styles ? parseInt(styles.marginRight) : 0,\n      bottom: styles ? parseInt(styles.marginBottom) : 0,\n      left: styles ? parseInt(styles.marginLeft) : 0\n    };\n  }\n\n  return calculations;\n}\n\n/**\n * Returns the global window object associated with provided element.\n */\nfunction getWindowOf(target) {\n  // Assume that the element is an instance of Node, which means that it\n  // has the \"ownerDocument\" property from which we can retrieve a\n  // corresponding global object.\n  var ownerGlobal = target && target.ownerDocument && target.ownerDocument.defaultView; // Return the local window object if it's not possible extract one from\n  // provided element.\n\n  return ownerGlobal || window;\n}\n\nfunction withContentRect(types) {\n  return function (WrappedComponent) {\n    var _class, _temp;\n\n    return _temp = _class =\n    /*#__PURE__*/\n    function (_Component) {\n      _inheritsLoose(WithContentRect, _Component);\n\n      function WithContentRect() {\n        var _this;\n\n        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n          args[_key] = arguments[_key];\n        }\n\n        _this = _Component.call.apply(_Component, [this].concat(args)) || this;\n        _this.state = {\n          contentRect: {\n            entry: {},\n            client: {},\n            offset: {},\n            scroll: {},\n            bounds: {},\n            margin: {}\n          }\n        };\n        _this._animationFrameID = null;\n        _this._resizeObserver = null;\n        _this._node = null;\n        _this._window = null;\n\n        _this.measure = function (entries) {\n          var contentRect = getContentRect(_this._node, types || getTypes(_this.props));\n\n          if (entries) {\n            contentRect.entry = entries[0].contentRect;\n          }\n\n          _this._animationFrameID = _this._window.requestAnimationFrame(function () {\n            if (_this._resizeObserver !== null) {\n              _this.setState({\n                contentRect: contentRect\n              });\n\n              if (typeof _this.props.onResize === 'function') {\n                _this.props.onResize(contentRect);\n              }\n            }\n          });\n        };\n\n        _this._handleRef = function (node) {\n          if (_this._resizeObserver !== null && _this._node !== null) {\n            _this._resizeObserver.unobserve(_this._node);\n          }\n\n          _this._node = node;\n          _this._window = getWindowOf(_this._node);\n          var innerRef = _this.props.innerRef;\n\n          if (innerRef) {\n            if (typeof innerRef === 'function') {\n              innerRef(_this._node);\n            } else {\n              innerRef.current = _this._node;\n            }\n          }\n\n          if (_this._resizeObserver !== null && _this._node !== null) {\n            _this._resizeObserver.observe(_this._node);\n          }\n        };\n\n        return _this;\n      }\n\n      var _proto = WithContentRect.prototype;\n\n      _proto.componentDidMount = function componentDidMount() {\n        this._resizeObserver = this._window !== null && this._window.ResizeObserver ? new this._window.ResizeObserver(this.measure) : new ResizeObserver(this.measure);\n\n        if (this._node !== null) {\n          this._resizeObserver.observe(this._node);\n\n          if (typeof this.props.onResize === 'function') {\n            this.props.onResize(getContentRect(this._node, types || getTypes(this.props)));\n          }\n        }\n      };\n\n      _proto.componentWillUnmount = function componentWillUnmount() {\n        if (this._window !== null) {\n          this._window.cancelAnimationFrame(this._animationFrameID);\n        }\n\n        if (this._resizeObserver !== null) {\n          this._resizeObserver.disconnect();\n\n          this._resizeObserver = null;\n        }\n      };\n\n      _proto.render = function render() {\n        var _this$props = this.props,\n            innerRef = _this$props.innerRef,\n            onResize = _this$props.onResize,\n            props = _objectWithoutPropertiesLoose(_this$props, [\"innerRef\", \"onResize\"]);\n\n        return createElement(WrappedComponent, _extends({}, props, {\n          measureRef: this._handleRef,\n          measure: this.measure,\n          contentRect: this.state.contentRect\n        }));\n      };\n\n      return WithContentRect;\n    }(Component), _class.propTypes = {\n      client: PropTypes.bool,\n      offset: PropTypes.bool,\n      scroll: PropTypes.bool,\n      bounds: PropTypes.bool,\n      margin: PropTypes.bool,\n      innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n      onResize: PropTypes.func\n    }, _temp;\n  };\n}\n\nvar Measure = withContentRect()(function (_ref) {\n  var measure = _ref.measure,\n      measureRef = _ref.measureRef,\n      contentRect = _ref.contentRect,\n      children = _ref.children;\n  return children({\n    measure: measure,\n    measureRef: measureRef,\n    contentRect: contentRect\n  });\n});\nMeasure.displayName = 'Measure';\nMeasure.propTypes.children = PropTypes.func;\n\nexport default Measure;\nexport { withContentRect };\n","import setPrototypeOf from \"./setPrototypeOf.js\";\nexport default function _inheritsLoose(subClass, superClass) {\n  subClass.prototype = Object.create(superClass.prototype);\n  subClass.prototype.constructor = subClass;\n  setPrototypeOf(subClass, superClass);\n}","export default function _objectWithoutPropertiesLoose(source, excluded) {\n  if (source == null) return {};\n  var target = {};\n  var sourceKeys = Object.keys(source);\n  var key, i;\n\n  for (i = 0; i < sourceKeys.length; i++) {\n    key = sourceKeys[i];\n    if (excluded.indexOf(key) >= 0) continue;\n    target[key] = source[key];\n  }\n\n  return target;\n}","import React, { useRef, useState, useEffect,  useCallback } from 'react';\r\nimport Measure from 'react-measure';\r\nimport styled, { css, keyframes } from 'styled-components';\r\n\r\nimport { useUserMedia } from 'hooks/useUserMedia';\r\n\r\nconst CAPTURE_OPTIONS = {\r\n    audio: false,\r\n    video: { facingMode: 'environment' },\r\n};\r\n\r\nconst flashAnimation = keyframes`\r\n  from {\r\n    opacity: 0.75;\r\n  }\r\n\r\n  to {\r\n    opacity: 0;\r\n  }\r\n`;\r\n\r\nconst Wrapper = styled.div`\r\n  display: flex;\r\n  flex-flow: column;\r\n  align-items: center;\r\n  width: 100%;\r\n`;\r\n\r\nconst Container = styled.div`\r\n  position: relative;\r\n  overflow: hidden;\r\n  width: 100%;\r\n  max-width: ${({ maxWidth }) => maxWidth && `${maxWidth}px`};\r\n  max-height: ${({ maxHeight }) => maxHeight && `${maxHeight}px`};\r\n  display: ${({ show }) => show ? 'block' : 'none'};\r\n`;\r\n\r\nconst Canvas = styled.canvas`\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n`;\r\n\r\nconst Video = styled.video`\r\n  position: absolute;\r\n\r\n  &::-webkit-media-controls-play-button {\r\n    display: none !important;\r\n    -webkit-appearance: none;\r\n  }\r\n`;\r\n\r\nconst Overlay = styled.div`\r\n  position: absolute;\r\n  top: 20px;\r\n  right: 20px;\r\n  bottom: 20px;\r\n  left: 20px;\r\n  box-shadow: 0px 0px 20px 56px rgba(0, 0, 0, 0.6);\r\n  border: 1px solid #ffffff;\r\n  border-radius: 10px;\r\n`;\r\n\r\nconst Flash = styled.div`\r\n  position: absolute;\r\n  top: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  left: 0;\r\n  opacity: 0;\r\n  background-color: #ffffff;\r\n\r\n  ${({ flash }) => {\r\n    if (flash) {\r\n      return css`\r\n        animation: ${flashAnimation} 750ms ease-out;\r\n      `;\r\n    }\r\n  }}\r\n`;\r\n\r\nconst Button = styled.button`\r\n  width: 75%;\r\n  min-width: 100px;\r\n  max-width: 250px;\r\n  margin-top: 24px;\r\n  padding: 12px 24px;\r\n  background: silver;\r\n`;\r\n\r\nexport function Camera({ onCapture, onClear, onGoBack, onContinue }) {\r\n  const canvasRef = useRef();\r\n  const videoRef = useRef();\r\n\r\n  const [container, setContainer] = useState({ width: 150, height: 150 });\r\n  const [isVideoPlaying, setIsVideoPlaying] = useState(false);\r\n  const [isCanvasEmpty, setIsCanvasEmpty] = useState(true);\r\n  const [isFlashing, setIsFlashing] = useState(false);\r\n  const [image, setImage] = useState(null);\r\n\r\n  const mediaStream = useUserMedia(CAPTURE_OPTIONS);\r\n  const [aspectRatio, calculateRatio] = useCardRatio(1.586);\r\n  const offsets = useOffsets(\r\n    videoRef.current && videoRef.current.videoWidth,\r\n    videoRef.current && videoRef.current.videoHeight,\r\n    container.width,\r\n    container.height\r\n  );\r\n\r\n  useEffect(() => {\r\n    if (mediaStream && videoRef.current && !videoRef.current.srcObject) {\r\n      videoRef.current.srcObject = mediaStream;\r\n    }\r\n  }, [mediaStream, videoRef.current])\r\n\r\n\r\n  console.log({mediaStream, canvasRef, videoRef})\r\n\r\n  function handleResize(contentRect) {\r\n    console.log({contentRect})\r\n    setContainer({\r\n      width: contentRect.bounds.width,\r\n      height: Math.round(contentRect.bounds.width / aspectRatio)\r\n    });\r\n  }\r\n\r\n  function handleCanPlay() {\r\n    console.log('playing')\r\n    calculateRatio(videoRef.current.videoHeight, videoRef.current.videoWidth);\r\n    setIsVideoPlaying(true);\r\n    videoRef.current.play();\r\n  }\r\n\r\n  function handleCapture() {\r\n    const context = canvasRef.current.getContext('2d');\r\n\r\n    context.drawImage(\r\n      videoRef.current,\r\n      offsets.x,\r\n      offsets.y,\r\n      container.width,\r\n      container.height,\r\n      0,\r\n      0,\r\n      container.width,\r\n      container.height\r\n    );\r\n\r\n    canvasRef.current.toBlob(blob => onCapture(blob), 'image/jpeg', 1);\r\n    setIsCanvasEmpty(false);\r\n    setIsFlashing(true);\r\n  }\r\n\r\n  function handleClear() {\r\n    if (!image) {\r\n      const context = canvasRef.current.getContext('2d');\r\n      context.clearRect(0, 0, canvasRef.current.width, canvasRef.current.height);\r\n      setIsCanvasEmpty(true);\r\n    } else {\r\n      setImage(null)\r\n    }\r\n    onClear();\r\n  }\r\n\r\n  console.log({container, isVideoPlaying, isCanvasEmpty})\r\n\r\n  const handleChooseFile = () => {\r\n    const eleInput = document.createElement('input');\r\n    eleInput.type = 'file';\r\n    eleInput.style.display = 'none';\r\n    eleInput.accept = 'image/*';\r\n    eleInput.onchange = (e) => {\r\n      const file = e.target.files[0];\r\n\r\n      if (file) {\r\n        onCapture(file)\r\n        \r\n        setImage( URL.createObjectURL(file))\r\n        setIsCanvasEmpty(true);\r\n      }\r\n    };\r\n    eleInput.click();\r\n  }\r\n\r\n  if (!mediaStream) {\r\n    return <div>\r\n        Cargando...\r\n      </div>;\r\n  }\r\n\r\n  return (\r\n    <Measure bounds onResize={handleResize}>\r\n      {({ measureRef }) => (\r\n        <Wrapper>\r\n        { image  &&\r\n              <img src={image} style={{width: 450, height: 300}} /> }\r\n          <Container\r\n            ref={measureRef}\r\n            maxHeight={videoRef.current && videoRef.current.videoHeight}\r\n            maxWidth={videoRef.current && videoRef.current.videoWidth}\r\n            style={{\r\n              height: `${container.height}px`\r\n            }}\r\n            show={!image}\r\n          >\r\n            <Video\r\n              ref={videoRef}\r\n              hidden={!isVideoPlaying}\r\n              onCanPlay={handleCanPlay}\r\n              autoPlay\r\n              playsInline\r\n              muted\r\n              style={{\r\n                top: `-${offsets.y}px`,\r\n                left: `-${offsets.x}px`\r\n              }}\r\n            />\r\n\r\n            <Overlay hidden={!isVideoPlaying} />\r\n          \r\n            <Canvas\r\n              ref={canvasRef}\r\n              width={container.width}\r\n              height={container.height}\r\n            /> \r\n        \r\n            <Flash\r\n              flash={isFlashing}\r\n              onAnimationEnd={() => setIsFlashing(false)}\r\n            />\r\n          </Container>\r\n        \r\n          {isVideoPlaying && (\r\n            <div className=\"p-2\">\r\n             {onGoBack && <button className=\"btn btn-secondary mx-2\" onClick={onGoBack}>\r\n                Confirmar\r\n              </button>}\r\n              <button className=\"btn btn-primary mx-3\" onClick={isCanvasEmpty && !image ? handleCapture : handleClear}>\r\n                {isCanvasEmpty && !image ? <i className=\"fas fa-camera text-light\"></i> : <i className=\"fas fa-undo text-light\"></i>}\r\n                {isCanvasEmpty && !image ? ' Tomar foto' : ' Tomar otra foto'}\r\n              </button>\r\n              {/* <button className=\"btn btn-secondary\" onClick={isCanvasEmpty ? handleCapture : handleClear}>\r\n                Subir imagen\r\n              </button> */}\r\n              {/* <button className=\"btn btn-secondary\" onClick={onContinue}>\r\n                Subir\r\n              </button> */}\r\n            </div>\r\n         \r\n          )}\r\n          {isVideoPlaying && (\r\n            <div className=\"p-1 text-primary hover_text-decoration-underline\" onClick={handleChooseFile}>\r\n              <small>Subir imagen</small>\r\n            </div>\r\n          )}\r\n        </Wrapper>\r\n        )}\r\n     </Measure>\r\n  );\r\n}\r\n\r\nexport function useCardRatio(initialRatio) {\r\n  const [aspectRatio, setAspectRatio] = useState(initialRatio);\r\n\r\n  const calculateRatio = useCallback((height, width) => {\r\n    if (height && width) {\r\n      const isLandscape = height <= width;\r\n      const ratio = isLandscape ? width / height : height / width;\r\n\r\n      setAspectRatio(ratio);\r\n    }\r\n  }, []);\r\n\r\n  return [aspectRatio, calculateRatio];\r\n}\r\n\r\nexport function useOffsets(vWidth, vHeight, cWidth, cHeight) {\r\n  const [offsets, setOffsets] = useState({ x: 0, y: 0 });\r\n\r\n  useEffect(() => {\r\n    if (vWidth && vHeight && cWidth && cHeight) {\r\n      const x = vWidth > cWidth\r\n        ? Math.round((vWidth - cWidth) / 2)\r\n        : 0;\r\n\r\n      const y = vHeight > cHeight\r\n        ? Math.round((vHeight - cHeight) / 2)\r\n        : 0;\r\n\r\n      setOffsets({ x, y });\r\n    }\r\n  }, [vWidth, vHeight, cWidth, cHeight]);\r\n\r\n  return offsets;\r\n}","import { useState, useEffect } from 'react';\r\n\r\nexport function useUserMedia(requestedMedia) {\r\n  const [mediaStream, setMediaStream] = useState(null);\r\n  \r\n  const hasGetUserMedia = !!(navigator.getUserMedia || navigator.webkitGetUserMedia ||\r\n    navigator.mozGetUserMedia || navigator.msGetUserMedia);\r\n\r\n  useEffect(() => {\r\n    async function enableStream() {\r\n      try {\r\n        const stream = await navigator.mediaDevices.getUserMedia(requestedMedia);\r\n        setMediaStream(stream);\r\n      } catch(err) {\r\n        // Removed for brevity\r\n      }\r\n    }\r\n\r\n    if (!mediaStream) {\r\n      enableStream();\r\n    } else {\r\n      return function cleanup() {\r\n        mediaStream.getTracks().forEach(track => {\r\n          track.stop();\r\n        });\r\n      }\r\n    }\r\n  }, [mediaStream, requestedMedia]);\r\n\r\n  return mediaStream;\r\n}","import React, { useState, useEffect } from 'react';\r\nimport { useTranslation } from 'react-i18next';\r\nimport { useForm } from 'react-hook-form';\r\nimport { useMutation } from 'react-query';\r\nimport clsx from 'clsx';\r\nimport produce from 'immer';\r\nimport { ModalHeader, Spinner, Modal, ModalBody, Media } from 'reactstrap';\r\n\r\nimport { fetcher } from 'api/client';\r\nimport useFileUpload from 'api/hooks/file/useFileUpload';\r\nimport { detectText, extractINEData } from 'api/actions/file';\r\nimport { clientContractAction } from 'api/actions/contracts';\r\nimport { convertToBase64 } from 'utils';\r\nimport { Camera } from 'components/Shared/Camera'\r\nimport { useHover } from 'hooks/useHover';\r\nimport useLocalStorage from 'hooks/useLocalStorage';\r\nimport { CONTROL_MODAL, INE_MODAL, useSign } from 'context/signview';\r\n\r\nconst initialState = {\r\n    front: {},\r\n    back: {}\r\n}\r\n\r\nexport default function Ine() {\r\n\r\n    const { t } = useTranslation();\r\n    const [{ modal, contractId, contract, jwt }, dispatch] = useSign();\r\n    const participant = contract?.signViewOptions?.currentParticipant || {};\r\n    const [ineState, setIneState] = useLocalStorage(`INE-contract-${contractId}-${participant._id}`, initialState)\r\n    const [showCamera, setShowCamera] = useState(false)\r\n    const [selectedIne, setSelectedIne] = useState(null)\r\n\r\n    const { mutate: mutateExtractINEData, isLoading: isLoadingExtract } = useMutation((payload) => fetcher(extractINEData(payload), jwt), {\r\n        onSuccess: (data, variables) => {\r\n            setIneState(produce(draft => {\r\n                draft.front.extractedInfo = data.ineData;\r\n            }))\r\n        }\r\n    });\r\n    const { mutate: mutateDetectText, isLoading: isLoadingDetect } = useMutation((payload) => fetcher(detectText(payload), jwt), {\r\n        onSuccess: (data, variables) => {\r\n            console.log('extract info')\r\n            setIneState(produce(draft => {\r\n                draft.front.isTextDetected = true;\r\n            }))\r\n            mutateExtractINEData({ fileId: variables.fileId })\r\n        }\r\n    });\r\n    const { mutate: mutateSendInformation, isLoading: isLoadingSend } = useMutation(({ contractId, action, participantId, ...payload }) => fetcher(clientContractAction(contractId, action, payload), jwt), {\r\n        onSuccess: (data, variables) => {\r\n            console.log('info sent')\r\n            handleClose()\r\n        }\r\n    });\r\n    const { uploadFile: uploadFrontIne, uploadFileState: uploadFrontIneState } = useFileUpload({\r\n        jwt,\r\n        onSuccess: (data) => {\r\n            setIneState(produce(draft => {\r\n                draft.front.isUploaded = true;\r\n                draft.front.fileId = data.fileId;\r\n            }))\r\n            startTextExtraction(data.fileId)\r\n        }\r\n    })\r\n    const { uploadFile: uploadBackIne, uploadFileState: uploadBackIneState } = useFileUpload({\r\n        jwt,\r\n        onSuccess: (data) => {\r\n            setIneState(produce(draft => {\r\n                draft.back.isUploaded = true;\r\n            }))\r\n        }\r\n    })\r\n\r\n    const startTextExtraction = (fileId) => {\r\n        mutateDetectText({ fileId })\r\n        // mutateExtractINEData({ fileId: ineState.front.fileId })\r\n        // mutateExtractINEData({ fileId: '5ffdd99f8ec8787de86a4441'})\r\n    }\r\n\r\n    const handleClose = () => {\r\n        dispatch({ type: CONTROL_MODAL, close: INE_MODAL })\r\n    }\r\n\r\n    const toggleCamera = () => setShowCamera(!showCamera);\r\n    const onIneItemClick = (id) => {\r\n        setSelectedIne(id)\r\n        toggleCamera()\r\n    }\r\n    const handleCapture = (image) => {\r\n        if (!selectedIne) return;\r\n\r\n        setIneState(produce(draft => {\r\n            draft[selectedIne].isLoaded = true;\r\n            draft[selectedIne].image = new File([image], `ine-${selectedIne}.jpg`, {\r\n                type: image.type\r\n            });\r\n        }))\r\n    }\r\n    const handleClear = () => {\r\n        if (!selectedIne) return;\r\n\r\n        setIneState(produce(draft => {\r\n            draft[selectedIne].isLoaded = false;\r\n            draft[selectedIne].image = undefined;\r\n        }))\r\n    }\r\n\r\n    const handleGoBack = () => {\r\n        setSelectedIne(null);\r\n        setShowCamera(false);\r\n    }\r\n\r\n    const handleUpload = () => {\r\n        if (ineState.front.fileId) {\r\n            return startTextExtraction(ineState.front.fileId)\r\n        }\r\n        uploadFrontIne({\r\n            file: ineState.front.image,\r\n            name: ineState.front.image.name\r\n        })\r\n        uploadBackIne({\r\n            file: ineState.back.image,\r\n            name: ineState.back.image.name\r\n        })\r\n    }\r\n    const handleSendInformation = () => {\r\n        mutateSendInformation({\r\n            contractId,\r\n            action: 'sendineinformation',\r\n            participantId: participant._id,\r\n            fileId: ineState.front.fileId\r\n        })\r\n    }\r\n\r\n    useEffect(() => {\r\n        setIneState(produce(draft => {\r\n            draft.front.isLoaded = draft.front.isLoaded && !!draft.front.fileId;\r\n            draft.back.isLoaded = draft.front.isLoaded;\r\n\r\n        }))\r\n    }, [])\r\n\r\n    return (\r\n        <Modal isOpen={modal.includes(INE_MODAL)} centered>\r\n            <ModalHeader toggle={handleClose}>\r\n                <div className=\"text-capitalize font-weight-bold\">Datos de tu INE</div>\r\n                <div className=\"\">Toma foto de tu INE y llena tus datos automáticamente.</div>\r\n            </ModalHeader>\r\n            <ModalBody>\r\n                <Media>\r\n                    <Media body className=\" container position-relative\">\r\n                        {!ineState.front.extractedInfo ?\r\n                            <div className=\"text-center\">\r\n                                {showCamera ?\r\n                                    <Camera onCapture={handleCapture} onClear={handleClear} onGoBack={handleGoBack} />\r\n                                    : (\r\n                                        <div className=\"d-flex flex-column align-items-center\">\r\n                                            <IneItem\r\n                                                id=\"front\"\r\n                                                className=\"mb-3\"\r\n                                                active={ineState.front.isLoaded}\r\n                                                image={'/images/ine1.jpg'}\r\n                                                text=\"Subir foto (frente)\"\r\n                                                onClick={onIneItemClick}\r\n                                                isDisabled={uploadFrontIneState.isLoading || uploadBackIneState.isLoading}\r\n                                                isUploading={uploadFrontIneState.isLoading}\r\n                                                isExtracting={isLoadingExtract || isLoadingDetect}\r\n                                            />\r\n                                            <IneItem\r\n                                                id=\"back\"\r\n                                                active={ineState.back.isLoaded}\r\n                                                image={'/images/ine2.jpg'}\r\n                                                text=\"Subir foto (reverso)\"\r\n                                                onClick={onIneItemClick}\r\n                                                isDisabled={uploadFrontIneState.isLoading || uploadBackIneState.isLoading}\r\n                                                isUploading={uploadBackIneState.isLoading}\r\n                                                isExtracting={isLoadingExtract || isLoadingDetect}\r\n                                            />\r\n                                        </div>\r\n                                    )\r\n                                }\r\n                                {!showCamera &&\r\n\r\n                                    <button\r\n                                        className=\"btn btn-primary mt-2 mx-2\"\r\n                                        onClick={handleUpload}\r\n                                        disabled={!ineState.front.isLoaded || !ineState.back.isLoaded || uploadFrontIneState.isLoading || uploadBackIneState.isLoading}\r\n                                    >\r\n                                        {uploadFrontIneState.isLoading || uploadBackIneState.isLoading ?\r\n                                            'Subiendo...'\r\n                                            : isLoadingExtract || isLoadingDetect ?\r\n                                                'Extrayendo...'\r\n                                                : 'Subir'\r\n                                        }\r\n                                    </button>\r\n                                }\r\n                            </div>\r\n                            :\r\n                            <div>\r\n                                <div className=\"p-2\">\r\n                                    <IneProperty label=\"Apellido(s)\" value={`${ineState.front.extractedInfo.lastName ?? ''} ${ineState.front.extractedInfo.lastName2 ?? ''}`} />\r\n                                    <IneProperty label=\"Nombre(s)\" value={ineState.front.extractedInfo.name} />\r\n                                    <IneProperty label=\"Sexo\" value={ineState.front.extractedInfo.gender} />\r\n                                    <IneProperty label=\"Fecha de nacimiento\" value={ineState.front.extractedInfo.birthDate} />\r\n                                    <IneProperty label=\"Domicilio\" value={ineState.front.extractedInfo.address} />\r\n                                    <IneProperty label=\"CURP\" value={ineState.front.extractedInfo.curp} />\r\n                                    <IneProperty label=\"Clave de elector\" value={ineState.front.extractedInfo.claveElector} />\r\n                                </div>\r\n                                <div className=\"text-center\">\r\n                                    <button\r\n                                        className=\"btn btn-primary mt-2 mx-2\"\r\n                                        onClick={handleSendInformation}\r\n                                        disabled={isLoadingSend}\r\n                                    >\r\n                                        Enviar informacion\r\n                                        </button>\r\n                                </div>\r\n                            </div>\r\n                        }\r\n                    </Media>\r\n                </Media>\r\n            </ModalBody>\r\n        </Modal>\r\n    )\r\n}\r\n\r\nfunction IneProperty({ label, value }) {\r\n    return (\r\n        <div className=\"d-flex flex-column p-1\">\r\n            <strong className=\"text-uppercase text-primary\"><small>{label}</small></strong> {value}\r\n        </div>\r\n    )\r\n}\r\n\r\n\r\nfunction IneItem({ className, id, active, image, text, isUploading, isExtracting, isDisabled, onClick }) {\r\n    const [hoverRef, isHovered] = useHover();\r\n\r\n    const handleClick = () => {\r\n        if (isDisabled) return;\r\n        onClick(id)\r\n    }\r\n\r\n    return (\r\n        <div ref={hoverRef} className={clsx('rounded border p-3 d-flex align-items-center', className, isHovered && !isDisabled && 'border-primary pointer')} style={{ width: 300 }} onClick={handleClick}>\r\n            <div className=\"px-2\">\r\n                {active ? <i className=\"fas fa-check-circle text-success\"></i> : <i className=\"fas fa-circle text-muted\" ></i>}\r\n            </div>\r\n            <img src={image} style={{ width: 60, height: 40 }} />\r\n            <div className=\"px-2 w-100\">\r\n                {text}\r\n            </div>\r\n            {(isUploading || isExtracting) &&\r\n                <div>\r\n                    <Spinner size=\"xs\" />\r\n                </div>\r\n            }\r\n        </div>\r\n    )\r\n}"],"sourceRoot":""}