@corva/ui 3.36.0-2 → 3.36.0-4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs-bundle/components/Attachment/index.js +1 -1
- package/cjs-bundle/components/Attachment/index.js.map +1 -1
- package/cjs-bundle/components/Chart/effects/useChartModifier.js +1 -1
- package/cjs-bundle/components/Chart/effects/useChartModifier.js.map +1 -1
- package/cjs-bundle/effects/useSignedURL.js +1 -1
- package/cjs-bundle/effects/useSignedURL.js.map +1 -1
- package/components/Attachment/index.js +1 -1
- package/components/Attachment/index.js.map +1 -1
- package/components/Chart/effects/useChartModifier.js +1 -1
- package/components/Chart/effects/useChartModifier.js.map +1 -1
- package/effects/useSignedURL.d.ts +1 -1
- package/effects/useSignedURL.d.ts.map +1 -1
- package/effects/useSignedURL.js +1 -1
- package/effects/useSignedURL.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("@babel/runtime/helpers/slicedToArray"),s=require("react"),i=require("prop-types"),t=require("react-player"),n=require("classnames"),a=require("@material-ui/core/styles"),o=require("@material-ui/core"),r=require("@material-ui/icons/Image"),c=require("@material-ui/icons/Fullscreen"),l=require("@material-ui/core/colors/grey"),u=require("../NewDocumentViewer/NewDocumentViewer.js"),m=require("../NewDocumentViewer/icons/UnavailableFileIcon.js"),d=require("./styles.css.js"),h=require("../FileTypeIcon.js"),p=require("../ImageViewer/index.js"),q=require("../IconButton/index.js"),j=require("../../utils/mobileDetect.js"),f=require("../../utils/fileExtension.js"),g=require("../../utils/filePreview.js"),v=require("../../icons/iconParkIcons.js");require("../../icons/customIcons/icons/AddMessage.js"),require("../../icons/customIcons/icons/Attention.js"),require("../../icons/customIcons/icons/Collapse.js"),require("../../icons/customIcons/icons/Dashboard.js"),require("../../icons/customIcons/icons/Expand.js"),require("../../icons/customIcons/icons/FolderClosed.js"),require("../../icons/customIcons/icons/FolderClosedFilled.js"),require("../../icons/customIcons/icons/FolderOpened.js"),require("../../icons/customIcons/icons/GreaterOrEqual.js"),require("../../icons/customIcons/icons/LessOrEqual.js"),require("../../icons/customIcons/icons/Search.js"),require("../../icons/customIcons/icons/Wellhub.js"),require("../../icons/customIcons/icons/MultiRuler.js"),require("../../icons/customIcons/icons/Checkbox.js"),require("../../icons/customIcons/icons/CheckboxChecked.js"),require("../../icons/customIcons/icons/CheckboxIndeterminate.js"),require("../../icons/customIcons/icons/Radio.js"),require("../../icons/customIcons/icons/RadioChecked.js"),require("../../icons/customIcons/icons/SimulFrac.js"),require("../../icons/customIcons/icons/ZipperFrac.js"),require("../../icons/customIcons/icons/CautionFilled.js"),require("../../icons/customIcons/icons/MoreApp.js"),require("../../icons/customIcons/icons/Pad.js"),require("../../icons/customIcons/icons/DrilloutUnit.js"),require("../../icons/customIcons/icons/FracFleet.js"),require("../../icons/customIcons/icons/Global.js"),require("../../icons/customIcons/icons/Program.js"),require("../../icons/customIcons/icons/Rig.js"),require("../../icons/customIcons/icons/Well.js"),require("../../icons/customIcons/icons/Gap.js"),require("../../icons/customIcons/icons/Pin.js"),require("../../icons/customIcons/icons/CloseOneFilled.js"),require("../../icons/customIcons/icons/AttentionFilled.js"),require("../../icons/customIcons/icons/CheckOneFilled.js"),require("../../icons/customIcons/icons/Archive.js"),require("../../icons/customIcons/icons/ArchiveCancel.js"),require("../../icons/customIcons/icons/Unarchive.js"),require("../../icons/customIcons/icons/Archived.js"),require("../../icons/customIcons/icons/InterventionUnit.js"),require("../../clients/subscriptions/constants.js"),require("@babel/runtime/helpers/asyncToGenerator"),require("@babel/runtime/helpers/defineProperty"),require("@babel/runtime/regenerator"),require("querystring"),require("uuid/v1"),require("lodash"),require("../../clients/subscriptions.v1.js"),require("../../clients/jsonApi/index.js"),require("../../clients/subscriptions/subscriptions-client.factory.js"),require("../../constants/goals.js"),require("../../constants/segment.js"),require("../../constants/alerts.js"),require("../../constants/apps.js"),require("../../constants/drillstring.js"),require("../../constants/completion.js"),require("../../constants/appPackages.js"),require("../../constants/notifications.js"),require("../../constants/feed.js"),require("../../constants/bha.js"),require("../../constants/corvaCompanyId.js"),require("../GradientManager/configuration/constants.js");var I=require("../../effects/useSignedURL.js");require("../../utils/index.js"),require("uuid"),require("jsona"),require("../../utils/env.js"),require("../StatusBadge/constants.js"),require("@babel/runtime/helpers/toConsumableArray"),require("lodash/set"),require("lodash/get"),require("lodash/unset"),require("moment"),require("../../clients/api/apiCore.js"),require("../../clients/constants.js"),require("../../clients/sso/auth0.js"),require("../../clients/sso/oauth2.js"),require("lodash/isEmpty"),require("lodash/sortBy"),require("../../constants/streamSourceType.js"),require("../DevCenter/DevCenterAppContainer/components/CommentsSwitch/CommentsSwitchContext.js");var b=require("react/jsx-runtime");require("../../componentsV2/AppCommonsProvider/AppCommonsContext.js");var x=require("../../utils/main.js");function N(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var w=N(e),y=N(i),C=N(t),F=N(n),A=N(r),P=N(c),D=N(l),S=D.default[200],W=D.default[400],U={label:"small",value:135},z={label:"medium",value:300},R={fileImage:function(e,s){return{maxWidth:"100%",borderRadius:4,overflow:"hidden",maxHeight:s===U.label?U.value:z.value,display:e?"initial":"none",cursor:"pointer"}},fileDownloadWrapper:{padding:"10px 10px 10px 5px",border:"1px solid #616161",borderRadius:3,maxWidth:500,width:"75%"},imagePlaceholder:{position:"relative",backgroundColor:S,borderRadius:3,marginTop:10,height:135,width:135}},L=function(e){var s=I(e.attachmentFileName)||e.attachmentUrl;return b.jsxs(b.Fragment,{children:[b.jsxs("div",{onClick:e.openLightbox,className:d.cAttachmentImg,children:[b.jsx("img",{"data-testid":"".concat("Attachment","_image"),src:s,style:R.fileImage(e.imageIsLoaded,e.size),alt:"Attachment",onLoad:e.setImageIsLoaded}),b.jsx("div",{"data-testid":"".concat("Attachment","_button"),className:d.cAttachmentImgPreviwBtn,children:b.jsx(P.default,{})})]}),!e.imageIsLoaded&&b.jsx("div",{style:R.imagePlaceholder,children:b.jsx(A.default,{"data-testid":"".concat("Attachment","_placeholder"),className:e.classes.imageIconRoot,htmlColor:W,fontSize:"large"})}),e.lightboxIsOpen&&b.jsx(p,{mainSrc:s,imagePadding:50,onAfterOpen:e.handleLightboxOpen,onCloseRequest:e.handleLightboxClose})]})},k=function(e){var s=x.default.getFileNameWithExtensionFromPath(e.displayName||e.attachmentUrl),i=I(e.attachmentFileName),t=g.getIsPreviewUnavailable(s);return b.jsxs("div",{className:d.cAttachmentFileWrapper,children:[b.jsxs("div",{className:F.default(d.cAttachmentFileDownloadWrapper,t&&e.classes.disabledPreview),style:R.fileDownloadWrapper,onClick:function(){t||e.openPreview()},children:[t?b.jsx(m.UnavailableFileIcon,{className:e.classes.unavailableFileIcon}):b.jsx(h,{fileName:e.displayName||e.attachmentUrl,className:d.cAttachmentFileDownloadWrapperFileIcon,size:e.small?25:50}),b.jsxs("div",{className:e.classes.titleContainer,children:[t&&b.jsx("div",{className:e.classes.caption,children:"Preview unavailable"}),b.jsx("div",{"data-testid":"".concat("Attachment","_name"),className:F.default(d.cAttachmentFileDownloadWrapperFileName,t&&e.classes.fileName),children:b.jsx(o.Typography,{variant:"subtitle2",noWrap:!0,className:e.classes.unavailableFileName,children:s})})]}),b.jsx(u,{fileUrl:i,classes:{root:e.classes.dialogRoot,paper:j.isNativeDetected?e.classes.nativeDialog:e.classes.dialog},fileName:s,fileSize:e.attachmentSize,onClose:e.closePreview,open:e.previewIsOpen})]}),b.jsx("a",{download:e.displayName,href:i,className:d.cAttachmentFileDownloadWrapperForm,children:b.jsx(q,{"data-testid":"".concat("Attachment","_downloadButton"),className:e.classes.downloadIcon,type:"submit",children:b.jsx(v.DownloadIcon,{size:24,className:e.classes.downloadIcon})})})]})};function O(e){var i=s.useState(!1),t=w.default(i,2),n=t[0],a=t[1],o=s.useState(!1),r=w.default(o,2),c=r[0],l=r[1],u=s.useState(!1),m=w.default(u,2),h=m[0],p=m[1],q=e.displayName||e.attachmentUrl||e.fileName,g=f.getIsImage(q),v=f.getIsVideo(q),x=I(!e.attachmentUrl&&e.fileName),N=e.attachmentUrl||x,y=s.useCallback((function(e){return e.preventDefault()}),[]);return g?b.jsx("div",{className:d.cAttachment,children:b.jsx(L,{size:e.size,openLightbox:function(){return l(!0)},attachmentFileName:e.fileName,attachmentUrl:e.attachmentUrl,setImageIsLoaded:function(){return a(!0)},imageIsLoaded:n,lightboxIsOpen:c,handleLightboxOpen:function(){j.isNativeDetected&&document.documentElement.addEventListener("touchmove",y,{passive:!1})},handleLightboxClose:function(){j.isNativeDetected&&document.documentElement.removeEventListener("touchmove",y),l(!1)},classes:e.classes})}):v&&C.default.canPlay(N)?b.jsx("div",{className:d.cAttachment,children:b.jsx(C.default,{"data-testid":"".concat("Attachment","_player"),className:d.cAttachmentReactPlayer,url:N,config:{file:{attributes:{preload:"metadata"}}},controls:!0,height:e.size===U.label?U.value:z.value,width:null})}):b.jsx("div",{className:d.cAttachment,children:b.jsx(k,{attachmentUrl:N,attachmentFileName:e.fileName,attachmentSize:e.attachmentSize,displayName:e.displayName,openPreview:function(){return p(!0)},closePreview:function(e){e.stopPropagation(),p(!1)},previewIsOpen:h,classes:e.classes,small:e.small})})}O.propTypes={attachmentUrl:y.default.string.isRequired,attachmentSize:y.default.number,displayName:y.default.string,fileName:y.default.string,size:y.default.oneOf([U.label,z.label]),classes:y.default.shape({}).isRequired,small:y.default.bool},O.defaultProps={displayName:null,fileName:null,attachmentSize:void 0,size:z.label,small:!1};var E=a.withStyles((function(e){return{imageIconRoot:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)"},dialog:{width:"95%",height:"95%",maxWidth:"100%",position:"relative"},nativeDialog:{width:"100%",height:"100%",maxWidth:"100%",maxHeight:"100%",margin:0},dialogRoot:{backgroundColor:"rgba(0, 0, 0, 0.85)"},fileName:{overflow:"hidden",whiteSpace:"nowrap",textOverflow:"ellipsis",fontWeight:400},downloadIcon:{color:e.palette.primary.text3},disabledPreview:{backgroundColor:e.palette.primary.text9},unavailableFileIcon:{marginRight:12,minWidth:32},titleContainer:{display:"flex",flexDirection:"column",width:"100%"},caption:{fontSize:12,fontWeight:400,width:"fit-content"},unavailableFileName:{fontSize:12,fontWeight:400}}}))(O);module.exports=E;
|
|
1
|
+
"use strict";var e=require("@babel/runtime/helpers/slicedToArray"),s=require("react"),i=require("prop-types"),t=require("react-player"),n=require("classnames"),a=require("@material-ui/core/styles"),o=require("@material-ui/core"),r=require("@material-ui/icons/Image"),c=require("@material-ui/icons/Fullscreen"),l=require("@material-ui/core/colors/grey"),u=require("../NewDocumentViewer/NewDocumentViewer.js"),m=require("../NewDocumentViewer/icons/UnavailableFileIcon.js"),d=require("./styles.css.js"),h=require("../FileTypeIcon.js"),p=require("../ImageViewer/index.js"),q=require("../IconButton/index.js"),j=require("../../utils/mobileDetect.js"),f=require("../../utils/fileExtension.js"),g=require("../../utils/filePreview.js"),v=require("../../icons/iconParkIcons.js");require("../../icons/customIcons/icons/AddMessage.js"),require("../../icons/customIcons/icons/Attention.js"),require("../../icons/customIcons/icons/Collapse.js"),require("../../icons/customIcons/icons/Dashboard.js"),require("../../icons/customIcons/icons/Expand.js"),require("../../icons/customIcons/icons/FolderClosed.js"),require("../../icons/customIcons/icons/FolderClosedFilled.js"),require("../../icons/customIcons/icons/FolderOpened.js"),require("../../icons/customIcons/icons/GreaterOrEqual.js"),require("../../icons/customIcons/icons/LessOrEqual.js"),require("../../icons/customIcons/icons/Search.js"),require("../../icons/customIcons/icons/Wellhub.js"),require("../../icons/customIcons/icons/MultiRuler.js"),require("../../icons/customIcons/icons/Checkbox.js"),require("../../icons/customIcons/icons/CheckboxChecked.js"),require("../../icons/customIcons/icons/CheckboxIndeterminate.js"),require("../../icons/customIcons/icons/Radio.js"),require("../../icons/customIcons/icons/RadioChecked.js"),require("../../icons/customIcons/icons/SimulFrac.js"),require("../../icons/customIcons/icons/ZipperFrac.js"),require("../../icons/customIcons/icons/CautionFilled.js"),require("../../icons/customIcons/icons/MoreApp.js"),require("../../icons/customIcons/icons/Pad.js"),require("../../icons/customIcons/icons/DrilloutUnit.js"),require("../../icons/customIcons/icons/FracFleet.js"),require("../../icons/customIcons/icons/Global.js"),require("../../icons/customIcons/icons/Program.js"),require("../../icons/customIcons/icons/Rig.js"),require("../../icons/customIcons/icons/Well.js"),require("../../icons/customIcons/icons/Gap.js"),require("../../icons/customIcons/icons/Pin.js"),require("../../icons/customIcons/icons/CloseOneFilled.js"),require("../../icons/customIcons/icons/AttentionFilled.js"),require("../../icons/customIcons/icons/CheckOneFilled.js"),require("../../icons/customIcons/icons/Archive.js"),require("../../icons/customIcons/icons/ArchiveCancel.js"),require("../../icons/customIcons/icons/Unarchive.js"),require("../../icons/customIcons/icons/Archived.js"),require("../../icons/customIcons/icons/InterventionUnit.js"),require("../../clients/subscriptions/constants.js"),require("@babel/runtime/helpers/asyncToGenerator"),require("@babel/runtime/helpers/defineProperty"),require("@babel/runtime/regenerator"),require("querystring"),require("uuid/v1"),require("lodash"),require("../../clients/subscriptions.v1.js"),require("../../clients/jsonApi/index.js"),require("../../clients/subscriptions/subscriptions-client.factory.js"),require("../../constants/goals.js"),require("../../constants/segment.js"),require("../../constants/alerts.js"),require("../../constants/apps.js"),require("../../constants/drillstring.js"),require("../../constants/completion.js"),require("../../constants/appPackages.js"),require("../../constants/notifications.js"),require("../../constants/feed.js"),require("../../constants/bha.js"),require("../../constants/corvaCompanyId.js"),require("../GradientManager/configuration/constants.js");var I=require("../../effects/useSignedURL.js");require("../../utils/index.js"),require("uuid"),require("jsona"),require("../../utils/env.js"),require("../StatusBadge/constants.js"),require("@babel/runtime/helpers/toConsumableArray"),require("lodash/set"),require("lodash/get"),require("lodash/unset"),require("moment"),require("../../clients/api/apiCore.js"),require("../../clients/constants.js"),require("../../clients/sso/auth0.js"),require("../../clients/sso/oauth2.js"),require("lodash/isEmpty"),require("lodash/sortBy"),require("../../constants/streamSourceType.js"),require("../DevCenter/DevCenterAppContainer/components/CommentsSwitch/CommentsSwitchContext.js");var b=require("react/jsx-runtime");require("../../componentsV2/AppCommonsProvider/AppCommonsContext.js");var x=require("../../utils/main.js");function N(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var w=N(e),y=N(i),C=N(t),F=N(n),A=N(r),P=N(c),D=N(l),S=D.default[200],W=D.default[400],U={label:"small",value:135},z={label:"medium",value:300},R={fileImage:function(e,s){return{maxWidth:"100%",borderRadius:4,overflow:"hidden",maxHeight:s===U.label?U.value:z.value,display:e?"initial":"none",cursor:"pointer"}},fileDownloadWrapper:{padding:"10px 10px 10px 5px",border:"1px solid #616161",borderRadius:3,maxWidth:500,width:"75%"},imagePlaceholder:{position:"relative",backgroundColor:S,borderRadius:3,marginTop:10,height:135,width:135}},L=function(e){var s=I(e.attachmentFileName)||e.attachmentUrl;return b.jsxs(b.Fragment,{children:[b.jsxs("div",{onClick:e.openLightbox,className:d.cAttachmentImg,children:[b.jsx("img",{"data-testid":"".concat("Attachment","_image"),src:s,style:R.fileImage(e.imageIsLoaded,e.size),alt:"Attachment",onLoad:e.setImageIsLoaded}),b.jsx("div",{"data-testid":"".concat("Attachment","_button"),className:d.cAttachmentImgPreviwBtn,children:b.jsx(P.default,{})})]}),!e.imageIsLoaded&&b.jsx("div",{style:R.imagePlaceholder,children:b.jsx(A.default,{"data-testid":"".concat("Attachment","_placeholder"),className:e.classes.imageIconRoot,htmlColor:W,fontSize:"large"})}),e.lightboxIsOpen&&b.jsx(p,{mainSrc:s,imagePadding:50,onAfterOpen:e.handleLightboxOpen,onCloseRequest:e.handleLightboxClose})]})},k=function(e){var s=x.default.getFileNameWithExtensionFromPath(e.displayName||e.attachmentUrl),i=I(e.attachmentFileName,"inline"),t=I(e.attachmentFileName,"attachment"),n=g.getIsPreviewUnavailable(s);return b.jsxs("div",{className:d.cAttachmentFileWrapper,children:[b.jsxs("div",{className:F.default(d.cAttachmentFileDownloadWrapper,n&&e.classes.disabledPreview),style:R.fileDownloadWrapper,onClick:function(){n||e.openPreview()},children:[n?b.jsx(m.UnavailableFileIcon,{className:e.classes.unavailableFileIcon}):b.jsx(h,{fileName:e.displayName||e.attachmentUrl,className:d.cAttachmentFileDownloadWrapperFileIcon,size:e.small?25:50}),b.jsxs("div",{className:e.classes.titleContainer,children:[n&&b.jsx("div",{className:e.classes.caption,children:"Preview unavailable"}),b.jsx("div",{"data-testid":"".concat("Attachment","_name"),className:F.default(d.cAttachmentFileDownloadWrapperFileName,n&&e.classes.fileName),children:b.jsx(o.Typography,{variant:"subtitle2",noWrap:!0,className:e.classes.unavailableFileName,children:s})})]}),b.jsx(u,{fileUrl:i,classes:{root:e.classes.dialogRoot,paper:j.isNativeDetected?e.classes.nativeDialog:e.classes.dialog},fileName:s,fileSize:e.attachmentSize,onClose:e.closePreview,open:e.previewIsOpen})]}),b.jsx("a",{download:e.displayName,href:t,className:d.cAttachmentFileDownloadWrapperForm,children:b.jsx(q,{"data-testid":"".concat("Attachment","_downloadButton"),className:e.classes.downloadIcon,type:"submit",children:b.jsx(v.DownloadIcon,{size:24,className:e.classes.downloadIcon})})})]})};function O(e){var i=s.useState(!1),t=w.default(i,2),n=t[0],a=t[1],o=s.useState(!1),r=w.default(o,2),c=r[0],l=r[1],u=s.useState(!1),m=w.default(u,2),h=m[0],p=m[1],q=e.displayName||e.attachmentUrl||e.fileName,g=f.getIsImage(q),v=f.getIsVideo(q),x=I(!e.attachmentUrl&&e.fileName),N=e.attachmentUrl||x,y=s.useCallback((function(e){return e.preventDefault()}),[]);return g?b.jsx("div",{className:d.cAttachment,children:b.jsx(L,{size:e.size,openLightbox:function(){return l(!0)},attachmentFileName:e.fileName,attachmentUrl:e.attachmentUrl,setImageIsLoaded:function(){return a(!0)},imageIsLoaded:n,lightboxIsOpen:c,handleLightboxOpen:function(){j.isNativeDetected&&document.documentElement.addEventListener("touchmove",y,{passive:!1})},handleLightboxClose:function(){j.isNativeDetected&&document.documentElement.removeEventListener("touchmove",y),l(!1)},classes:e.classes})}):v&&C.default.canPlay(N)?b.jsx("div",{className:d.cAttachment,children:b.jsx(C.default,{"data-testid":"".concat("Attachment","_player"),className:d.cAttachmentReactPlayer,url:N,config:{file:{attributes:{preload:"metadata"}}},controls:!0,height:e.size===U.label?U.value:z.value,width:null})}):b.jsx("div",{className:d.cAttachment,children:b.jsx(k,{attachmentUrl:N,attachmentFileName:e.fileName,attachmentSize:e.attachmentSize,displayName:e.displayName,openPreview:function(){return p(!0)},closePreview:function(e){e.stopPropagation(),p(!1)},previewIsOpen:h,classes:e.classes,small:e.small})})}O.propTypes={attachmentUrl:y.default.string.isRequired,attachmentSize:y.default.number,displayName:y.default.string,fileName:y.default.string,size:y.default.oneOf([U.label,z.label]),classes:y.default.shape({}).isRequired,small:y.default.bool},O.defaultProps={displayName:null,fileName:null,attachmentSize:void 0,size:z.label,small:!1};var E=a.withStyles((function(e){return{imageIconRoot:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)"},dialog:{width:"95%",height:"95%",maxWidth:"100%",position:"relative"},nativeDialog:{width:"100%",height:"100%",maxWidth:"100%",maxHeight:"100%",margin:0},dialogRoot:{backgroundColor:"rgba(0, 0, 0, 0.85)"},fileName:{overflow:"hidden",whiteSpace:"nowrap",textOverflow:"ellipsis",fontWeight:400},downloadIcon:{color:e.palette.primary.text3},disabledPreview:{backgroundColor:e.palette.primary.text9},unavailableFileIcon:{marginRight:12,minWidth:32},titleContainer:{display:"flex",flexDirection:"column",width:"100%"},caption:{fontSize:12,fontWeight:400,width:"fit-content"},unavailableFileName:{fontSize:12,fontWeight:400}}}))(O);module.exports=E;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/Attachment/index.js"],"sourcesContent":["import { useState, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport ReactPlayer from 'react-player';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Typography } from '@material-ui/core';\nimport ImageIcon from '@material-ui/icons/Image';\nimport FullSizeIcon from '@material-ui/icons/Fullscreen';\nimport grey from '@material-ui/core/colors/grey';\n\nimport { NewDocumentViewer } from '../NewDocumentViewer';\nimport { UnavailableFileIcon } from '../NewDocumentViewer/icons/UnavailableFileIcon';\n\nimport styles from './styles.css';\n\nimport FileTypeIcon from '~components/FileTypeIcon';\nimport ImageViewer from '~components/ImageViewer';\nimport IconButton from '~components/IconButton';\nimport { isNativeDetected } from '~/utils/mobileDetect';\nimport { getIsVideo, getIsImage } from '~/utils/fileExtension';\nimport { getIsPreviewUnavailable } from '~/utils/filePreview';\nimport { DownloadIcon } from '~/icons';\nimport { useSignedURL } from '~/effects';\nimport utils from '~utils/main'; // question here\n\nconst PAGE_NAME = 'Attachment';\n\nconst grey200 = grey[200];\nconst grey400 = grey[400];\n\nconst SIZES = {\n small: { label: 'small', value: 135 },\n medium: { label: 'medium', value: 300 },\n};\n\nconst style = {\n fileImage: (imageIsLoaded, size) => ({\n maxWidth: '100%',\n borderRadius: 4,\n overflow: 'hidden',\n // NOTE: Makes one-line comment with image fits into comments container. Equals to\n // imagePlaceholder height\n maxHeight: size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value,\n display: imageIsLoaded ? 'initial' : 'none',\n cursor: 'pointer',\n }),\n fileDownloadWrapper: {\n padding: '10px 10px 10px 5px',\n border: `1px solid #616161`,\n borderRadius: 3,\n maxWidth: 500, // NOTE: Corresponds to react-player max width\n width: '75%',\n },\n imagePlaceholder: {\n position: 'relative',\n backgroundColor: grey200,\n borderRadius: 3,\n marginTop: 10,\n height: 135,\n width: 135,\n },\n};\n\nconst muiStyles = theme => ({\n imageIconRoot: {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n },\n dialog: {\n width: '95%',\n height: '95%',\n maxWidth: '100%',\n position: 'relative',\n },\n nativeDialog: {\n width: '100%',\n height: '100%',\n maxWidth: '100%',\n maxHeight: '100%',\n margin: 0,\n },\n dialogRoot: {\n // NOTE: Make background color similar to lightbox\n backgroundColor: 'rgba(0, 0, 0, 0.85)',\n },\n fileName: {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n fontWeight: 400,\n },\n downloadIcon: {\n color: theme.palette.primary.text3,\n },\n disabledPreview: {\n backgroundColor: theme.palette.primary.text9,\n },\n unavailableFileIcon: {\n marginRight: 12,\n minWidth: 32,\n },\n titleContainer: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n },\n caption: {\n fontSize: 12,\n fontWeight: 400,\n width: 'fit-content',\n },\n unavailableFileName: {\n fontSize: 12,\n fontWeight: 400,\n },\n});\n\n/* eslint-disable react/prop-types */\nconst ImageAttachment = props => {\n const downloadLink = useSignedURL(props.attachmentFileName) || props.attachmentUrl;\n return (\n <>\n <div onClick={props.openLightbox} className={styles.cAttachmentImg}>\n <img\n data-testid={`${PAGE_NAME}_image`}\n src={downloadLink}\n style={style.fileImage(props.imageIsLoaded, props.size)}\n alt=\"Attachment\"\n onLoad={props.setImageIsLoaded}\n />\n <div data-testid={`${PAGE_NAME}_button`} className={styles.cAttachmentImgPreviwBtn}>\n <FullSizeIcon />\n </div>\n </div>\n\n {!props.imageIsLoaded && (\n <div style={style.imagePlaceholder}>\n <ImageIcon\n data-testid={`${PAGE_NAME}_placeholder`}\n className={props.classes.imageIconRoot}\n htmlColor={grey400}\n fontSize=\"large\"\n />\n </div>\n )}\n\n {props.lightboxIsOpen && (\n <ImageViewer\n mainSrc={downloadLink}\n imagePadding={50}\n onAfterOpen={props.handleLightboxOpen}\n onCloseRequest={props.handleLightboxClose}\n />\n )}\n </>\n );\n};\n\nconst FileAttachment = props => {\n const fileName = utils.getFileNameWithExtensionFromPath(props.displayName || props.attachmentUrl);\n const fileUrl = useSignedURL(props.attachmentFileName);\n\n const isPreviewUnavailable = getIsPreviewUnavailable(fileName);\n\n const handleFilePreviewOpen = () => {\n if (isPreviewUnavailable) return;\n props.openPreview();\n };\n\n return (\n <div className={styles.cAttachmentFileWrapper}>\n <div\n className={classNames(\n styles.cAttachmentFileDownloadWrapper,\n isPreviewUnavailable && props.classes.disabledPreview\n )}\n style={style.fileDownloadWrapper}\n onClick={handleFilePreviewOpen}\n >\n {isPreviewUnavailable ? (\n <UnavailableFileIcon className={props.classes.unavailableFileIcon} />\n ) : (\n <FileTypeIcon\n fileName={props.displayName || props.attachmentUrl}\n className={styles.cAttachmentFileDownloadWrapperFileIcon}\n size={props.small ? 25 : 50}\n />\n )}\n <div className={props.classes.titleContainer}>\n {isPreviewUnavailable && <div className={props.classes.caption}>Preview unavailable</div>}\n <div\n data-testid={`${PAGE_NAME}_name`}\n className={classNames(\n styles.cAttachmentFileDownloadWrapperFileName,\n isPreviewUnavailable && props.classes.fileName\n )}\n >\n <Typography variant=\"subtitle2\" noWrap className={props.classes.unavailableFileName}>\n {fileName}\n </Typography>\n </div>\n </div>\n <NewDocumentViewer\n fileUrl={fileUrl}\n classes={{\n root: props.classes.dialogRoot,\n paper: isNativeDetected ? props.classes.nativeDialog : props.classes.dialog,\n }}\n fileName={fileName}\n fileSize={props.attachmentSize}\n onClose={props.closePreview}\n open={props.previewIsOpen}\n />\n </div>\n <a\n download={props.displayName}\n href={fileUrl}\n className={styles.cAttachmentFileDownloadWrapperForm}\n >\n <IconButton\n data-testid={`${PAGE_NAME}_downloadButton`}\n className={props.classes.downloadIcon}\n type=\"submit\"\n >\n <DownloadIcon size={24} className={props.classes.downloadIcon} />\n </IconButton>\n </a>\n </div>\n );\n};\n\n/* eslint-enable react/prop-types */\n\nfunction Attachment(props) {\n const [isImageLoaded, setIsImageLoaded] = useState(false);\n const [isLightboxOpen, setIsLightboxOpen] = useState(false);\n const [isPreviewOpen, setIsPreviewOpen] = useState(false);\n\n const fileName = props.displayName || props.attachmentUrl || props.fileName;\n const isImage = getIsImage(fileName);\n const isVideo = getIsVideo(fileName);\n\n // Don't fetch download link if attachmentUrl is provided\n const downloadLink = useSignedURL(!props.attachmentUrl && props.fileName);\n const attachmentUrl = props.attachmentUrl || downloadLink;\n const preventIOSScroll = useCallback(e => e.preventDefault(), []);\n\n // NOTE: iOS WebView has a bug when background content of React Modal is scrollable\n // Source: https://github.com/reactjs/react-modal/issues/369\n const handleLightboxOpen = () => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'hidden';\n document.documentElement.addEventListener('touchmove', preventIOSScroll, {\n passive: false,\n });\n }\n };\n\n const handleLightboxClose = () => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'visible';\n document.documentElement.removeEventListener('touchmove', preventIOSScroll);\n }\n setIsLightboxOpen(false);\n };\n\n const openLightbox = () => setIsLightboxOpen(true);\n const setImageLoaded = () => setIsImageLoaded(true);\n const openPreview = () => setIsPreviewOpen(true);\n const closePreview = e => {\n e.stopPropagation();\n setIsPreviewOpen(false);\n };\n\n if (isImage)\n return (\n <div className={styles.cAttachment}>\n <ImageAttachment\n size={props.size}\n openLightbox={openLightbox}\n attachmentFileName={props.fileName}\n attachmentUrl={props.attachmentUrl}\n setImageIsLoaded={setImageLoaded}\n imageIsLoaded={isImageLoaded}\n lightboxIsOpen={isLightboxOpen}\n handleLightboxOpen={handleLightboxOpen}\n handleLightboxClose={handleLightboxClose}\n classes={props.classes}\n />\n </div>\n );\n\n if (isVideo && ReactPlayer.canPlay(attachmentUrl))\n return (\n <div className={styles.cAttachment}>\n <ReactPlayer\n data-testid={`${PAGE_NAME}_player`}\n className={styles.cAttachmentReactPlayer}\n url={attachmentUrl}\n config={{ file: { attributes: { preload: 'metadata' } } }}\n controls\n height={props.size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value}\n width={null}\n />\n </div>\n );\n\n return (\n <div className={styles.cAttachment}>\n <FileAttachment\n attachmentUrl={attachmentUrl}\n attachmentFileName={props.fileName}\n attachmentSize={props.attachmentSize}\n displayName={props.displayName}\n openPreview={openPreview}\n closePreview={closePreview}\n previewIsOpen={isPreviewOpen}\n classes={props.classes}\n small={props.small}\n />\n </div>\n );\n}\n\nAttachment.propTypes = {\n attachmentUrl: PropTypes.string.isRequired,\n attachmentSize: PropTypes.number,\n displayName: PropTypes.string,\n fileName: PropTypes.string,\n size: PropTypes.oneOf([SIZES.small.label, SIZES.medium.label]),\n classes: PropTypes.shape({}).isRequired,\n small: PropTypes.bool,\n};\n\nAttachment.defaultProps = {\n displayName: null,\n fileName: null,\n attachmentSize: undefined,\n size: SIZES.medium.label,\n small: false,\n};\n\nexport default withStyles(muiStyles)(Attachment);\n"],"names":["grey200","grey","grey400","SIZES","label","value","style","fileImage","imageIsLoaded","size","maxWidth","borderRadius","overflow","maxHeight","display","cursor","fileDownloadWrapper","padding","border","width","imagePlaceholder","position","backgroundColor","marginTop","height","ImageAttachment","props","downloadLink","useSignedURL","attachmentFileName","attachmentUrl","_jsxs","_Fragment","children","jsxs","onClick","openLightbox","className","styles","cAttachmentImg","_jsx","jsx","concat","src","alt","onLoad","setImageIsLoaded","cAttachmentImgPreviwBtn","FullSizeIcon","ImageIcon","classes","imageIconRoot","htmlColor","fontSize","lightboxIsOpen","ImageViewer","mainSrc","imagePadding","onAfterOpen","handleLightboxOpen","onCloseRequest","handleLightboxClose","FileAttachment","fileName","utils","getFileNameWithExtensionFromPath","displayName","fileUrl","isPreviewUnavailable","getIsPreviewUnavailable","cAttachmentFileWrapper","classNames","cAttachmentFileDownloadWrapper","disabledPreview","openPreview","UnavailableFileIcon","unavailableFileIcon","FileTypeIcon","cAttachmentFileDownloadWrapperFileIcon","small","titleContainer","caption","cAttachmentFileDownloadWrapperFileName","Typography","variant","noWrap","unavailableFileName","NewDocumentViewer","root","dialogRoot","paper","isNativeDetected","nativeDialog","dialog","fileSize","attachmentSize","onClose","closePreview","open","previewIsOpen","download","href","cAttachmentFileDownloadWrapperForm","IconButton","downloadIcon","type","DownloadIcon","Attachment","useState","_useState2","_slicedToArray","_useState","isImageLoaded","setIsImageLoaded","_useState4","_useState3","isLightboxOpen","setIsLightboxOpen","_useState6","_useState5","isPreviewOpen","setIsPreviewOpen","isImage","getIsImage","isVideo","getIsVideo","preventIOSScroll","useCallback","e","preventDefault","cAttachment","document","documentElement","addEventListener","passive","removeEventListener","ReactPlayer","canPlay","cAttachmentReactPlayer","url","config","file","attributes","preload","controls","stopPropagation","propTypes","PropTypes","string","isRequired","number","oneOf","shape","bool","defaultProps","undefined","Attachment$1","withStyles","theme","top","left","transform","margin","whiteSpace","textOverflow","fontWeight","color","palette","primary","text3","text9","marginRight","minWidth","flexDirection"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/Attachment/index.js"],"sourcesContent":["import { useState, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport ReactPlayer from 'react-player';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Typography } from '@material-ui/core';\nimport ImageIcon from '@material-ui/icons/Image';\nimport FullSizeIcon from '@material-ui/icons/Fullscreen';\nimport grey from '@material-ui/core/colors/grey';\n\nimport { NewDocumentViewer } from '../NewDocumentViewer';\nimport { UnavailableFileIcon } from '../NewDocumentViewer/icons/UnavailableFileIcon';\n\nimport styles from './styles.css';\n\nimport FileTypeIcon from '~components/FileTypeIcon';\nimport ImageViewer from '~components/ImageViewer';\nimport IconButton from '~components/IconButton';\nimport { isNativeDetected } from '~/utils/mobileDetect';\nimport { getIsVideo, getIsImage } from '~/utils/fileExtension';\nimport { getIsPreviewUnavailable } from '~/utils/filePreview';\nimport { DownloadIcon } from '~/icons';\nimport { useSignedURL } from '~/effects';\nimport utils from '~utils/main'; // question here\n\nconst PAGE_NAME = 'Attachment';\n\nconst grey200 = grey[200];\nconst grey400 = grey[400];\n\nconst SIZES = {\n small: { label: 'small', value: 135 },\n medium: { label: 'medium', value: 300 },\n};\n\nconst style = {\n fileImage: (imageIsLoaded, size) => ({\n maxWidth: '100%',\n borderRadius: 4,\n overflow: 'hidden',\n // NOTE: Makes one-line comment with image fits into comments container. Equals to\n // imagePlaceholder height\n maxHeight: size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value,\n display: imageIsLoaded ? 'initial' : 'none',\n cursor: 'pointer',\n }),\n fileDownloadWrapper: {\n padding: '10px 10px 10px 5px',\n border: `1px solid #616161`,\n borderRadius: 3,\n maxWidth: 500, // NOTE: Corresponds to react-player max width\n width: '75%',\n },\n imagePlaceholder: {\n position: 'relative',\n backgroundColor: grey200,\n borderRadius: 3,\n marginTop: 10,\n height: 135,\n width: 135,\n },\n};\n\nconst muiStyles = theme => ({\n imageIconRoot: {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n },\n dialog: {\n width: '95%',\n height: '95%',\n maxWidth: '100%',\n position: 'relative',\n },\n nativeDialog: {\n width: '100%',\n height: '100%',\n maxWidth: '100%',\n maxHeight: '100%',\n margin: 0,\n },\n dialogRoot: {\n // NOTE: Make background color similar to lightbox\n backgroundColor: 'rgba(0, 0, 0, 0.85)',\n },\n fileName: {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n fontWeight: 400,\n },\n downloadIcon: {\n color: theme.palette.primary.text3,\n },\n disabledPreview: {\n backgroundColor: theme.palette.primary.text9,\n },\n unavailableFileIcon: {\n marginRight: 12,\n minWidth: 32,\n },\n titleContainer: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n },\n caption: {\n fontSize: 12,\n fontWeight: 400,\n width: 'fit-content',\n },\n unavailableFileName: {\n fontSize: 12,\n fontWeight: 400,\n },\n});\n\n/* eslint-disable react/prop-types */\nconst ImageAttachment = props => {\n const downloadLink = useSignedURL(props.attachmentFileName) || props.attachmentUrl;\n return (\n <>\n <div onClick={props.openLightbox} className={styles.cAttachmentImg}>\n <img\n data-testid={`${PAGE_NAME}_image`}\n src={downloadLink}\n style={style.fileImage(props.imageIsLoaded, props.size)}\n alt=\"Attachment\"\n onLoad={props.setImageIsLoaded}\n />\n <div data-testid={`${PAGE_NAME}_button`} className={styles.cAttachmentImgPreviwBtn}>\n <FullSizeIcon />\n </div>\n </div>\n\n {!props.imageIsLoaded && (\n <div style={style.imagePlaceholder}>\n <ImageIcon\n data-testid={`${PAGE_NAME}_placeholder`}\n className={props.classes.imageIconRoot}\n htmlColor={grey400}\n fontSize=\"large\"\n />\n </div>\n )}\n\n {props.lightboxIsOpen && (\n <ImageViewer\n mainSrc={downloadLink}\n imagePadding={50}\n onAfterOpen={props.handleLightboxOpen}\n onCloseRequest={props.handleLightboxClose}\n />\n )}\n </>\n );\n};\n\nconst FileAttachment = props => {\n const fileName = utils.getFileNameWithExtensionFromPath(props.displayName || props.attachmentUrl);\n\n const previewUrl = useSignedURL(props.attachmentFileName, 'inline');\n const downloadUrl = useSignedURL(props.attachmentFileName, 'attachment');\n\n const isPreviewUnavailable = getIsPreviewUnavailable(fileName);\n\n const handleFilePreviewOpen = () => {\n if (isPreviewUnavailable) return;\n props.openPreview();\n };\n\n return (\n <div className={styles.cAttachmentFileWrapper}>\n <div\n className={classNames(\n styles.cAttachmentFileDownloadWrapper,\n isPreviewUnavailable && props.classes.disabledPreview\n )}\n style={style.fileDownloadWrapper}\n onClick={handleFilePreviewOpen}\n >\n {isPreviewUnavailable ? (\n <UnavailableFileIcon className={props.classes.unavailableFileIcon} />\n ) : (\n <FileTypeIcon\n fileName={props.displayName || props.attachmentUrl}\n className={styles.cAttachmentFileDownloadWrapperFileIcon}\n size={props.small ? 25 : 50}\n />\n )}\n <div className={props.classes.titleContainer}>\n {isPreviewUnavailable && <div className={props.classes.caption}>Preview unavailable</div>}\n <div\n data-testid={`${PAGE_NAME}_name`}\n className={classNames(\n styles.cAttachmentFileDownloadWrapperFileName,\n isPreviewUnavailable && props.classes.fileName\n )}\n >\n <Typography variant=\"subtitle2\" noWrap className={props.classes.unavailableFileName}>\n {fileName}\n </Typography>\n </div>\n </div>\n <NewDocumentViewer\n fileUrl={previewUrl}\n classes={{\n root: props.classes.dialogRoot,\n paper: isNativeDetected ? props.classes.nativeDialog : props.classes.dialog,\n }}\n fileName={fileName}\n fileSize={props.attachmentSize}\n onClose={props.closePreview}\n open={props.previewIsOpen}\n />\n </div>\n <a\n download={props.displayName}\n href={downloadUrl}\n className={styles.cAttachmentFileDownloadWrapperForm}\n >\n <IconButton\n data-testid={`${PAGE_NAME}_downloadButton`}\n className={props.classes.downloadIcon}\n type=\"submit\"\n >\n <DownloadIcon size={24} className={props.classes.downloadIcon} />\n </IconButton>\n </a>\n </div>\n );\n};\n\n/* eslint-enable react/prop-types */\n\nfunction Attachment(props) {\n const [isImageLoaded, setIsImageLoaded] = useState(false);\n const [isLightboxOpen, setIsLightboxOpen] = useState(false);\n const [isPreviewOpen, setIsPreviewOpen] = useState(false);\n\n const fileName = props.displayName || props.attachmentUrl || props.fileName;\n const isImage = getIsImage(fileName);\n const isVideo = getIsVideo(fileName);\n\n // Don't fetch download link if attachmentUrl is provided\n const downloadLink = useSignedURL(!props.attachmentUrl && props.fileName);\n const attachmentUrl = props.attachmentUrl || downloadLink;\n const preventIOSScroll = useCallback(e => e.preventDefault(), []);\n\n // NOTE: iOS WebView has a bug when background content of React Modal is scrollable\n // Source: https://github.com/reactjs/react-modal/issues/369\n const handleLightboxOpen = () => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'hidden';\n document.documentElement.addEventListener('touchmove', preventIOSScroll, {\n passive: false,\n });\n }\n };\n\n const handleLightboxClose = () => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'visible';\n document.documentElement.removeEventListener('touchmove', preventIOSScroll);\n }\n setIsLightboxOpen(false);\n };\n\n const openLightbox = () => setIsLightboxOpen(true);\n const setImageLoaded = () => setIsImageLoaded(true);\n const openPreview = () => setIsPreviewOpen(true);\n const closePreview = e => {\n e.stopPropagation();\n setIsPreviewOpen(false);\n };\n\n if (isImage)\n return (\n <div className={styles.cAttachment}>\n <ImageAttachment\n size={props.size}\n openLightbox={openLightbox}\n attachmentFileName={props.fileName}\n attachmentUrl={props.attachmentUrl}\n setImageIsLoaded={setImageLoaded}\n imageIsLoaded={isImageLoaded}\n lightboxIsOpen={isLightboxOpen}\n handleLightboxOpen={handleLightboxOpen}\n handleLightboxClose={handleLightboxClose}\n classes={props.classes}\n />\n </div>\n );\n\n if (isVideo && ReactPlayer.canPlay(attachmentUrl))\n return (\n <div className={styles.cAttachment}>\n <ReactPlayer\n data-testid={`${PAGE_NAME}_player`}\n className={styles.cAttachmentReactPlayer}\n url={attachmentUrl}\n config={{ file: { attributes: { preload: 'metadata' } } }}\n controls\n height={props.size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value}\n width={null}\n />\n </div>\n );\n\n return (\n <div className={styles.cAttachment}>\n <FileAttachment\n attachmentUrl={attachmentUrl}\n attachmentFileName={props.fileName}\n attachmentSize={props.attachmentSize}\n displayName={props.displayName}\n openPreview={openPreview}\n closePreview={closePreview}\n previewIsOpen={isPreviewOpen}\n classes={props.classes}\n small={props.small}\n />\n </div>\n );\n}\n\nAttachment.propTypes = {\n attachmentUrl: PropTypes.string.isRequired,\n attachmentSize: PropTypes.number,\n displayName: PropTypes.string,\n fileName: PropTypes.string,\n size: PropTypes.oneOf([SIZES.small.label, SIZES.medium.label]),\n classes: PropTypes.shape({}).isRequired,\n small: PropTypes.bool,\n};\n\nAttachment.defaultProps = {\n displayName: null,\n fileName: null,\n attachmentSize: undefined,\n size: SIZES.medium.label,\n small: false,\n};\n\nexport default withStyles(muiStyles)(Attachment);\n"],"names":["grey200","grey","grey400","SIZES","label","value","style","fileImage","imageIsLoaded","size","maxWidth","borderRadius","overflow","maxHeight","display","cursor","fileDownloadWrapper","padding","border","width","imagePlaceholder","position","backgroundColor","marginTop","height","ImageAttachment","props","downloadLink","useSignedURL","attachmentFileName","attachmentUrl","_jsxs","_Fragment","children","jsxs","onClick","openLightbox","className","styles","cAttachmentImg","_jsx","jsx","concat","src","alt","onLoad","setImageIsLoaded","cAttachmentImgPreviwBtn","FullSizeIcon","ImageIcon","classes","imageIconRoot","htmlColor","fontSize","lightboxIsOpen","ImageViewer","mainSrc","imagePadding","onAfterOpen","handleLightboxOpen","onCloseRequest","handleLightboxClose","FileAttachment","fileName","utils","getFileNameWithExtensionFromPath","displayName","previewUrl","downloadUrl","isPreviewUnavailable","getIsPreviewUnavailable","cAttachmentFileWrapper","classNames","cAttachmentFileDownloadWrapper","disabledPreview","openPreview","UnavailableFileIcon","unavailableFileIcon","FileTypeIcon","cAttachmentFileDownloadWrapperFileIcon","small","titleContainer","caption","cAttachmentFileDownloadWrapperFileName","Typography","variant","noWrap","unavailableFileName","NewDocumentViewer","fileUrl","root","dialogRoot","paper","isNativeDetected","nativeDialog","dialog","fileSize","attachmentSize","onClose","closePreview","open","previewIsOpen","download","href","cAttachmentFileDownloadWrapperForm","IconButton","downloadIcon","type","DownloadIcon","Attachment","useState","_useState2","_slicedToArray","_useState","isImageLoaded","setIsImageLoaded","_useState4","_useState3","isLightboxOpen","setIsLightboxOpen","_useState6","_useState5","isPreviewOpen","setIsPreviewOpen","isImage","getIsImage","isVideo","getIsVideo","preventIOSScroll","useCallback","e","preventDefault","cAttachment","document","documentElement","addEventListener","passive","removeEventListener","ReactPlayer","canPlay","cAttachmentReactPlayer","url","config","file","attributes","preload","controls","stopPropagation","propTypes","PropTypes","string","isRequired","number","oneOf","shape","bool","defaultProps","undefined","Attachment$1","withStyles","theme","top","left","transform","margin","whiteSpace","textOverflow","fontWeight","color","palette","primary","text3","text9","marginRight","minWidth","flexDirection"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("@babel/runtime/helpers/defineProperty"),e=require("@material-ui/core"),t=require("lodash"),o=require("react"),n=require("../formations.js");function
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("@babel/runtime/helpers/defineProperty"),e=require("@material-ui/core"),t=require("lodash"),o=require("react"),n=require("../formations.js");function i(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}var s=i(r);function a(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(r);e&&(o=o.filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable}))),t.push.apply(t,o)}return t}function c(r){for(var e=1;e<arguments.length;e++){var t=null!=arguments[e]?arguments[e]:{};e%2?a(Object(t),!0).forEach((function(e){s.default(r,e,t[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):a(Object(t)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(t,e))}))}return r}var u=function(r,e,t){var o,n,i;return(null===(o=window.Highcharts)||void 0===o||null===(n=o.version)||void 0===n?void 0:n.startsWith("10"))?{zooming:{type:t||!e?"none":r.zoomType,panning:{enabled:!e,type:(null===(i=r.panning)||void 0===i?void 0:i.type)||"xy"},panKey:""}}:{zoomType:t||!e?"none":r.zoomType}},l=e.makeStyles({axisGrab:{cursor:"grab"},axisCrosshair:{cursor:"crosshair"}});exports.useChartModifier=function(r){var e=r.chart,i=r.chartOptions,s=r.isZoomEnabled,a=r.isMinHeightChart,p=r.handleChartSelection,f=r.onZoomChangeCallback,h=r.isAxesCoordinatesShown,d=l();o.useEffect((function(){if(!t.isEmpty(e)){var r={zIndex:1,color:"#ffffff",dashStyle:"dash"};e.plotBackground.element.style.cursor=a||!s?"grab":"crosshair",e.series.forEach((function(r){var e;return null==r||null===(e=r.group)||void 0===e?void 0:e.css({cursor:a||!s?"grab":"crosshair"})})),e.update({chart:c(c({},i),{},{plotBackgroundColor:"transparent"},u(i,s,a)),xAxis:{crosshair:h?r:null,className:s?d.axisCrosshair:d.axisGrab,events:{afterSetExtremes:function(r){var t,o;"zoom"!==r.trigger&&"navigator"!==r.trigger||p(),null!==(t=e.xAxis)&&void 0!==t&&null!==(o=t[0].userOptions.plotLines)&&void 0!==o&&o.length&&n.updateAxisStyles({chart:e}),f(r)}}},yAxis:{crosshair:h?r:null,className:s?d.axisCrosshair:d.axisGrab,events:{afterSetExtremes:function(r){"zoom"!==r.trigger&&"navigator"!==r.trigger||p(),f(r)}}},plotOptions:{series:{cursor:a||!s?"grab":"crosshair"}}})}}),[s,p,h])};
|
|
2
2
|
//# sourceMappingURL=useChartModifier.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useChartModifier.js","sources":["../../../../../src/components/Chart/effects/useChartModifier.js"],"sourcesContent":["import { makeStyles } from '@material-ui/core';\nimport { isEmpty } from 'lodash';\nimport { useEffect } from 'react';\n\nimport { updateAxisStyles } from '../formations';\n\n// [HIGHCHARTS-10-MIGRATION-TAG]: Find and delete/clean all places like this once the migration to v10 ends\n// Helper function to get chart configuration based on Highcharts version\n// This ensures compatibility with both Highcharts v8 and v10\nconst getChartVersionSpecificConfig = (chartOptions, isZoomEnabled, isMinHeightChart) => {\n const isV10 = window.Highcharts
|
|
1
|
+
{"version":3,"file":"useChartModifier.js","sources":["../../../../../src/components/Chart/effects/useChartModifier.js"],"sourcesContent":["import { makeStyles } from '@material-ui/core';\nimport { isEmpty } from 'lodash';\nimport { useEffect } from 'react';\n\nimport { updateAxisStyles } from '../formations';\n\n// [HIGHCHARTS-10-MIGRATION-TAG]: Find and delete/clean all places like this once the migration to v10 ends\n// Helper function to get chart configuration based on Highcharts version\n// This ensures compatibility with both Highcharts v8 and v10\nconst getChartVersionSpecificConfig = (chartOptions, isZoomEnabled, isMinHeightChart) => {\n const isV10 = window.Highcharts?.version?.startsWith('10');\n\n if (isV10) {\n // Highcharts v10 format\n return {\n zooming: {\n type: isMinHeightChart || !isZoomEnabled ? 'none' : chartOptions.zoomType,\n panning: {\n enabled: !isZoomEnabled,\n type: chartOptions.panning?.type || 'xy',\n },\n panKey: '',\n },\n };\n } else {\n // Highcharts v8 format (backward compatibility)\n return {\n zoomType: isMinHeightChart || !isZoomEnabled ? 'none' : chartOptions.zoomType,\n };\n }\n};\n\nconst useStyles = makeStyles({\n axisGrab: {\n cursor: 'grab',\n },\n axisCrosshair: {\n cursor: 'crosshair',\n },\n});\n\nexport const useChartModifier = ({\n chart,\n chartOptions,\n isZoomEnabled,\n isMinHeightChart,\n handleChartSelection,\n onZoomChangeCallback,\n isAxesCoordinatesShown,\n}) => {\n const classes = useStyles();\n\n useEffect(() => {\n if (isEmpty(chart)) {\n return;\n }\n\n const crosshairConfig = {\n zIndex: 1,\n color: '#ffffff',\n dashStyle: 'dash',\n };\n // eslint-disable-next-line no-param-reassign\n chart.plotBackground.element.style.cursor =\n isMinHeightChart || !isZoomEnabled ? 'grab' : 'crosshair';\n\n chart.series.forEach(seriesItem =>\n seriesItem?.group?.css({\n cursor: isMinHeightChart || !isZoomEnabled ? 'grab' : 'crosshair',\n })\n );\n\n chart.update({\n chart: {\n ...chartOptions,\n plotBackgroundColor: 'transparent',\n ...getChartVersionSpecificConfig(chartOptions, isZoomEnabled, isMinHeightChart),\n },\n xAxis: {\n crosshair: isAxesCoordinatesShown ? crosshairConfig : null,\n className: isZoomEnabled ? classes.axisCrosshair : classes.axisGrab,\n events: {\n afterSetExtremes(e) {\n if (e.trigger === 'zoom' || e.trigger === 'navigator') {\n handleChartSelection();\n }\n if (chart.xAxis?.[0].userOptions.plotLines?.length) {\n updateAxisStyles({ chart });\n }\n onZoomChangeCallback(e);\n },\n },\n },\n yAxis: {\n crosshair: isAxesCoordinatesShown ? crosshairConfig : null,\n className: isZoomEnabled ? classes.axisCrosshair : classes.axisGrab,\n events: {\n afterSetExtremes(e) {\n if (e.trigger === 'zoom' || e.trigger === 'navigator') {\n handleChartSelection();\n }\n onZoomChangeCallback(e);\n },\n },\n },\n plotOptions: {\n series: {\n cursor: isMinHeightChart || !isZoomEnabled ? 'grab' : 'crosshair',\n },\n },\n });\n }, [isZoomEnabled, handleChartSelection, isAxesCoordinatesShown]);\n};\n"],"names":["getChartVersionSpecificConfig","chartOptions","isZoomEnabled","isMinHeightChart","_window$Highcharts","_window$Highcharts$ve","_chartOptions$panning","window","Highcharts","version","startsWith","zooming","type","zoomType","panning","enabled","panKey","useStyles","makeStyles","axisGrab","cursor","axisCrosshair","_ref","chart","handleChartSelection","onZoomChangeCallback","isAxesCoordinatesShown","classes","useEffect","isEmpty","crosshairConfig","zIndex","color","dashStyle","plotBackground","element","style","series","forEach","seriesItem","_seriesItem$group","group","css","update","plotBackgroundColor","xAxis","crosshair","className","events","afterSetExtremes","e","_chart$xAxis","_chart$xAxis$0$userOp","trigger","userOptions","plotLines","length","updateAxisStyles","yAxis","plotOptions"],"mappings":"y3BASA,IAAMA,EAAgC,SAACC,EAAcC,EAAeC,GAAqB,IAAAC,EAAAC,EAG5EC,EAAX,OAF+B,QAApBF,EAAGG,OAAOC,kBAAU,IAAAJ,GAAjB,QAAiBC,EAAjBD,EAAmBK,eAAnB,IAAAJ,OAAiB,EAAjBA,EAA4BK,WAAW,OAI5C,CACLC,QAAS,CACPC,KAAMT,IAAqBD,EAAgB,OAASD,EAAaY,SACjEC,QAAS,CACPC,SAAUb,EACVU,MAAM,UAAAX,EAAaa,eAAb,IAAAR,OAAA,EAAAA,EAAsBM,OAAQ,MAEtCI,OAAQ,KAKL,CACLH,SAAUV,IAAqBD,EAAgB,OAASD,EAAaY,SAG3E,EAEMI,EAAYC,EAAAA,WAAW,CAC3BC,SAAU,CACRC,OAAQ,QAEVC,cAAe,CACbD,OAAQ,wCAIoB,SAQ1BE,GAAA,IAPJC,IAAAA,MACAtB,IAAAA,aACAC,IAAAA,cACAC,IAAAA,iBACAqB,IAAAA,qBACAC,IAAAA,qBACAC,IAAAA,uBAEMC,EAAUV,IAEhBW,EAAAA,WAAU,WACR,IAAIC,EAAAA,QAAQN,GAAZ,CAIA,IAAMO,EAAkB,CACtBC,OAAQ,EACRC,MAAO,UACPC,UAAW,QAGbV,EAAMW,eAAeC,QAAQC,MAAMhB,OACjCjB,IAAqBD,EAAgB,OAAS,YAEhDqB,EAAMc,OAAOC,SAAQ,SAAAC,GAAU,IAAAC,EAAA,OAC7BD,SAAiB,QAAjBA,EAAAA,EAAYE,aAAK,IAAAD,OAAjBD,EAAAC,EAAmBE,IAAI,CACrBtB,OAAQjB,IAAqBD,EAAgB,OAAS,iBAI1DqB,EAAMoB,OAAO,CACXpB,aACKtB,GAAY,CAAA,EAAA,CACf2C,oBAAqB,eAClB5C,EAA8BC,EAAcC,EAAeC,IAEhE0C,MAAO,CACLC,UAAWpB,EAAyBI,EAAkB,KACtDiB,UAAW7C,EAAgByB,EAAQN,cAAgBM,EAAQR,SAC3D6B,OAAQ,CACNC,iBAAgB,SAACC,GAAG,IAAAC,EAAAC,EACA,SAAdF,EAAEG,SAAoC,cAAdH,EAAEG,SAC5B7B,IAEa,QAAf2B,EAAI5B,EAAMsB,aAAK,IAAAM,GAAX,QAAWC,EAAXD,EAAc,GAAGG,YAAYC,iBAA7B,IAAAH,GAAAA,EAAwCI,QAC1CC,mBAAiB,CAAElC,MAAAA,IAErBE,EAAqByB,EACvB,IAGJQ,MAAO,CACLZ,UAAWpB,EAAyBI,EAAkB,KACtDiB,UAAW7C,EAAgByB,EAAQN,cAAgBM,EAAQR,SAC3D6B,OAAQ,CACNC,iBAAgB,SAACC,GACG,SAAdA,EAAEG,SAAoC,cAAdH,EAAEG,SAC5B7B,IAEFC,EAAqByB,EACvB,IAGJS,YAAa,CACXtB,OAAQ,CACNjB,OAAQjB,IAAqBD,EAAgB,OAAS,eApD5D,CAwDD,GAAE,CAACA,EAAesB,EAAsBE,GAC3C"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("@babel/runtime/helpers/slicedToArray"),t=require("react"),r=require("../clients/jsonApi/index.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=n(e);module.exports=function(e){var n=t.useState(""),
|
|
1
|
+
"use strict";var e=require("@babel/runtime/helpers/slicedToArray"),t=require("react"),r=require("../clients/jsonApi/index.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=n(e);module.exports=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"attachment",i=t.useState(""),o=u.default(i,2),c=o[0],a=o[1];return t.useEffect((function(){e&&r.getS3DownloadLink(e,n).then((function(e){a(e.url)})).catch((function(e){console.error(e),a("")}))}),[e,n]),c};
|
|
2
2
|
//# sourceMappingURL=useSignedURL.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSignedURL.js","sources":["../../../src/effects/useSignedURL.js"],"sourcesContent":["import { useState, useEffect } from 'react';\n\nimport { getS3DownloadLink } from '~/clients/jsonApi';\n\nfunction useSignedURL(fileName) {\n const [signedURL, setSignedURL] = useState('');\n\n useEffect(() => {\n if (fileName)\n getS3DownloadLink(fileName)\n .then(response => setSignedURL(response.url))\n .catch(
|
|
1
|
+
{"version":3,"file":"useSignedURL.js","sources":["../../../src/effects/useSignedURL.js"],"sourcesContent":["import { useState, useEffect } from 'react';\n\nimport { getS3DownloadLink } from '~/clients/jsonApi';\n\nfunction useSignedURL(fileName, contentDisposition = 'attachment') {\n const [signedURL, setSignedURL] = useState('');\n\n useEffect(() => {\n if (fileName) {\n getS3DownloadLink(fileName, contentDisposition)\n .then(response => {\n setSignedURL(response.url);\n })\n .catch(error => {\n console.error(error);\n setSignedURL('');\n });\n }\n }, [fileName, contentDisposition]);\n\n return signedURL;\n}\n\nexport default useSignedURL;\n"],"names":["fileName","contentDisposition","useState","_useState2","_slicedToArray","_useState","signedURL","setSignedURL","useEffect","getS3DownloadLink","then","response","url","catch","error","console"],"mappings":"iOAIA,SAAsBA,GAA6C,IAAnCC,yDAAqB,aACjBC,EAAAA,EAAQA,SAAC,IAAGC,EAAAC,EAAAA,QAAAC,EAAA,GAAvCC,EAASH,EAAA,GAAEI,EAAYJ,EAAA,GAe9B,OAbAK,EAAAA,WAAU,WACJR,GACFS,EAAAA,kBAAkBT,EAAUC,GACzBS,MAAK,SAAAC,GACJJ,EAAaI,EAASC,IACxB,IACCC,OAAM,SAAAC,GACLC,QAAQD,MAAMA,GACdP,EAAa,GACf,GAEN,GAAG,CAACP,EAAUC,IAEPK,CACT"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import o from"@babel/runtime/helpers/slicedToArray";import{useState as t,useCallback as e}from"react";import s from"prop-types";import i from"react-player";import n from"classnames";import{withStyles as a}from"@material-ui/core/styles";import{Typography as c}from"@material-ui/core";import r from"@material-ui/icons/Image";import m from"@material-ui/icons/Fullscreen";import l from"@material-ui/core/colors/grey";import p from"../NewDocumentViewer/NewDocumentViewer.js";import{UnavailableFileIcon as d}from"../NewDocumentViewer/icons/UnavailableFileIcon.js";import u from"./styles.css.js";import h from"../FileTypeIcon.js";import f from"../ImageViewer/index.js";import j from"../IconButton/index.js";import{isNativeDetected as g}from"../../utils/mobileDetect.js";import{getIsImage as I,getIsVideo as v}from"../../utils/fileExtension.js";import{getIsPreviewUnavailable as b}from"../../utils/filePreview.js";import{DownloadIcon as N}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../clients/subscriptions/constants.js";import"@babel/runtime/helpers/asyncToGenerator";import"@babel/runtime/helpers/defineProperty";import"@babel/runtime/regenerator";import"querystring";import"uuid/v1";import"lodash";import"../../clients/subscriptions.v1.js";import"../../clients/jsonApi/index.js";import"../../clients/subscriptions/subscriptions-client.factory.js";import"../../constants/goals.js";import"../../constants/segment.js";import"../../constants/alerts.js";import"../../constants/apps.js";import"../../constants/drillstring.js";import"../../constants/completion.js";import"../../constants/appPackages.js";import"../../constants/notifications.js";import"../../constants/feed.js";import"../../constants/bha.js";import"../../constants/corvaCompanyId.js";import"../GradientManager/configuration/constants.js";import w from"../../effects/useSignedURL.js";import"../../utils/index.js";import"uuid";import"jsona";import"../../utils/env.js";import"../StatusBadge/constants.js";import"@babel/runtime/helpers/toConsumableArray";import"lodash/set";import"lodash/get";import"lodash/unset";import"moment";import"../../clients/api/apiCore.js";import"../../clients/constants.js";import"../../clients/sso/auth0.js";import"../../clients/sso/oauth2.js";import"lodash/isEmpty";import"lodash/sortBy";import"../../constants/streamSourceType.js";import"../DevCenter/DevCenterAppContainer/components/CommentsSwitch/CommentsSwitchContext.js";import{jsx as x,jsxs as y,Fragment as C}from"react/jsx-runtime";import"../../componentsV2/AppCommonsProvider/AppCommonsContext.js";import F from"../../utils/main.js";var A=l[200],P=l[400],W={label:"small",value:135},D={label:"medium",value:300},S={fileImage:function(o,t){return{maxWidth:"100%",borderRadius:4,overflow:"hidden",maxHeight:t===W.label?W.value:D.value,display:o?"initial":"none",cursor:"pointer"}},fileDownloadWrapper:{padding:"10px 10px 10px 5px",border:"1px solid #616161",borderRadius:3,maxWidth:500,width:"75%"},imagePlaceholder:{position:"relative",backgroundColor:A,borderRadius:3,marginTop:10,height:135,width:135}},z=function(o){var t=w(o.attachmentFileName)||o.attachmentUrl;return y(C,{children:[y("div",{onClick:o.openLightbox,className:u.cAttachmentImg,children:[x("img",{"data-testid":"".concat("Attachment","_image"),src:t,style:S.fileImage(o.imageIsLoaded,o.size),alt:"Attachment",onLoad:o.setImageIsLoaded}),x("div",{"data-testid":"".concat("Attachment","_button"),className:u.cAttachmentImgPreviwBtn,children:x(m,{})})]}),!o.imageIsLoaded&&x("div",{style:S.imagePlaceholder,children:x(r,{"data-testid":"".concat("Attachment","_placeholder"),className:o.classes.imageIconRoot,htmlColor:P,fontSize:"large"})}),o.lightboxIsOpen&&x(f,{mainSrc:t,imagePadding:50,onAfterOpen:o.handleLightboxOpen,onCloseRequest:o.handleLightboxClose})]})},R=function(o){var t=F.getFileNameWithExtensionFromPath(o.displayName||o.attachmentUrl),e=w(o.attachmentFileName),s=b(t);return y("div",{className:u.cAttachmentFileWrapper,children:[y("div",{className:n(u.cAttachmentFileDownloadWrapper,
|
|
1
|
+
import o from"@babel/runtime/helpers/slicedToArray";import{useState as t,useCallback as e}from"react";import s from"prop-types";import i from"react-player";import n from"classnames";import{withStyles as a}from"@material-ui/core/styles";import{Typography as c}from"@material-ui/core";import r from"@material-ui/icons/Image";import m from"@material-ui/icons/Fullscreen";import l from"@material-ui/core/colors/grey";import p from"../NewDocumentViewer/NewDocumentViewer.js";import{UnavailableFileIcon as d}from"../NewDocumentViewer/icons/UnavailableFileIcon.js";import u from"./styles.css.js";import h from"../FileTypeIcon.js";import f from"../ImageViewer/index.js";import j from"../IconButton/index.js";import{isNativeDetected as g}from"../../utils/mobileDetect.js";import{getIsImage as I,getIsVideo as v}from"../../utils/fileExtension.js";import{getIsPreviewUnavailable as b}from"../../utils/filePreview.js";import{DownloadIcon as N}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../clients/subscriptions/constants.js";import"@babel/runtime/helpers/asyncToGenerator";import"@babel/runtime/helpers/defineProperty";import"@babel/runtime/regenerator";import"querystring";import"uuid/v1";import"lodash";import"../../clients/subscriptions.v1.js";import"../../clients/jsonApi/index.js";import"../../clients/subscriptions/subscriptions-client.factory.js";import"../../constants/goals.js";import"../../constants/segment.js";import"../../constants/alerts.js";import"../../constants/apps.js";import"../../constants/drillstring.js";import"../../constants/completion.js";import"../../constants/appPackages.js";import"../../constants/notifications.js";import"../../constants/feed.js";import"../../constants/bha.js";import"../../constants/corvaCompanyId.js";import"../GradientManager/configuration/constants.js";import w from"../../effects/useSignedURL.js";import"../../utils/index.js";import"uuid";import"jsona";import"../../utils/env.js";import"../StatusBadge/constants.js";import"@babel/runtime/helpers/toConsumableArray";import"lodash/set";import"lodash/get";import"lodash/unset";import"moment";import"../../clients/api/apiCore.js";import"../../clients/constants.js";import"../../clients/sso/auth0.js";import"../../clients/sso/oauth2.js";import"lodash/isEmpty";import"lodash/sortBy";import"../../constants/streamSourceType.js";import"../DevCenter/DevCenterAppContainer/components/CommentsSwitch/CommentsSwitchContext.js";import{jsx as x,jsxs as y,Fragment as C}from"react/jsx-runtime";import"../../componentsV2/AppCommonsProvider/AppCommonsContext.js";import F from"../../utils/main.js";var A=l[200],P=l[400],W={label:"small",value:135},D={label:"medium",value:300},S={fileImage:function(o,t){return{maxWidth:"100%",borderRadius:4,overflow:"hidden",maxHeight:t===W.label?W.value:D.value,display:o?"initial":"none",cursor:"pointer"}},fileDownloadWrapper:{padding:"10px 10px 10px 5px",border:"1px solid #616161",borderRadius:3,maxWidth:500,width:"75%"},imagePlaceholder:{position:"relative",backgroundColor:A,borderRadius:3,marginTop:10,height:135,width:135}},z=function(o){var t=w(o.attachmentFileName)||o.attachmentUrl;return y(C,{children:[y("div",{onClick:o.openLightbox,className:u.cAttachmentImg,children:[x("img",{"data-testid":"".concat("Attachment","_image"),src:t,style:S.fileImage(o.imageIsLoaded,o.size),alt:"Attachment",onLoad:o.setImageIsLoaded}),x("div",{"data-testid":"".concat("Attachment","_button"),className:u.cAttachmentImgPreviwBtn,children:x(m,{})})]}),!o.imageIsLoaded&&x("div",{style:S.imagePlaceholder,children:x(r,{"data-testid":"".concat("Attachment","_placeholder"),className:o.classes.imageIconRoot,htmlColor:P,fontSize:"large"})}),o.lightboxIsOpen&&x(f,{mainSrc:t,imagePadding:50,onAfterOpen:o.handleLightboxOpen,onCloseRequest:o.handleLightboxClose})]})},R=function(o){var t=F.getFileNameWithExtensionFromPath(o.displayName||o.attachmentUrl),e=w(o.attachmentFileName,"inline"),s=w(o.attachmentFileName,"attachment"),i=b(t);return y("div",{className:u.cAttachmentFileWrapper,children:[y("div",{className:n(u.cAttachmentFileDownloadWrapper,i&&o.classes.disabledPreview),style:S.fileDownloadWrapper,onClick:function(){i||o.openPreview()},children:[i?x(d,{className:o.classes.unavailableFileIcon}):x(h,{fileName:o.displayName||o.attachmentUrl,className:u.cAttachmentFileDownloadWrapperFileIcon,size:o.small?25:50}),y("div",{className:o.classes.titleContainer,children:[i&&x("div",{className:o.classes.caption,children:"Preview unavailable"}),x("div",{"data-testid":"".concat("Attachment","_name"),className:n(u.cAttachmentFileDownloadWrapperFileName,i&&o.classes.fileName),children:x(c,{variant:"subtitle2",noWrap:!0,className:o.classes.unavailableFileName,children:t})})]}),x(p,{fileUrl:e,classes:{root:o.classes.dialogRoot,paper:g?o.classes.nativeDialog:o.classes.dialog},fileName:t,fileSize:o.attachmentSize,onClose:o.closePreview,open:o.previewIsOpen})]}),x("a",{download:o.displayName,href:s,className:u.cAttachmentFileDownloadWrapperForm,children:x(j,{"data-testid":"".concat("Attachment","_downloadButton"),className:o.classes.downloadIcon,type:"submit",children:x(N,{size:24,className:o.classes.downloadIcon})})})]})};function L(s){var n=t(!1),a=o(n,2),c=a[0],r=a[1],m=t(!1),l=o(m,2),p=l[0],d=l[1],h=t(!1),f=o(h,2),j=f[0],b=f[1],N=s.displayName||s.attachmentUrl||s.fileName,y=I(N),C=v(N),F=w(!s.attachmentUrl&&s.fileName),A=s.attachmentUrl||F,P=e((function(o){return o.preventDefault()}),[]);return y?x("div",{className:u.cAttachment,children:x(z,{size:s.size,openLightbox:function(){return d(!0)},attachmentFileName:s.fileName,attachmentUrl:s.attachmentUrl,setImageIsLoaded:function(){return r(!0)},imageIsLoaded:c,lightboxIsOpen:p,handleLightboxOpen:function(){g&&document.documentElement.addEventListener("touchmove",P,{passive:!1})},handleLightboxClose:function(){g&&document.documentElement.removeEventListener("touchmove",P),d(!1)},classes:s.classes})}):C&&i.canPlay(A)?x("div",{className:u.cAttachment,children:x(i,{"data-testid":"".concat("Attachment","_player"),className:u.cAttachmentReactPlayer,url:A,config:{file:{attributes:{preload:"metadata"}}},controls:!0,height:s.size===W.label?W.value:D.value,width:null})}):x("div",{className:u.cAttachment,children:x(R,{attachmentUrl:A,attachmentFileName:s.fileName,attachmentSize:s.attachmentSize,displayName:s.displayName,openPreview:function(){return b(!0)},closePreview:function(o){o.stopPropagation(),b(!1)},previewIsOpen:j,classes:s.classes,small:s.small})})}L.propTypes={attachmentUrl:s.string.isRequired,attachmentSize:s.number,displayName:s.string,fileName:s.string,size:s.oneOf([W.label,D.label]),classes:s.shape({}).isRequired,small:s.bool},L.defaultProps={displayName:null,fileName:null,attachmentSize:void 0,size:D.label,small:!1};var U=a((function(o){return{imageIconRoot:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)"},dialog:{width:"95%",height:"95%",maxWidth:"100%",position:"relative"},nativeDialog:{width:"100%",height:"100%",maxWidth:"100%",maxHeight:"100%",margin:0},dialogRoot:{backgroundColor:"rgba(0, 0, 0, 0.85)"},fileName:{overflow:"hidden",whiteSpace:"nowrap",textOverflow:"ellipsis",fontWeight:400},downloadIcon:{color:o.palette.primary.text3},disabledPreview:{backgroundColor:o.palette.primary.text9},unavailableFileIcon:{marginRight:12,minWidth:32},titleContainer:{display:"flex",flexDirection:"column",width:"100%"},caption:{fontSize:12,fontWeight:400,width:"fit-content"},unavailableFileName:{fontSize:12,fontWeight:400}}}))(L);export{U as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/Attachment/index.js"],"sourcesContent":["import { useState, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport ReactPlayer from 'react-player';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Typography } from '@material-ui/core';\nimport ImageIcon from '@material-ui/icons/Image';\nimport FullSizeIcon from '@material-ui/icons/Fullscreen';\nimport grey from '@material-ui/core/colors/grey';\n\nimport { NewDocumentViewer } from '../NewDocumentViewer';\nimport { UnavailableFileIcon } from '../NewDocumentViewer/icons/UnavailableFileIcon';\n\nimport styles from './styles.css';\n\nimport FileTypeIcon from '~components/FileTypeIcon';\nimport ImageViewer from '~components/ImageViewer';\nimport IconButton from '~components/IconButton';\nimport { isNativeDetected } from '~/utils/mobileDetect';\nimport { getIsVideo, getIsImage } from '~/utils/fileExtension';\nimport { getIsPreviewUnavailable } from '~/utils/filePreview';\nimport { DownloadIcon } from '~/icons';\nimport { useSignedURL } from '~/effects';\nimport utils from '~utils/main'; // question here\n\nconst PAGE_NAME = 'Attachment';\n\nconst grey200 = grey[200];\nconst grey400 = grey[400];\n\nconst SIZES = {\n small: { label: 'small', value: 135 },\n medium: { label: 'medium', value: 300 },\n};\n\nconst style = {\n fileImage: (imageIsLoaded, size) => ({\n maxWidth: '100%',\n borderRadius: 4,\n overflow: 'hidden',\n // NOTE: Makes one-line comment with image fits into comments container. Equals to\n // imagePlaceholder height\n maxHeight: size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value,\n display: imageIsLoaded ? 'initial' : 'none',\n cursor: 'pointer',\n }),\n fileDownloadWrapper: {\n padding: '10px 10px 10px 5px',\n border: `1px solid #616161`,\n borderRadius: 3,\n maxWidth: 500, // NOTE: Corresponds to react-player max width\n width: '75%',\n },\n imagePlaceholder: {\n position: 'relative',\n backgroundColor: grey200,\n borderRadius: 3,\n marginTop: 10,\n height: 135,\n width: 135,\n },\n};\n\nconst muiStyles = theme => ({\n imageIconRoot: {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n },\n dialog: {\n width: '95%',\n height: '95%',\n maxWidth: '100%',\n position: 'relative',\n },\n nativeDialog: {\n width: '100%',\n height: '100%',\n maxWidth: '100%',\n maxHeight: '100%',\n margin: 0,\n },\n dialogRoot: {\n // NOTE: Make background color similar to lightbox\n backgroundColor: 'rgba(0, 0, 0, 0.85)',\n },\n fileName: {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n fontWeight: 400,\n },\n downloadIcon: {\n color: theme.palette.primary.text3,\n },\n disabledPreview: {\n backgroundColor: theme.palette.primary.text9,\n },\n unavailableFileIcon: {\n marginRight: 12,\n minWidth: 32,\n },\n titleContainer: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n },\n caption: {\n fontSize: 12,\n fontWeight: 400,\n width: 'fit-content',\n },\n unavailableFileName: {\n fontSize: 12,\n fontWeight: 400,\n },\n});\n\n/* eslint-disable react/prop-types */\nconst ImageAttachment = props => {\n const downloadLink = useSignedURL(props.attachmentFileName) || props.attachmentUrl;\n return (\n <>\n <div onClick={props.openLightbox} className={styles.cAttachmentImg}>\n <img\n data-testid={`${PAGE_NAME}_image`}\n src={downloadLink}\n style={style.fileImage(props.imageIsLoaded, props.size)}\n alt=\"Attachment\"\n onLoad={props.setImageIsLoaded}\n />\n <div data-testid={`${PAGE_NAME}_button`} className={styles.cAttachmentImgPreviwBtn}>\n <FullSizeIcon />\n </div>\n </div>\n\n {!props.imageIsLoaded && (\n <div style={style.imagePlaceholder}>\n <ImageIcon\n data-testid={`${PAGE_NAME}_placeholder`}\n className={props.classes.imageIconRoot}\n htmlColor={grey400}\n fontSize=\"large\"\n />\n </div>\n )}\n\n {props.lightboxIsOpen && (\n <ImageViewer\n mainSrc={downloadLink}\n imagePadding={50}\n onAfterOpen={props.handleLightboxOpen}\n onCloseRequest={props.handleLightboxClose}\n />\n )}\n </>\n );\n};\n\nconst FileAttachment = props => {\n const fileName = utils.getFileNameWithExtensionFromPath(props.displayName || props.attachmentUrl);\n const fileUrl = useSignedURL(props.attachmentFileName);\n\n const isPreviewUnavailable = getIsPreviewUnavailable(fileName);\n\n const handleFilePreviewOpen = () => {\n if (isPreviewUnavailable) return;\n props.openPreview();\n };\n\n return (\n <div className={styles.cAttachmentFileWrapper}>\n <div\n className={classNames(\n styles.cAttachmentFileDownloadWrapper,\n isPreviewUnavailable && props.classes.disabledPreview\n )}\n style={style.fileDownloadWrapper}\n onClick={handleFilePreviewOpen}\n >\n {isPreviewUnavailable ? (\n <UnavailableFileIcon className={props.classes.unavailableFileIcon} />\n ) : (\n <FileTypeIcon\n fileName={props.displayName || props.attachmentUrl}\n className={styles.cAttachmentFileDownloadWrapperFileIcon}\n size={props.small ? 25 : 50}\n />\n )}\n <div className={props.classes.titleContainer}>\n {isPreviewUnavailable && <div className={props.classes.caption}>Preview unavailable</div>}\n <div\n data-testid={`${PAGE_NAME}_name`}\n className={classNames(\n styles.cAttachmentFileDownloadWrapperFileName,\n isPreviewUnavailable && props.classes.fileName\n )}\n >\n <Typography variant=\"subtitle2\" noWrap className={props.classes.unavailableFileName}>\n {fileName}\n </Typography>\n </div>\n </div>\n <NewDocumentViewer\n fileUrl={fileUrl}\n classes={{\n root: props.classes.dialogRoot,\n paper: isNativeDetected ? props.classes.nativeDialog : props.classes.dialog,\n }}\n fileName={fileName}\n fileSize={props.attachmentSize}\n onClose={props.closePreview}\n open={props.previewIsOpen}\n />\n </div>\n <a\n download={props.displayName}\n href={fileUrl}\n className={styles.cAttachmentFileDownloadWrapperForm}\n >\n <IconButton\n data-testid={`${PAGE_NAME}_downloadButton`}\n className={props.classes.downloadIcon}\n type=\"submit\"\n >\n <DownloadIcon size={24} className={props.classes.downloadIcon} />\n </IconButton>\n </a>\n </div>\n );\n};\n\n/* eslint-enable react/prop-types */\n\nfunction Attachment(props) {\n const [isImageLoaded, setIsImageLoaded] = useState(false);\n const [isLightboxOpen, setIsLightboxOpen] = useState(false);\n const [isPreviewOpen, setIsPreviewOpen] = useState(false);\n\n const fileName = props.displayName || props.attachmentUrl || props.fileName;\n const isImage = getIsImage(fileName);\n const isVideo = getIsVideo(fileName);\n\n // Don't fetch download link if attachmentUrl is provided\n const downloadLink = useSignedURL(!props.attachmentUrl && props.fileName);\n const attachmentUrl = props.attachmentUrl || downloadLink;\n const preventIOSScroll = useCallback(e => e.preventDefault(), []);\n\n // NOTE: iOS WebView has a bug when background content of React Modal is scrollable\n // Source: https://github.com/reactjs/react-modal/issues/369\n const handleLightboxOpen = () => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'hidden';\n document.documentElement.addEventListener('touchmove', preventIOSScroll, {\n passive: false,\n });\n }\n };\n\n const handleLightboxClose = () => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'visible';\n document.documentElement.removeEventListener('touchmove', preventIOSScroll);\n }\n setIsLightboxOpen(false);\n };\n\n const openLightbox = () => setIsLightboxOpen(true);\n const setImageLoaded = () => setIsImageLoaded(true);\n const openPreview = () => setIsPreviewOpen(true);\n const closePreview = e => {\n e.stopPropagation();\n setIsPreviewOpen(false);\n };\n\n if (isImage)\n return (\n <div className={styles.cAttachment}>\n <ImageAttachment\n size={props.size}\n openLightbox={openLightbox}\n attachmentFileName={props.fileName}\n attachmentUrl={props.attachmentUrl}\n setImageIsLoaded={setImageLoaded}\n imageIsLoaded={isImageLoaded}\n lightboxIsOpen={isLightboxOpen}\n handleLightboxOpen={handleLightboxOpen}\n handleLightboxClose={handleLightboxClose}\n classes={props.classes}\n />\n </div>\n );\n\n if (isVideo && ReactPlayer.canPlay(attachmentUrl))\n return (\n <div className={styles.cAttachment}>\n <ReactPlayer\n data-testid={`${PAGE_NAME}_player`}\n className={styles.cAttachmentReactPlayer}\n url={attachmentUrl}\n config={{ file: { attributes: { preload: 'metadata' } } }}\n controls\n height={props.size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value}\n width={null}\n />\n </div>\n );\n\n return (\n <div className={styles.cAttachment}>\n <FileAttachment\n attachmentUrl={attachmentUrl}\n attachmentFileName={props.fileName}\n attachmentSize={props.attachmentSize}\n displayName={props.displayName}\n openPreview={openPreview}\n closePreview={closePreview}\n previewIsOpen={isPreviewOpen}\n classes={props.classes}\n small={props.small}\n />\n </div>\n );\n}\n\nAttachment.propTypes = {\n attachmentUrl: PropTypes.string.isRequired,\n attachmentSize: PropTypes.number,\n displayName: PropTypes.string,\n fileName: PropTypes.string,\n size: PropTypes.oneOf([SIZES.small.label, SIZES.medium.label]),\n classes: PropTypes.shape({}).isRequired,\n small: PropTypes.bool,\n};\n\nAttachment.defaultProps = {\n displayName: null,\n fileName: null,\n attachmentSize: undefined,\n size: SIZES.medium.label,\n small: false,\n};\n\nexport default withStyles(muiStyles)(Attachment);\n"],"names":["grey200","grey","grey400","SIZES","label","value","style","fileImage","imageIsLoaded","size","maxWidth","borderRadius","overflow","maxHeight","display","cursor","fileDownloadWrapper","padding","border","width","imagePlaceholder","position","backgroundColor","marginTop","height","ImageAttachment","props","downloadLink","useSignedURL","attachmentFileName","attachmentUrl","_jsxs","_Fragment","children","onClick","openLightbox","className","styles","cAttachmentImg","_jsx","concat","src","alt","onLoad","setImageIsLoaded","cAttachmentImgPreviwBtn","FullSizeIcon","ImageIcon","classes","imageIconRoot","htmlColor","fontSize","lightboxIsOpen","ImageViewer","mainSrc","imagePadding","onAfterOpen","handleLightboxOpen","onCloseRequest","handleLightboxClose","FileAttachment","fileName","utils","getFileNameWithExtensionFromPath","displayName","fileUrl","isPreviewUnavailable","getIsPreviewUnavailable","cAttachmentFileWrapper","classNames","cAttachmentFileDownloadWrapper","disabledPreview","openPreview","UnavailableFileIcon","unavailableFileIcon","FileTypeIcon","cAttachmentFileDownloadWrapperFileIcon","small","titleContainer","caption","cAttachmentFileDownloadWrapperFileName","Typography","variant","noWrap","unavailableFileName","NewDocumentViewer","root","dialogRoot","paper","isNativeDetected","nativeDialog","dialog","fileSize","attachmentSize","onClose","closePreview","open","previewIsOpen","download","href","cAttachmentFileDownloadWrapperForm","IconButton","downloadIcon","type","DownloadIcon","Attachment","useState","_useState2","_slicedToArray","_useState","isImageLoaded","setIsImageLoaded","_useState4","_useState3","isLightboxOpen","setIsLightboxOpen","_useState6","_useState5","isPreviewOpen","setIsPreviewOpen","isImage","getIsImage","isVideo","getIsVideo","preventIOSScroll","useCallback","e","preventDefault","cAttachment","document","documentElement","addEventListener","passive","removeEventListener","ReactPlayer","canPlay","cAttachmentReactPlayer","url","config","file","attributes","preload","controls","stopPropagation","propTypes","PropTypes","string","isRequired","number","oneOf","shape","bool","defaultProps","undefined","Attachment$1","withStyles","theme","top","left","transform","margin","whiteSpace","textOverflow","fontWeight","color","palette","primary","text3","text9","marginRight","minWidth","flexDirection"],"mappings":"6+IAyBA,IAEMA,EAAUC,EAAK,KACfC,EAAUD,EAAK,KAEfE,EACG,CAAEC,MAAO,QAASC,MAAO,KAD5BF,EAEI,CAAEC,MAAO,SAAUC,MAAO,KAG9BC,EAAQ,CACZC,UAAW,SAACC,EAAeC,GAAI,MAAM,CACnCC,SAAU,OACVC,aAAc,EACdC,SAAU,SAGVC,UAAWJ,IAASN,EAAYC,MAAQD,EAAYE,MAAQF,EAAaE,MACzES,QAASN,EAAgB,UAAY,OACrCO,OAAQ,UACR,EACFC,oBAAqB,CACnBC,QAAS,qBACTC,OAA2B,oBAC3BP,aAAc,EACdD,SAAU,IACVS,MAAO,OAETC,iBAAkB,CAChBC,SAAU,WACVC,gBAAiBtB,EACjBW,aAAc,EACdY,UAAW,GACXC,OAAQ,IACRL,MAAO,MA6DLM,EAAkB,SAAAC,GACtB,IAAMC,EAAeC,EAAaF,EAAMG,qBAAuBH,EAAMI,cACrE,OACEC,EAAAC,EAAA,CAAAC,SACE,CAAAF,EAAA,MAAA,CAAKG,QAASR,EAAMS,aAAcC,UAAWC,EAAOC,eAAeL,SACjE,CAAAM,EAAA,MAAA,CACE,cAAA,GAAAC,OArGQ,aAqG0B,UAClCC,IAAKd,EACLrB,MAAOA,EAAMC,UAAUmB,EAAMlB,cAAekB,EAAMjB,MAClDiC,IAAI,aACJC,OAAQjB,EAAMkB,mBAEhBL,EAAA,MAAA,CAAK,cAAA,GAAAC,OA3GK,aA2G8B,WAACJ,UAAWC,EAAOQ,wBAAwBZ,SACjFM,EAACO,EAAY,UAIfpB,EAAMlB,eACN+B,EAAA,MAAA,CAAKjC,MAAOA,EAAMc,iBAAiBa,SACjCM,EAACQ,EAAS,CACR,cAAA,GAAAP,OAnHM,aAmHkC,gBACxCJ,UAAWV,EAAMsB,QAAQC,cACzBC,UAAWhD,EACXiD,SAAS,YAKdzB,EAAM0B,gBACLb,EAACc,EAAW,CACVC,QAAS3B,EACT4B,aAAc,GACdC,YAAa9B,EAAM+B,mBACnBC,eAAgBhC,EAAMiC,wBAKhC,EAEMC,EAAiB,SAAAlC,GACrB,IAAMmC,EAAWC,EAAMC,iCAAiCrC,EAAMsC,aAAetC,EAAMI,eAC7EmC,EAAUrC,EAAaF,EAAMG,oBAE7BqC,EAAuBC,EAAwBN,GAOrD,OACE9B,EAAA,MAAA,CAAKK,UAAWC,EAAO+B,uBAAuBnC,SAC5C,CAAAF,EAAA,MAAA,CACEK,UAAWiC,EACThC,EAAOiC,+BACPJ,GAAwBxC,EAAMsB,QAAQuB,iBAExCjE,MAAOA,EAAMU,oBACbkB,QAbwB,WACxBgC,GACJxC,EAAM8C,eAW6BvC,SAE9BiC,CAAAA,EACC3B,EAACkC,EAAmB,CAACrC,UAAWV,EAAMsB,QAAQ0B,sBAE9CnC,EAACoC,EAAY,CACXd,SAAUnC,EAAMsC,aAAetC,EAAMI,cACrCM,UAAWC,EAAOuC,uCAClBnE,KAAMiB,EAAMmD,MAAQ,GAAK,KAG7B9C,EAAA,MAAA,CAAKK,UAAWV,EAAMsB,QAAQ8B,eAAe7C,SAAA,CAC1CiC,GAAwB3B,EAAA,MAAA,CAAKH,UAAWV,EAAMsB,QAAQ+B,QAAQ9C,SAAA,wBAC/DM,EAAA,MAAA,CACE,cAAA,GAAAC,OAxKM,aAwK2B,SACjCJ,UAAWiC,EACThC,EAAO2C,uCACPd,GAAwBxC,EAAMsB,QAAQa,UACtC5B,SAEFM,EAAC0C,EAAU,CAACC,QAAQ,YAAYC,QAAM,EAAC/C,UAAWV,EAAMsB,QAAQoC,oBAAoBnD,SACjF4B,SAIPtB,EAAC8C,EAAiB,CAChBpB,QAASA,EACTjB,QAAS,CACPsC,KAAM5D,EAAMsB,QAAQuC,WACpBC,MAAOC,EAAmB/D,EAAMsB,QAAQ0C,aAAehE,EAAMsB,QAAQ2C,QAEvE9B,SAAUA,EACV+B,SAAUlE,EAAMmE,eAChBC,QAASpE,EAAMqE,aACfC,KAAMtE,EAAMuE,mBAGhB1D,EAAA,IAAA,CACE2D,SAAUxE,EAAMsC,YAChBmC,KAAMlC,EACN7B,UAAWC,EAAO+D,mCAAmCnE,SAErDM,EAAC8D,EAAU,CACT,cAAA,GAAA7D,OArMQ,aAqMmC,mBAC3CJ,UAAWV,EAAMsB,QAAQsD,aACzBC,KAAK,SAAQtE,SAEbM,EAACiE,EAAY,CAAC/F,KAAM,GAAI2B,UAAWV,EAAMsB,QAAQsD,qBAK3D,EAIA,SAASG,EAAW/E,GAClB,IAA0CgF,EAAAA,GAAS,GAAMC,EAAAC,EAAAC,EAAA,GAAlDC,EAAaH,EAAA,GAAEI,EAAgBJ,EAAA,GACMD,EAAAA,GAAS,GAAMM,EAAAJ,EAAAK,EAAA,GAApDC,EAAcF,EAAA,GAAEG,EAAiBH,EAAA,GACEN,EAAAA,GAAS,GAAMU,EAAAR,EAAAS,EAAA,GAAlDC,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAEhCvD,EAAWnC,EAAMsC,aAAetC,EAAMI,eAAiBJ,EAAMmC,SAC7D2D,EAAUC,EAAW5D,GACrB6D,EAAUC,EAAW9D,GAGrBlC,EAAeC,GAAcF,EAAMI,eAAiBJ,EAAMmC,UAC1D/B,EAAgBJ,EAAMI,eAAiBH,EACvCiG,EAAmBC,GAAY,SAAAC,GAAC,OAAIA,EAAEC,gBAAgB,GAAE,IA6B9D,OAAIP,EAEAjF,EAAA,MAAA,CAAKH,UAAWC,EAAO2F,YAAY/F,SACjCM,EAACd,EAAe,CACdhB,KAAMiB,EAAMjB,KACZ0B,aAba,WAAH,OAASgF,GAAkB,EAAK,EAc1CtF,mBAAoBH,EAAMmC,SAC1B/B,cAAeJ,EAAMI,cACrBc,iBAfe,WAAH,OAASmE,GAAiB,EAAK,EAgB3CvG,cAAesG,EACf1D,eAAgB8D,EAChBzD,mBApCmB,WACrBgC,GAEFwC,SAASC,gBAAgBC,iBAAiB,YAAaP,EAAkB,CACvEQ,SAAS,KAiCPzE,oBA5BoB,WACtB8B,GAEFwC,SAASC,gBAAgBG,oBAAoB,YAAaT,GAE5DT,GAAkB,IAwBZnE,QAAStB,EAAMsB,YAKnB0E,GAAWY,EAAYC,QAAQzG,GAE/BS,EAAA,MAAA,CAAKH,UAAWC,EAAO2F,YAAY/F,SACjCM,EAAC+F,EAAW,CACV,cAAA,GAAA9F,OAjRQ,aAiR2B,WACnCJ,UAAWC,EAAOmG,uBAClBC,IAAK3G,EACL4G,OAAQ,CAAEC,KAAM,CAAEC,WAAY,CAAEC,QAAS,cACzCC,UAAQ,EACRtH,OAAQE,EAAMjB,OAASN,EAAYC,MAAQD,EAAYE,MAAQF,EAAaE,MAC5Ec,MAAO,SAMboB,EAAA,MAAA,CAAKH,UAAWC,EAAO2F,YAAY/F,SACjCM,EAACqB,EAAc,CACb9B,cAAeA,EACfD,mBAAoBH,EAAMmC,SAC1BgC,eAAgBnE,EAAMmE,eACtB7B,YAAatC,EAAMsC,YACnBQ,YA9Cc,WAAH,OAAS+C,GAAiB,EAAK,EA+C1CxB,aA9Ce,SAAA+B,GACnBA,EAAEiB,kBACFxB,GAAiB,IA6CbtB,cAAeqB,EACftE,QAAStB,EAAMsB,QACf6B,MAAOnD,EAAMmD,SAIrB,CAEA4B,EAAWuC,UAAY,CACrBlH,cAAemH,EAAUC,OAAOC,WAChCtD,eAAgBoD,EAAUG,OAC1BpF,YAAaiF,EAAUC,OACvBrF,SAAUoF,EAAUC,OACpBzI,KAAMwI,EAAUI,MAAM,CAAClJ,EAAYC,MAAOD,EAAaC,QACvD4C,QAASiG,EAAUK,MAAM,CAAA,GAAIH,WAC7BtE,MAAOoE,EAAUM,MAGnB9C,EAAW+C,aAAe,CACxBxF,YAAa,KACbH,SAAU,KACVgC,oBAAgB4D,EAChBhJ,KAAMN,EAAaC,MACnByE,OAAO,GAGT,IAAA6E,EAAeC,GAzRG,SAAAC,GAAK,MAAK,CAC1B3G,cAAe,CACb5B,SAAU,WACVwI,IAAK,MACLC,KAAM,MACNC,UAAW,yBAEbpE,OAAQ,CACNxE,MAAO,MACPK,OAAQ,MACRd,SAAU,OACVW,SAAU,YAEZqE,aAAc,CACZvE,MAAO,OACPK,OAAQ,OACRd,SAAU,OACVG,UAAW,OACXmJ,OAAQ,GAEVzE,WAAY,CAEVjE,gBAAiB,uBAEnBuC,SAAU,CACRjD,SAAU,SACVqJ,WAAY,SACZC,aAAc,WACdC,WAAY,KAEd7D,aAAc,CACZ8D,MAAOR,EAAMS,QAAQC,QAAQC,OAE/BhG,gBAAiB,CACfjD,gBAAiBsI,EAAMS,QAAQC,QAAQE,OAEzC9F,oBAAqB,CACnB+F,YAAa,GACbC,SAAU,IAEZ5F,eAAgB,CACdhE,QAAS,OACT6J,cAAe,SACfxJ,MAAO,QAET4D,QAAS,CACP5B,SAAU,GACVgH,WAAY,IACZhJ,MAAO,eAETiE,oBAAqB,CACnBjC,SAAU,GACVgH,WAAY,KAEf,GAmOcR,CAAsBlD"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/Attachment/index.js"],"sourcesContent":["import { useState, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport ReactPlayer from 'react-player';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Typography } from '@material-ui/core';\nimport ImageIcon from '@material-ui/icons/Image';\nimport FullSizeIcon from '@material-ui/icons/Fullscreen';\nimport grey from '@material-ui/core/colors/grey';\n\nimport { NewDocumentViewer } from '../NewDocumentViewer';\nimport { UnavailableFileIcon } from '../NewDocumentViewer/icons/UnavailableFileIcon';\n\nimport styles from './styles.css';\n\nimport FileTypeIcon from '~components/FileTypeIcon';\nimport ImageViewer from '~components/ImageViewer';\nimport IconButton from '~components/IconButton';\nimport { isNativeDetected } from '~/utils/mobileDetect';\nimport { getIsVideo, getIsImage } from '~/utils/fileExtension';\nimport { getIsPreviewUnavailable } from '~/utils/filePreview';\nimport { DownloadIcon } from '~/icons';\nimport { useSignedURL } from '~/effects';\nimport utils from '~utils/main'; // question here\n\nconst PAGE_NAME = 'Attachment';\n\nconst grey200 = grey[200];\nconst grey400 = grey[400];\n\nconst SIZES = {\n small: { label: 'small', value: 135 },\n medium: { label: 'medium', value: 300 },\n};\n\nconst style = {\n fileImage: (imageIsLoaded, size) => ({\n maxWidth: '100%',\n borderRadius: 4,\n overflow: 'hidden',\n // NOTE: Makes one-line comment with image fits into comments container. Equals to\n // imagePlaceholder height\n maxHeight: size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value,\n display: imageIsLoaded ? 'initial' : 'none',\n cursor: 'pointer',\n }),\n fileDownloadWrapper: {\n padding: '10px 10px 10px 5px',\n border: `1px solid #616161`,\n borderRadius: 3,\n maxWidth: 500, // NOTE: Corresponds to react-player max width\n width: '75%',\n },\n imagePlaceholder: {\n position: 'relative',\n backgroundColor: grey200,\n borderRadius: 3,\n marginTop: 10,\n height: 135,\n width: 135,\n },\n};\n\nconst muiStyles = theme => ({\n imageIconRoot: {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n },\n dialog: {\n width: '95%',\n height: '95%',\n maxWidth: '100%',\n position: 'relative',\n },\n nativeDialog: {\n width: '100%',\n height: '100%',\n maxWidth: '100%',\n maxHeight: '100%',\n margin: 0,\n },\n dialogRoot: {\n // NOTE: Make background color similar to lightbox\n backgroundColor: 'rgba(0, 0, 0, 0.85)',\n },\n fileName: {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n fontWeight: 400,\n },\n downloadIcon: {\n color: theme.palette.primary.text3,\n },\n disabledPreview: {\n backgroundColor: theme.palette.primary.text9,\n },\n unavailableFileIcon: {\n marginRight: 12,\n minWidth: 32,\n },\n titleContainer: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n },\n caption: {\n fontSize: 12,\n fontWeight: 400,\n width: 'fit-content',\n },\n unavailableFileName: {\n fontSize: 12,\n fontWeight: 400,\n },\n});\n\n/* eslint-disable react/prop-types */\nconst ImageAttachment = props => {\n const downloadLink = useSignedURL(props.attachmentFileName) || props.attachmentUrl;\n return (\n <>\n <div onClick={props.openLightbox} className={styles.cAttachmentImg}>\n <img\n data-testid={`${PAGE_NAME}_image`}\n src={downloadLink}\n style={style.fileImage(props.imageIsLoaded, props.size)}\n alt=\"Attachment\"\n onLoad={props.setImageIsLoaded}\n />\n <div data-testid={`${PAGE_NAME}_button`} className={styles.cAttachmentImgPreviwBtn}>\n <FullSizeIcon />\n </div>\n </div>\n\n {!props.imageIsLoaded && (\n <div style={style.imagePlaceholder}>\n <ImageIcon\n data-testid={`${PAGE_NAME}_placeholder`}\n className={props.classes.imageIconRoot}\n htmlColor={grey400}\n fontSize=\"large\"\n />\n </div>\n )}\n\n {props.lightboxIsOpen && (\n <ImageViewer\n mainSrc={downloadLink}\n imagePadding={50}\n onAfterOpen={props.handleLightboxOpen}\n onCloseRequest={props.handleLightboxClose}\n />\n )}\n </>\n );\n};\n\nconst FileAttachment = props => {\n const fileName = utils.getFileNameWithExtensionFromPath(props.displayName || props.attachmentUrl);\n\n const previewUrl = useSignedURL(props.attachmentFileName, 'inline');\n const downloadUrl = useSignedURL(props.attachmentFileName, 'attachment');\n\n const isPreviewUnavailable = getIsPreviewUnavailable(fileName);\n\n const handleFilePreviewOpen = () => {\n if (isPreviewUnavailable) return;\n props.openPreview();\n };\n\n return (\n <div className={styles.cAttachmentFileWrapper}>\n <div\n className={classNames(\n styles.cAttachmentFileDownloadWrapper,\n isPreviewUnavailable && props.classes.disabledPreview\n )}\n style={style.fileDownloadWrapper}\n onClick={handleFilePreviewOpen}\n >\n {isPreviewUnavailable ? (\n <UnavailableFileIcon className={props.classes.unavailableFileIcon} />\n ) : (\n <FileTypeIcon\n fileName={props.displayName || props.attachmentUrl}\n className={styles.cAttachmentFileDownloadWrapperFileIcon}\n size={props.small ? 25 : 50}\n />\n )}\n <div className={props.classes.titleContainer}>\n {isPreviewUnavailable && <div className={props.classes.caption}>Preview unavailable</div>}\n <div\n data-testid={`${PAGE_NAME}_name`}\n className={classNames(\n styles.cAttachmentFileDownloadWrapperFileName,\n isPreviewUnavailable && props.classes.fileName\n )}\n >\n <Typography variant=\"subtitle2\" noWrap className={props.classes.unavailableFileName}>\n {fileName}\n </Typography>\n </div>\n </div>\n <NewDocumentViewer\n fileUrl={previewUrl}\n classes={{\n root: props.classes.dialogRoot,\n paper: isNativeDetected ? props.classes.nativeDialog : props.classes.dialog,\n }}\n fileName={fileName}\n fileSize={props.attachmentSize}\n onClose={props.closePreview}\n open={props.previewIsOpen}\n />\n </div>\n <a\n download={props.displayName}\n href={downloadUrl}\n className={styles.cAttachmentFileDownloadWrapperForm}\n >\n <IconButton\n data-testid={`${PAGE_NAME}_downloadButton`}\n className={props.classes.downloadIcon}\n type=\"submit\"\n >\n <DownloadIcon size={24} className={props.classes.downloadIcon} />\n </IconButton>\n </a>\n </div>\n );\n};\n\n/* eslint-enable react/prop-types */\n\nfunction Attachment(props) {\n const [isImageLoaded, setIsImageLoaded] = useState(false);\n const [isLightboxOpen, setIsLightboxOpen] = useState(false);\n const [isPreviewOpen, setIsPreviewOpen] = useState(false);\n\n const fileName = props.displayName || props.attachmentUrl || props.fileName;\n const isImage = getIsImage(fileName);\n const isVideo = getIsVideo(fileName);\n\n // Don't fetch download link if attachmentUrl is provided\n const downloadLink = useSignedURL(!props.attachmentUrl && props.fileName);\n const attachmentUrl = props.attachmentUrl || downloadLink;\n const preventIOSScroll = useCallback(e => e.preventDefault(), []);\n\n // NOTE: iOS WebView has a bug when background content of React Modal is scrollable\n // Source: https://github.com/reactjs/react-modal/issues/369\n const handleLightboxOpen = () => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'hidden';\n document.documentElement.addEventListener('touchmove', preventIOSScroll, {\n passive: false,\n });\n }\n };\n\n const handleLightboxClose = () => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'visible';\n document.documentElement.removeEventListener('touchmove', preventIOSScroll);\n }\n setIsLightboxOpen(false);\n };\n\n const openLightbox = () => setIsLightboxOpen(true);\n const setImageLoaded = () => setIsImageLoaded(true);\n const openPreview = () => setIsPreviewOpen(true);\n const closePreview = e => {\n e.stopPropagation();\n setIsPreviewOpen(false);\n };\n\n if (isImage)\n return (\n <div className={styles.cAttachment}>\n <ImageAttachment\n size={props.size}\n openLightbox={openLightbox}\n attachmentFileName={props.fileName}\n attachmentUrl={props.attachmentUrl}\n setImageIsLoaded={setImageLoaded}\n imageIsLoaded={isImageLoaded}\n lightboxIsOpen={isLightboxOpen}\n handleLightboxOpen={handleLightboxOpen}\n handleLightboxClose={handleLightboxClose}\n classes={props.classes}\n />\n </div>\n );\n\n if (isVideo && ReactPlayer.canPlay(attachmentUrl))\n return (\n <div className={styles.cAttachment}>\n <ReactPlayer\n data-testid={`${PAGE_NAME}_player`}\n className={styles.cAttachmentReactPlayer}\n url={attachmentUrl}\n config={{ file: { attributes: { preload: 'metadata' } } }}\n controls\n height={props.size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value}\n width={null}\n />\n </div>\n );\n\n return (\n <div className={styles.cAttachment}>\n <FileAttachment\n attachmentUrl={attachmentUrl}\n attachmentFileName={props.fileName}\n attachmentSize={props.attachmentSize}\n displayName={props.displayName}\n openPreview={openPreview}\n closePreview={closePreview}\n previewIsOpen={isPreviewOpen}\n classes={props.classes}\n small={props.small}\n />\n </div>\n );\n}\n\nAttachment.propTypes = {\n attachmentUrl: PropTypes.string.isRequired,\n attachmentSize: PropTypes.number,\n displayName: PropTypes.string,\n fileName: PropTypes.string,\n size: PropTypes.oneOf([SIZES.small.label, SIZES.medium.label]),\n classes: PropTypes.shape({}).isRequired,\n small: PropTypes.bool,\n};\n\nAttachment.defaultProps = {\n displayName: null,\n fileName: null,\n attachmentSize: undefined,\n size: SIZES.medium.label,\n small: false,\n};\n\nexport default withStyles(muiStyles)(Attachment);\n"],"names":["grey200","grey","grey400","SIZES","label","value","style","fileImage","imageIsLoaded","size","maxWidth","borderRadius","overflow","maxHeight","display","cursor","fileDownloadWrapper","padding","border","width","imagePlaceholder","position","backgroundColor","marginTop","height","ImageAttachment","props","downloadLink","useSignedURL","attachmentFileName","attachmentUrl","_jsxs","_Fragment","children","onClick","openLightbox","className","styles","cAttachmentImg","_jsx","concat","src","alt","onLoad","setImageIsLoaded","cAttachmentImgPreviwBtn","FullSizeIcon","ImageIcon","classes","imageIconRoot","htmlColor","fontSize","lightboxIsOpen","ImageViewer","mainSrc","imagePadding","onAfterOpen","handleLightboxOpen","onCloseRequest","handleLightboxClose","FileAttachment","fileName","utils","getFileNameWithExtensionFromPath","displayName","previewUrl","downloadUrl","isPreviewUnavailable","getIsPreviewUnavailable","cAttachmentFileWrapper","classNames","cAttachmentFileDownloadWrapper","disabledPreview","openPreview","UnavailableFileIcon","unavailableFileIcon","FileTypeIcon","cAttachmentFileDownloadWrapperFileIcon","small","titleContainer","caption","cAttachmentFileDownloadWrapperFileName","Typography","variant","noWrap","unavailableFileName","NewDocumentViewer","fileUrl","root","dialogRoot","paper","isNativeDetected","nativeDialog","dialog","fileSize","attachmentSize","onClose","closePreview","open","previewIsOpen","download","href","cAttachmentFileDownloadWrapperForm","IconButton","downloadIcon","type","DownloadIcon","Attachment","useState","_useState2","_slicedToArray","_useState","isImageLoaded","setIsImageLoaded","_useState4","_useState3","isLightboxOpen","setIsLightboxOpen","_useState6","_useState5","isPreviewOpen","setIsPreviewOpen","isImage","getIsImage","isVideo","getIsVideo","preventIOSScroll","useCallback","e","preventDefault","cAttachment","document","documentElement","addEventListener","passive","removeEventListener","ReactPlayer","canPlay","cAttachmentReactPlayer","url","config","file","attributes","preload","controls","stopPropagation","propTypes","PropTypes","string","isRequired","number","oneOf","shape","bool","defaultProps","undefined","Attachment$1","withStyles","theme","top","left","transform","margin","whiteSpace","textOverflow","fontWeight","color","palette","primary","text3","text9","marginRight","minWidth","flexDirection"],"mappings":"6+IAyBA,IAEMA,EAAUC,EAAK,KACfC,EAAUD,EAAK,KAEfE,EACG,CAAEC,MAAO,QAASC,MAAO,KAD5BF,EAEI,CAAEC,MAAO,SAAUC,MAAO,KAG9BC,EAAQ,CACZC,UAAW,SAACC,EAAeC,GAAI,MAAM,CACnCC,SAAU,OACVC,aAAc,EACdC,SAAU,SAGVC,UAAWJ,IAASN,EAAYC,MAAQD,EAAYE,MAAQF,EAAaE,MACzES,QAASN,EAAgB,UAAY,OACrCO,OAAQ,UACR,EACFC,oBAAqB,CACnBC,QAAS,qBACTC,OAA2B,oBAC3BP,aAAc,EACdD,SAAU,IACVS,MAAO,OAETC,iBAAkB,CAChBC,SAAU,WACVC,gBAAiBtB,EACjBW,aAAc,EACdY,UAAW,GACXC,OAAQ,IACRL,MAAO,MA6DLM,EAAkB,SAAAC,GACtB,IAAMC,EAAeC,EAAaF,EAAMG,qBAAuBH,EAAMI,cACrE,OACEC,EAAAC,EAAA,CAAAC,SACE,CAAAF,EAAA,MAAA,CAAKG,QAASR,EAAMS,aAAcC,UAAWC,EAAOC,eAAeL,SACjE,CAAAM,EAAA,MAAA,CACE,cAAA,GAAAC,OArGQ,aAqG0B,UAClCC,IAAKd,EACLrB,MAAOA,EAAMC,UAAUmB,EAAMlB,cAAekB,EAAMjB,MAClDiC,IAAI,aACJC,OAAQjB,EAAMkB,mBAEhBL,EAAA,MAAA,CAAK,cAAA,GAAAC,OA3GK,aA2G8B,WAACJ,UAAWC,EAAOQ,wBAAwBZ,SACjFM,EAACO,EAAY,UAIfpB,EAAMlB,eACN+B,EAAA,MAAA,CAAKjC,MAAOA,EAAMc,iBAAiBa,SACjCM,EAACQ,EAAS,CACR,cAAA,GAAAP,OAnHM,aAmHkC,gBACxCJ,UAAWV,EAAMsB,QAAQC,cACzBC,UAAWhD,EACXiD,SAAS,YAKdzB,EAAM0B,gBACLb,EAACc,EAAW,CACVC,QAAS3B,EACT4B,aAAc,GACdC,YAAa9B,EAAM+B,mBACnBC,eAAgBhC,EAAMiC,wBAKhC,EAEMC,EAAiB,SAAAlC,GACrB,IAAMmC,EAAWC,EAAMC,iCAAiCrC,EAAMsC,aAAetC,EAAMI,eAE7EmC,EAAarC,EAAaF,EAAMG,mBAAoB,UACpDqC,EAActC,EAAaF,EAAMG,mBAAoB,cAErDsC,EAAuBC,EAAwBP,GAOrD,OACE9B,EAAA,MAAA,CAAKK,UAAWC,EAAOgC,uBAAuBpC,SAC5C,CAAAF,EAAA,MAAA,CACEK,UAAWkC,EACTjC,EAAOkC,+BACPJ,GAAwBzC,EAAMsB,QAAQwB,iBAExClE,MAAOA,EAAMU,oBACbkB,QAbwB,WACxBiC,GACJzC,EAAM+C,eAW6BxC,SAE9BkC,CAAAA,EACC5B,EAACmC,EAAmB,CAACtC,UAAWV,EAAMsB,QAAQ2B,sBAE9CpC,EAACqC,EAAY,CACXf,SAAUnC,EAAMsC,aAAetC,EAAMI,cACrCM,UAAWC,EAAOwC,uCAClBpE,KAAMiB,EAAMoD,MAAQ,GAAK,KAG7B/C,EAAA,MAAA,CAAKK,UAAWV,EAAMsB,QAAQ+B,eAAe9C,SAAA,CAC1CkC,GAAwB5B,EAAA,MAAA,CAAKH,UAAWV,EAAMsB,QAAQgC,QAAQ/C,SAAA,wBAC/DM,EAAA,MAAA,CACE,cAAA,GAAAC,OA1KM,aA0K2B,SACjCJ,UAAWkC,EACTjC,EAAO4C,uCACPd,GAAwBzC,EAAMsB,QAAQa,UACtC5B,SAEFM,EAAC2C,EAAU,CAACC,QAAQ,YAAYC,QAAM,EAAChD,UAAWV,EAAMsB,QAAQqC,oBAAoBpD,SACjF4B,SAIPtB,EAAC+C,EAAiB,CAChBC,QAAStB,EACTjB,QAAS,CACPwC,KAAM9D,EAAMsB,QAAQyC,WACpBC,MAAOC,EAAmBjE,EAAMsB,QAAQ4C,aAAelE,EAAMsB,QAAQ6C,QAEvEhC,SAAUA,EACViC,SAAUpE,EAAMqE,eAChBC,QAAStE,EAAMuE,aACfC,KAAMxE,EAAMyE,mBAGhB5D,EAAA,IAAA,CACE6D,SAAU1E,EAAMsC,YAChBqC,KAAMnC,EACN9B,UAAWC,EAAOiE,mCAAmCrE,SAErDM,EAACgE,EAAU,CACT,cAAA,GAAA/D,OAvMQ,aAuMmC,mBAC3CJ,UAAWV,EAAMsB,QAAQwD,aACzBC,KAAK,SAAQxE,SAEbM,EAACmE,EAAY,CAACjG,KAAM,GAAI2B,UAAWV,EAAMsB,QAAQwD,qBAK3D,EAIA,SAASG,EAAWjF,GAClB,IAA0CkF,EAAAA,GAAS,GAAMC,EAAAC,EAAAC,EAAA,GAAlDC,EAAaH,EAAA,GAAEI,EAAgBJ,EAAA,GACMD,EAAAA,GAAS,GAAMM,EAAAJ,EAAAK,EAAA,GAApDC,EAAcF,EAAA,GAAEG,EAAiBH,EAAA,GACEN,EAAAA,GAAS,GAAMU,EAAAR,EAAAS,EAAA,GAAlDC,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAEhCzD,EAAWnC,EAAMsC,aAAetC,EAAMI,eAAiBJ,EAAMmC,SAC7D6D,EAAUC,EAAW9D,GACrB+D,EAAUC,EAAWhE,GAGrBlC,EAAeC,GAAcF,EAAMI,eAAiBJ,EAAMmC,UAC1D/B,EAAgBJ,EAAMI,eAAiBH,EACvCmG,EAAmBC,GAAY,SAAAC,GAAC,OAAIA,EAAEC,gBAAgB,GAAE,IA6B9D,OAAIP,EAEAnF,EAAA,MAAA,CAAKH,UAAWC,EAAO6F,YAAYjG,SACjCM,EAACd,EAAe,CACdhB,KAAMiB,EAAMjB,KACZ0B,aAba,WAAH,OAASkF,GAAkB,EAAK,EAc1CxF,mBAAoBH,EAAMmC,SAC1B/B,cAAeJ,EAAMI,cACrBc,iBAfe,WAAH,OAASqE,GAAiB,EAAK,EAgB3CzG,cAAewG,EACf5D,eAAgBgE,EAChB3D,mBApCmB,WACrBkC,GAEFwC,SAASC,gBAAgBC,iBAAiB,YAAaP,EAAkB,CACvEQ,SAAS,KAiCP3E,oBA5BoB,WACtBgC,GAEFwC,SAASC,gBAAgBG,oBAAoB,YAAaT,GAE5DT,GAAkB,IAwBZrE,QAAStB,EAAMsB,YAKnB4E,GAAWY,EAAYC,QAAQ3G,GAE/BS,EAAA,MAAA,CAAKH,UAAWC,EAAO6F,YAAYjG,SACjCM,EAACiG,EAAW,CACV,cAAA,GAAAhG,OAnRQ,aAmR2B,WACnCJ,UAAWC,EAAOqG,uBAClBC,IAAK7G,EACL8G,OAAQ,CAAEC,KAAM,CAAEC,WAAY,CAAEC,QAAS,cACzCC,UAAQ,EACRxH,OAAQE,EAAMjB,OAASN,EAAYC,MAAQD,EAAYE,MAAQF,EAAaE,MAC5Ec,MAAO,SAMboB,EAAA,MAAA,CAAKH,UAAWC,EAAO6F,YAAYjG,SACjCM,EAACqB,EAAc,CACb9B,cAAeA,EACfD,mBAAoBH,EAAMmC,SAC1BkC,eAAgBrE,EAAMqE,eACtB/B,YAAatC,EAAMsC,YACnBS,YA9Cc,WAAH,OAASgD,GAAiB,EAAK,EA+C1CxB,aA9Ce,SAAA+B,GACnBA,EAAEiB,kBACFxB,GAAiB,IA6CbtB,cAAeqB,EACfxE,QAAStB,EAAMsB,QACf8B,MAAOpD,EAAMoD,SAIrB,CAEA6B,EAAWuC,UAAY,CACrBpH,cAAeqH,EAAUC,OAAOC,WAChCtD,eAAgBoD,EAAUG,OAC1BtF,YAAamF,EAAUC,OACvBvF,SAAUsF,EAAUC,OACpB3I,KAAM0I,EAAUI,MAAM,CAACpJ,EAAYC,MAAOD,EAAaC,QACvD4C,QAASmG,EAAUK,MAAM,CAAA,GAAIH,WAC7BvE,MAAOqE,EAAUM,MAGnB9C,EAAW+C,aAAe,CACxB1F,YAAa,KACbH,SAAU,KACVkC,oBAAgB4D,EAChBlJ,KAAMN,EAAaC,MACnB0E,OAAO,GAGT,IAAA8E,EAAeC,GA3RG,SAAAC,GAAK,MAAK,CAC1B7G,cAAe,CACb5B,SAAU,WACV0I,IAAK,MACLC,KAAM,MACNC,UAAW,yBAEbpE,OAAQ,CACN1E,MAAO,MACPK,OAAQ,MACRd,SAAU,OACVW,SAAU,YAEZuE,aAAc,CACZzE,MAAO,OACPK,OAAQ,OACRd,SAAU,OACVG,UAAW,OACXqJ,OAAQ,GAEVzE,WAAY,CAEVnE,gBAAiB,uBAEnBuC,SAAU,CACRjD,SAAU,SACVuJ,WAAY,SACZC,aAAc,WACdC,WAAY,KAEd7D,aAAc,CACZ8D,MAAOR,EAAMS,QAAQC,QAAQC,OAE/BjG,gBAAiB,CACflD,gBAAiBwI,EAAMS,QAAQC,QAAQE,OAEzC/F,oBAAqB,CACnBgG,YAAa,GACbC,SAAU,IAEZ7F,eAAgB,CACdjE,QAAS,OACT+J,cAAe,SACf1J,MAAO,QAET6D,QAAS,CACP7B,SAAU,GACVkH,WAAY,IACZlJ,MAAO,eAETkE,oBAAqB,CACnBlC,SAAU,GACVkH,WAAY,KAEf,GAqOcR,CAAsBlD"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import r from"@babel/runtime/helpers/defineProperty";import{makeStyles as e}from"@material-ui/core";import{isEmpty as o}from"lodash";import{useEffect as t}from"react";import{updateAxisStyles as n}from"../formations.js";function i(r,e){var o=Object.keys(r);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(r);e&&(t=t.filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable}))),o.push.apply(o,t)}return o}function s(e){for(var o=1;o<arguments.length;o++){var t=null!=arguments[o]?arguments[o]:{};o%2?i(Object(t),!0).forEach((function(o){r(e,o,t[o])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):i(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}var a=function(r,e,o){var t;return
|
|
1
|
+
import r from"@babel/runtime/helpers/defineProperty";import{makeStyles as e}from"@material-ui/core";import{isEmpty as o}from"lodash";import{useEffect as t}from"react";import{updateAxisStyles as n}from"../formations.js";function i(r,e){var o=Object.keys(r);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(r);e&&(t=t.filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable}))),o.push.apply(o,t)}return o}function s(e){for(var o=1;o<arguments.length;o++){var t=null!=arguments[o]?arguments[o]:{};o%2?i(Object(t),!0).forEach((function(o){r(e,o,t[o])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):i(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}var a=function(r,e,o){var t,n,i;return(null===(t=window.Highcharts)||void 0===t||null===(n=t.version)||void 0===n?void 0:n.startsWith("10"))?{zooming:{type:o||!e?"none":r.zoomType,panning:{enabled:!e,type:(null===(i=r.panning)||void 0===i?void 0:i.type)||"xy"},panKey:""}}:{zoomType:o||!e?"none":r.zoomType}},c=e({axisGrab:{cursor:"grab"},axisCrosshair:{cursor:"crosshair"}}),l=function(r){var e=r.chart,i=r.chartOptions,l=r.isZoomEnabled,p=r.isMinHeightChart,u=r.handleChartSelection,f=r.onZoomChangeCallback,h=r.isAxesCoordinatesShown,g=c();t((function(){if(!o(e)){var r={zIndex:1,color:"#ffffff",dashStyle:"dash"};e.plotBackground.element.style.cursor=p||!l?"grab":"crosshair",e.series.forEach((function(r){var e;return null==r||null===(e=r.group)||void 0===e?void 0:e.css({cursor:p||!l?"grab":"crosshair"})})),e.update({chart:s(s({},i),{},{plotBackgroundColor:"transparent"},a(i,l,p)),xAxis:{crosshair:h?r:null,className:l?g.axisCrosshair:g.axisGrab,events:{afterSetExtremes:function(r){var o,t;"zoom"!==r.trigger&&"navigator"!==r.trigger||u(),null!==(o=e.xAxis)&&void 0!==o&&null!==(t=o[0].userOptions.plotLines)&&void 0!==t&&t.length&&n({chart:e}),f(r)}}},yAxis:{crosshair:h?r:null,className:l?g.axisCrosshair:g.axisGrab,events:{afterSetExtremes:function(r){"zoom"!==r.trigger&&"navigator"!==r.trigger||u(),f(r)}}},plotOptions:{series:{cursor:p||!l?"grab":"crosshair"}}})}}),[l,u,h])};export{l as useChartModifier};
|
|
2
2
|
//# sourceMappingURL=useChartModifier.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useChartModifier.js","sources":["../../../../src/components/Chart/effects/useChartModifier.js"],"sourcesContent":["import { makeStyles } from '@material-ui/core';\nimport { isEmpty } from 'lodash';\nimport { useEffect } from 'react';\n\nimport { updateAxisStyles } from '../formations';\n\n// [HIGHCHARTS-10-MIGRATION-TAG]: Find and delete/clean all places like this once the migration to v10 ends\n// Helper function to get chart configuration based on Highcharts version\n// This ensures compatibility with both Highcharts v8 and v10\nconst getChartVersionSpecificConfig = (chartOptions, isZoomEnabled, isMinHeightChart) => {\n const isV10 = window.Highcharts
|
|
1
|
+
{"version":3,"file":"useChartModifier.js","sources":["../../../../src/components/Chart/effects/useChartModifier.js"],"sourcesContent":["import { makeStyles } from '@material-ui/core';\nimport { isEmpty } from 'lodash';\nimport { useEffect } from 'react';\n\nimport { updateAxisStyles } from '../formations';\n\n// [HIGHCHARTS-10-MIGRATION-TAG]: Find and delete/clean all places like this once the migration to v10 ends\n// Helper function to get chart configuration based on Highcharts version\n// This ensures compatibility with both Highcharts v8 and v10\nconst getChartVersionSpecificConfig = (chartOptions, isZoomEnabled, isMinHeightChart) => {\n const isV10 = window.Highcharts?.version?.startsWith('10');\n\n if (isV10) {\n // Highcharts v10 format\n return {\n zooming: {\n type: isMinHeightChart || !isZoomEnabled ? 'none' : chartOptions.zoomType,\n panning: {\n enabled: !isZoomEnabled,\n type: chartOptions.panning?.type || 'xy',\n },\n panKey: '',\n },\n };\n } else {\n // Highcharts v8 format (backward compatibility)\n return {\n zoomType: isMinHeightChart || !isZoomEnabled ? 'none' : chartOptions.zoomType,\n };\n }\n};\n\nconst useStyles = makeStyles({\n axisGrab: {\n cursor: 'grab',\n },\n axisCrosshair: {\n cursor: 'crosshair',\n },\n});\n\nexport const useChartModifier = ({\n chart,\n chartOptions,\n isZoomEnabled,\n isMinHeightChart,\n handleChartSelection,\n onZoomChangeCallback,\n isAxesCoordinatesShown,\n}) => {\n const classes = useStyles();\n\n useEffect(() => {\n if (isEmpty(chart)) {\n return;\n }\n\n const crosshairConfig = {\n zIndex: 1,\n color: '#ffffff',\n dashStyle: 'dash',\n };\n // eslint-disable-next-line no-param-reassign\n chart.plotBackground.element.style.cursor =\n isMinHeightChart || !isZoomEnabled ? 'grab' : 'crosshair';\n\n chart.series.forEach(seriesItem =>\n seriesItem?.group?.css({\n cursor: isMinHeightChart || !isZoomEnabled ? 'grab' : 'crosshair',\n })\n );\n\n chart.update({\n chart: {\n ...chartOptions,\n plotBackgroundColor: 'transparent',\n ...getChartVersionSpecificConfig(chartOptions, isZoomEnabled, isMinHeightChart),\n },\n xAxis: {\n crosshair: isAxesCoordinatesShown ? crosshairConfig : null,\n className: isZoomEnabled ? classes.axisCrosshair : classes.axisGrab,\n events: {\n afterSetExtremes(e) {\n if (e.trigger === 'zoom' || e.trigger === 'navigator') {\n handleChartSelection();\n }\n if (chart.xAxis?.[0].userOptions.plotLines?.length) {\n updateAxisStyles({ chart });\n }\n onZoomChangeCallback(e);\n },\n },\n },\n yAxis: {\n crosshair: isAxesCoordinatesShown ? crosshairConfig : null,\n className: isZoomEnabled ? classes.axisCrosshair : classes.axisGrab,\n events: {\n afterSetExtremes(e) {\n if (e.trigger === 'zoom' || e.trigger === 'navigator') {\n handleChartSelection();\n }\n onZoomChangeCallback(e);\n },\n },\n },\n plotOptions: {\n series: {\n cursor: isMinHeightChart || !isZoomEnabled ? 'grab' : 'crosshair',\n },\n },\n });\n }, [isZoomEnabled, handleChartSelection, isAxesCoordinatesShown]);\n};\n"],"names":["getChartVersionSpecificConfig","chartOptions","isZoomEnabled","isMinHeightChart","_window$Highcharts","_window$Highcharts$ve","_chartOptions$panning","window","Highcharts","version","startsWith","zooming","type","zoomType","panning","enabled","panKey","useStyles","makeStyles","axisGrab","cursor","axisCrosshair","useChartModifier","_ref","chart","handleChartSelection","onZoomChangeCallback","isAxesCoordinatesShown","classes","useEffect","isEmpty","crosshairConfig","zIndex","color","dashStyle","plotBackground","element","style","series","forEach","seriesItem","_seriesItem$group","group","css","update","plotBackgroundColor","xAxis","crosshair","className","events","afterSetExtremes","e","_chart$xAxis","_chart$xAxis$0$userOp","trigger","userOptions","plotLines","length","updateAxisStyles","yAxis","plotOptions"],"mappings":"0xBASA,IAAMA,EAAgC,SAACC,EAAcC,EAAeC,GAAqB,IAAAC,EAAAC,EAG5EC,EAAX,OAF+B,QAApBF,EAAGG,OAAOC,kBAAU,IAAAJ,GAAjB,QAAiBC,EAAjBD,EAAmBK,eAAnB,IAAAJ,OAAiB,EAAjBA,EAA4BK,WAAW,OAI5C,CACLC,QAAS,CACPC,KAAMT,IAAqBD,EAAgB,OAASD,EAAaY,SACjEC,QAAS,CACPC,SAAUb,EACVU,MAAM,UAAAX,EAAaa,eAAb,IAAAR,OAAA,EAAAA,EAAsBM,OAAQ,MAEtCI,OAAQ,KAKL,CACLH,SAAUV,IAAqBD,EAAgB,OAASD,EAAaY,SAG3E,EAEMI,EAAYC,EAAW,CAC3BC,SAAU,CACRC,OAAQ,QAEVC,cAAe,CACbD,OAAQ,eAICE,EAAmB,SAQ1BC,GAAA,IAPJC,IAAAA,MACAvB,IAAAA,aACAC,IAAAA,cACAC,IAAAA,iBACAsB,IAAAA,qBACAC,IAAAA,qBACAC,IAAAA,uBAEMC,EAAUX,IAEhBY,GAAU,WACR,IAAIC,EAAQN,GAAZ,CAIA,IAAMO,EAAkB,CACtBC,OAAQ,EACRC,MAAO,UACPC,UAAW,QAGbV,EAAMW,eAAeC,QAAQC,MAAMjB,OACjCjB,IAAqBD,EAAgB,OAAS,YAEhDsB,EAAMc,OAAOC,SAAQ,SAAAC,GAAU,IAAAC,EAAA,OAC7BD,SAAiB,QAAjBA,EAAAA,EAAYE,aAAK,IAAAD,OAAjBD,EAAAC,EAAmBE,IAAI,CACrBvB,OAAQjB,IAAqBD,EAAgB,OAAS,iBAI1DsB,EAAMoB,OAAO,CACXpB,aACKvB,GAAY,CAAA,EAAA,CACf4C,oBAAqB,eAClB7C,EAA8BC,EAAcC,EAAeC,IAEhE2C,MAAO,CACLC,UAAWpB,EAAyBI,EAAkB,KACtDiB,UAAW9C,EAAgB0B,EAAQP,cAAgBO,EAAQT,SAC3D8B,OAAQ,CACNC,iBAAgB,SAACC,GAAG,IAAAC,EAAAC,EACA,SAAdF,EAAEG,SAAoC,cAAdH,EAAEG,SAC5B7B,IAEa,QAAf2B,EAAI5B,EAAMsB,aAAK,IAAAM,GAAX,QAAWC,EAAXD,EAAc,GAAGG,YAAYC,iBAA7B,IAAAH,GAAAA,EAAwCI,QAC1CC,EAAiB,CAAElC,MAAAA,IAErBE,EAAqByB,EACvB,IAGJQ,MAAO,CACLZ,UAAWpB,EAAyBI,EAAkB,KACtDiB,UAAW9C,EAAgB0B,EAAQP,cAAgBO,EAAQT,SAC3D8B,OAAQ,CACNC,iBAAgB,SAACC,GACG,SAAdA,EAAEG,SAAoC,cAAdH,EAAEG,SAC5B7B,IAEFC,EAAqByB,EACvB,IAGJS,YAAa,CACXtB,OAAQ,CACNlB,OAAQjB,IAAqBD,EAAgB,OAAS,eApD5D,CAwDD,GAAE,CAACA,EAAeuB,EAAsBE,GAC3C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSignedURL.d.ts","sourceRoot":"","sources":["../../src/effects/useSignedURL.js"],"names":[],"mappings":";AAIA,
|
|
1
|
+
{"version":3,"file":"useSignedURL.d.ts","sourceRoot":"","sources":["../../src/effects/useSignedURL.js"],"names":[],"mappings":";AAIA,kFAiBC"}
|
package/effects/useSignedURL.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import r from"@babel/runtime/helpers/slicedToArray";import{useState as t,useEffect as n}from"react";import{getS3DownloadLink as
|
|
1
|
+
import r from"@babel/runtime/helpers/slicedToArray";import{useState as t,useEffect as n}from"react";import{getS3DownloadLink as o}from"../clients/jsonApi/index.js";function e(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"attachment",c=t(""),a=r(c,2),f=a[0],l=a[1];return n((function(){e&&o(e,i).then((function(r){l(r.url)})).catch((function(r){console.error(r),l("")}))}),[e,i]),f}export{e as default};
|
|
2
2
|
//# sourceMappingURL=useSignedURL.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSignedURL.js","sources":["../../src/effects/useSignedURL.js"],"sourcesContent":["import { useState, useEffect } from 'react';\n\nimport { getS3DownloadLink } from '~/clients/jsonApi';\n\nfunction useSignedURL(fileName) {\n const [signedURL, setSignedURL] = useState('');\n\n useEffect(() => {\n if (fileName)\n getS3DownloadLink(fileName)\n .then(response => setSignedURL(response.url))\n .catch(
|
|
1
|
+
{"version":3,"file":"useSignedURL.js","sources":["../../src/effects/useSignedURL.js"],"sourcesContent":["import { useState, useEffect } from 'react';\n\nimport { getS3DownloadLink } from '~/clients/jsonApi';\n\nfunction useSignedURL(fileName, contentDisposition = 'attachment') {\n const [signedURL, setSignedURL] = useState('');\n\n useEffect(() => {\n if (fileName) {\n getS3DownloadLink(fileName, contentDisposition)\n .then(response => {\n setSignedURL(response.url);\n })\n .catch(error => {\n console.error(error);\n setSignedURL('');\n });\n }\n }, [fileName, contentDisposition]);\n\n return signedURL;\n}\n\nexport default useSignedURL;\n"],"names":["useSignedURL","fileName","contentDisposition","useState","_useState2","_slicedToArray","_useState","signedURL","setSignedURL","useEffect","getS3DownloadLink","then","response","url","catch","error","console"],"mappings":"oKAIA,SAASA,EAAaC,GAA6C,IAAnCC,yDAAqB,aACjBC,EAAAA,EAAS,IAAGC,EAAAC,EAAAC,EAAA,GAAvCC,EAASH,EAAA,GAAEI,EAAYJ,EAAA,GAe9B,OAbAK,GAAU,WACJR,GACFS,EAAkBT,EAAUC,GACzBS,MAAK,SAAAC,GACJJ,EAAaI,EAASC,IACxB,IACCC,OAAM,SAAAC,GACLC,QAAQD,MAAMA,GACdP,EAAa,GACf,GAEN,GAAG,CAACP,EAAUC,IAEPK,CACT"}
|