@corva/ui 3.1.0-rc.4 → 3.1.0-rc.5

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Map/index.js

@@ -1 +1,71 @@
-import e from"@babel/runtime/helpers/slicedToArray";import{memo as o,useMemo as r}from"react";import l from"prop-types";import{makeStyles as s}from"@material-ui/core";import i from"./FormationsLegend.js";import t from"./popupGenerator.js";import{getAllFormations as a}from"./utils.js";import n from"./Map.js";import{jsxs as p,jsx as f}from"react/jsx-runtime";var d=s({mapContainerHidden:{marginTop:"20px",display:"none"}});function m(o){var l=o.open,s=o.subjectWell,m=o.wells,u=o.offsetWells,c=o.radius,W=o.mapHidden,b=o.isMobile,j=o.onAddOffsetWell,O=o.onDeleteOffsetWell,q=d(),R=r((function(){return a(m)}),[m]),h=e(R,2),y=h[0],H=h[1];return p("div",{className:W&&q.mapContainerHidden,children:[f(n,{open:l,subjectWell:s,wells:m,offsetWells:u,radius:c,formationColors:H,popUpFormatter:t(),coordsDataPath:"topHole.coordinates",onAddOffsetWell:j,onDeleteOffsetWell:O}),!b&&f(i,{formations:y,formationColors:H})]})}m.propTypes={open:l.bool.isRequired,subjectWell:l.shape({}),wells:l.arrayOf(l.shape({})).isRequired,offsetWells:l.arrayOf(l.shape({})).isRequired,radius:l.number,mapHidden:l.bool.isRequired,isMobile:l.bool.isRequired,onAddOffsetWell:l.func.isRequired,onDeleteOffsetWell:l.func.isRequired},m.defaultProps={subjectWell:null,radius:null};var u=o(m);export{u as default};
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { memo, useMemo } from 'react';
+import PropTypes from 'prop-types';
+import { makeStyles } from '@material-ui/core';
+import FormationsLegend from './FormationsLegend.js';
+import popupGenerator from './popupGenerator.js';
+import { getAllFormations } from './utils.js';
+import Map from './Map.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var useStyles = makeStyles({
+  mapContainerHidden: {
+    marginTop: '20px',
+    display: 'none'
+  }
+});
+function MapContainer(_ref) {
+  var open = _ref.open,
+    subjectWell = _ref.subjectWell,
+    wells = _ref.wells,
+    offsetWells = _ref.offsetWells,
+    radius = _ref.radius,
+    mapHidden = _ref.mapHidden,
+    isMobile = _ref.isMobile,
+    onAddOffsetWell = _ref.onAddOffsetWell,
+    onDeleteOffsetWell = _ref.onDeleteOffsetWell;
+  var classes = useStyles();
+  var _useMemo = useMemo(function () {
+      return getAllFormations(wells);
+    }, [wells]),
+    _useMemo2 = _slicedToArray(_useMemo, 2),
+    formations = _useMemo2[0],
+    formationColors = _useMemo2[1];
+  return /*#__PURE__*/jsxs("div", {
+    className: mapHidden && classes.mapContainerHidden,
+    children: [/*#__PURE__*/jsx(Map, {
+      open: open,
+      subjectWell: subjectWell,
+      wells: wells,
+      offsetWells: offsetWells,
+      radius: radius,
+      formationColors: formationColors,
+      popUpFormatter: popupGenerator(),
+      coordsDataPath: "topHole.coordinates",
+      onAddOffsetWell: onAddOffsetWell,
+      onDeleteOffsetWell: onDeleteOffsetWell
+    }), !isMobile && /*#__PURE__*/jsx(FormationsLegend, {
+      formations: formations,
+      formationColors: formationColors
+    })]
+  });
+}
+MapContainer.propTypes = {
+  open: PropTypes.bool.isRequired,
+  subjectWell: PropTypes.shape({}),
+  wells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
+  offsetWells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
+  radius: PropTypes.number,
+  mapHidden: PropTypes.bool.isRequired,
+  isMobile: PropTypes.bool.isRequired,
+  onAddOffsetWell: PropTypes.func.isRequired,
+  onDeleteOffsetWell: PropTypes.func.isRequired
+};
+MapContainer.defaultProps = {
+  subjectWell: null,
+  radius: null
+};
+var WellsMap = memo(MapContainer);
+
+export { WellsMap as default };
+//# sourceMappingURL=index.js.map

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Map/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../../src/components/OffsetWellPickerV3/components/CustomSelectionView/components/Map/index.js"],"sourcesContent":["import { memo, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport { makeStyles } from '@material-ui/core';\n\nimport FormationsLegend from './FormationsLegend';\nimport popupGenerator from './popupGenerator';\nimport { getAllFormations } from './utils';\nimport Map from './Map';\n\nconst useStyles = makeStyles({\n  mapContainerHidden: {\n    marginTop: '20px',\n    display: 'none',\n  },\n});\n\nfunction MapContainer({\n  open,\n  subjectWell,\n  wells,\n  offsetWells,\n  radius,\n  mapHidden,\n  isMobile,\n  onAddOffsetWell,\n  onDeleteOffsetWell,\n}) {\n  const classes = useStyles();\n\n  const [formations, formationColors] = useMemo(() => getAllFormations(wells), [wells]);\n\n  return (\n    <div className={mapHidden && classes.mapContainerHidden}>\n      <Map\n        open={open}\n        subjectWell={subjectWell}\n        wells={wells}\n        offsetWells={offsetWells}\n        radius={radius}\n        formationColors={formationColors}\n        popUpFormatter={popupGenerator()}\n        coordsDataPath=\"topHole.coordinates\"\n        onAddOffsetWell={onAddOffsetWell}\n        onDeleteOffsetWell={onDeleteOffsetWell}\n      />\n      {!isMobile && <FormationsLegend formations={formations} formationColors={formationColors} />}\n    </div>\n  );\n}\n\nMapContainer.propTypes = {\n  open: PropTypes.bool.isRequired,\n  subjectWell: PropTypes.shape({}),\n  wells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\n  offsetWells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\n  radius: PropTypes.number,\n  mapHidden: PropTypes.bool.isRequired,\n  isMobile: PropTypes.bool.isRequired,\n  onAddOffsetWell: PropTypes.func.isRequired,\n  onDeleteOffsetWell: PropTypes.func.isRequired,\n};\n\nMapContainer.defaultProps = {\n  subjectWell: null,\n  radius: null,\n};\n\nexport default memo(MapContainer);\n"],"names":["useStyles","makeStyles","mapContainerHidden","marginTop","display","MapContainer","open","subjectWell","wells","offsetWells","radius","mapHidden","isMobile","onAddOffsetWell","onDeleteOffsetWell","classes","useMemo","getAllFormations","formations","formationColors","_jsxs","_jsx","popupGenerator","propTypes","PropTypes","bool","isRequired","shape","arrayOf","number","func","defaultProps","memo"],"mappings":"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"}

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Table/AutoCompleteAssetSearch/AssetResultSection.js

@@ -1 +1,195 @@
-import e from"@babel/runtime/helpers/slicedToArray";import{useRef as t,useState as o,useEffect as r}from"react";import i from"prop-types";import{get as a,isEmpty as s}from"lodash";import{makeStyles as n,List as l,ListItem as c,ListItemText as d,Typography as p}from"@material-ui/core";import{jsxs as u,jsx as m}from"react/jsx-runtime";var g=n((function(e){return{assetListWrapper:{height:"calc(100% - 110px)",margin:"8px 0 4px",flex:1},assetListContainer:{maxHeight:function(e){var t=e.isTablet,o=e.isMobile;return t||!o?"350px":"100% "},backgroundColor:e.palette.background.paper,position:"relative",overflowY:"auto",overFlowX:"hidden"},listSection:{backgroundColor:"inherit"},ul:{backgroundColor:"inherit",padding:0},listGutters:{padding:"2px 8px"},assetTypeSubheaderChip:{height:"24px",color:e.palette.primary.text6},assetItemTextRoot:{minWidth:"300px"},assetItemTextPrimary:{overflow:"hidden",whiteSpace:"nowrap",textOverflow:"ellipsis"},loadingInfo:{textAlign:"center",fontSize:"12px",lineHeight:"17px",color:e.palette.primary.text8},empty:{color:e.palette.primary.text6,fontSize:"12px",fontStyle:"italic",marginLeft:"8px"},topShadow:{top:function(e){return e.isMobile?"170px":"111px"},width:"100%",height:"16px",backgroundImage:"linear-gradient(0deg, rgba(65, 65, 65, 0) 0%, ".concat(e.palette.background.b9," 100%)"),position:"absolute",zIndex:2},bottomShadow:{width:"100%",height:"15px",backgroundImage:"linear-gradient(180deg, rgba(65, 65, 65, 0) 0%, ".concat(e.palette.background.b9," 100%)"),position:"absolute",bottom:"16px",zIndex:2}}})),h=function(i){var n=i.page,h=i.loading,b=i.groupedAssets,f=i.onClickAsset,x=i.onScrollReached,y=i.isTablet,S=i.isMobile,v=g({isTablet:y,isMobile:S}),T=t(null),R=o("top"),w=e(R,2),I=w[0],k=w[1];r((function(){h||("top"===I&&T.current.scrollTo(0,5),"bottom"===I&&T.current.scrollTo(0,T.current.scrollHeight-T.current.offsetHeight-5))}),[h]);return u("div",{className:v.assetListWrapper,children:[m("div",{className:v.topShadow,children:" "}),u(l,{className:v.assetListContainer,subheader:m("li",{}),onScroll:function(t){if(t.target.scrollHeight!==t.target.offsetHeight){var o=t.target.scrollTop+t.target.offsetHeight;Math.abs(t.target.scrollHeight-o)<1&&b.find((function(t){var o=e(t,2);return o[0],40===o[1].length}))&&(k("top"),x("bottom")),0===Math.round(t.target.scrollTop)&&n>1&&(k("bottom"),x("top"))}},ref:T,children:[b.map((function(t){var o=e(t,2),r=o[0],i=o[1];return m("li",{className:v.listSection,children:m("ul",{className:v.ul,children:i.map((function(e){return m(c,{"data-testid":"".concat("AssetResultSection","_item_").concat(e.name,"MenuItem"),button:!0,classes:{gutters:v.listGutters},disabled:!e.redirectAssetId,onClick:function(){return f(e)},children:m(d,{primary:e.name,classes:{root:v.assetItemTextRoot,primary:v.assetItemTextPrimary}})},"item-".concat(r,"-").concat(a(e,"asset_id")?a(e,"asset_id"):a(e,"id")))}))})},"section-".concat(r))})),!h&&s(b)&&m("div",{className:v.empty,children:"Your search did not match any Asset Name"})]}),h&&m(p,{"data-testid":"".concat("AssetResultSection","_loading"),className:v.loadingInfo,children:"Loading..."}),m("div",{className:v.bottomShadow,children:" "})]})};h.propTypes={page:i.number.isRequired,loading:i.bool.isRequired,groupedAssets:i.arrayOf([]).isRequired,onClickAsset:i.func.isRequired,onScrollReached:i.func.isRequired,isTablet:i.bool.isRequired,isMobile:i.bool.isRequired};export{h as default};
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { useRef, useState, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { get, isEmpty } from 'lodash';
+import { makeStyles, List, ListItem, ListItemText, Typography } from '@material-ui/core';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var PAGE_NAME = 'AssetResultSection';
+var useStyles = makeStyles(function (theme) {
+  return {
+    assetListWrapper: {
+      height: 'calc(100% - 110px)',
+      margin: '8px 0 4px',
+      flex: 1
+    },
+    assetListContainer: {
+      maxHeight: function maxHeight(_ref) {
+        var isTablet = _ref.isTablet,
+          isMobile = _ref.isMobile;
+        return isTablet || !isMobile ? '350px' : '100% ';
+      },
+      backgroundColor: theme.palette.background.paper,
+      position: 'relative',
+      overflowY: 'auto',
+      overFlowX: 'hidden'
+    },
+    listSection: {
+      backgroundColor: 'inherit'
+    },
+    ul: {
+      backgroundColor: 'inherit',
+      padding: 0
+    },
+    listGutters: {
+      padding: '2px 8px'
+    },
+    assetTypeSubheaderChip: {
+      height: '24px',
+      color: theme.palette.primary.text6
+    },
+    assetItemTextRoot: {
+      minWidth: '300px'
+    },
+    assetItemTextPrimary: {
+      overflow: 'hidden',
+      whiteSpace: 'nowrap',
+      textOverflow: 'ellipsis'
+    },
+    loadingInfo: {
+      textAlign: 'center',
+      fontSize: '12px',
+      lineHeight: '17px',
+      color: theme.palette.primary.text8
+    },
+    empty: {
+      color: theme.palette.primary.text6,
+      fontSize: '12px',
+      fontStyle: 'italic',
+      marginLeft: '8px'
+    },
+    topShadow: {
+      top: function top(_ref2) {
+        var isMobile = _ref2.isMobile;
+        return isMobile ? '170px' : '111px';
+      },
+      width: '100%',
+      height: '16px',
+      backgroundImage: "linear-gradient(0deg, rgba(65, 65, 65, 0) 0%, ".concat(theme.palette.background.b9, " 100%)"),
+      position: 'absolute',
+      zIndex: 2
+    },
+    bottomShadow: {
+      width: '100%',
+      height: '15px',
+      backgroundImage: "linear-gradient(180deg, rgba(65, 65, 65, 0) 0%, ".concat(theme.palette.background.b9, " 100%)"),
+      position: 'absolute',
+      bottom: '16px',
+      zIndex: 2
+    }
+  };
+});
+var isLastPage = function isLastPage(data) {
+  return !data.find(function (_ref3) {
+    var _ref4 = _slicedToArray(_ref3, 2);
+      _ref4[0];
+      var value = _ref4[1];
+    return value.length === 40;
+  });
+};
+var AssetResultSection = function AssetResultSection(_ref5) {
+  var page = _ref5.page,
+    loading = _ref5.loading,
+    groupedAssets = _ref5.groupedAssets,
+    onClickAsset = _ref5.onClickAsset,
+    onScrollReached = _ref5.onScrollReached,
+    isTablet = _ref5.isTablet,
+    isMobile = _ref5.isMobile;
+  var classes = useStyles({
+    isTablet: isTablet,
+    isMobile: isMobile
+  });
+  var listRef = useRef(null);
+  var _useState = useState('top'),
+    _useState2 = _slicedToArray(_useState, 2),
+    scrollPosition = _useState2[0],
+    setScrollPosition = _useState2[1];
+  useEffect(function () {
+    if (loading) return;
+    if (scrollPosition === 'top') {
+      listRef.current.scrollTo(0, 5);
+    }
+    if (scrollPosition === 'bottom') {
+      listRef.current.scrollTo(0, listRef.current.scrollHeight - listRef.current.offsetHeight - 5);
+    }
+  }, [loading]);
+  var handleScrollList = function handleScrollList(e) {
+    if (e.target.scrollHeight === e.target.offsetHeight) return;
+    var currentScrollBottom = e.target.scrollTop + e.target.offsetHeight;
+
+    // NOTE: if scroll is near 1px from the bottom, then load new data.
+    if (Math.abs(e.target.scrollHeight - currentScrollBottom) < 1 && !isLastPage(groupedAssets)) {
+      setScrollPosition('top');
+      onScrollReached('bottom');
+    }
+    if (Math.round(e.target.scrollTop) === 0 && page > 1) {
+      setScrollPosition('bottom');
+      onScrollReached('top');
+    }
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: classes.assetListWrapper,
+    children: [/*#__PURE__*/jsx("div", {
+      className: classes.topShadow,
+      children: " "
+    }), /*#__PURE__*/jsxs(List, {
+      className: classes.assetListContainer,
+      subheader: /*#__PURE__*/jsx("li", {}),
+      onScroll: handleScrollList,
+      ref: listRef,
+      children: [groupedAssets.map(function (_ref6) {
+        var _ref7 = _slicedToArray(_ref6, 2),
+          assetTypeKey = _ref7[0],
+          asstes = _ref7[1];
+        return /*#__PURE__*/jsx("li", {
+          className: classes.listSection,
+          children: /*#__PURE__*/jsx("ul", {
+            className: classes.ul,
+            children: asstes.map(function (asset) {
+              return /*#__PURE__*/jsx(ListItem, {
+                "data-testid": "".concat(PAGE_NAME, "_item_").concat(asset.name, "MenuItem"),
+                button: true,
+                classes: {
+                  gutters: classes.listGutters
+                },
+                disabled: !asset.redirectAssetId,
+                onClick: function onClick() {
+                  return onClickAsset(asset);
+                },
+                children: /*#__PURE__*/jsx(ListItemText, {
+                  primary: asset.name,
+                  classes: {
+                    root: classes.assetItemTextRoot,
+                    primary: classes.assetItemTextPrimary
+                  }
+                })
+              }, "item-".concat(assetTypeKey, "-").concat(get(asset, 'asset_id') ? get(asset, 'asset_id') : get(asset, 'id')));
+            })
+          })
+        }, "section-".concat(assetTypeKey));
+      }), !loading && isEmpty(groupedAssets) && /*#__PURE__*/jsx("div", {
+        className: classes.empty,
+        children: "Your search did not match any Asset Name"
+      })]
+    }), loading && /*#__PURE__*/jsx(Typography, {
+      "data-testid": "".concat(PAGE_NAME, "_loading"),
+      className: classes.loadingInfo,
+      children: "Loading..."
+    }), /*#__PURE__*/jsx("div", {
+      className: classes.bottomShadow,
+      children: " "
+    })]
+  });
+};
+AssetResultSection.propTypes = {
+  page: PropTypes.number.isRequired,
+  loading: PropTypes.bool.isRequired,
+  groupedAssets: PropTypes.arrayOf([]).isRequired,
+  onClickAsset: PropTypes.func.isRequired,
+  onScrollReached: PropTypes.func.isRequired,
+  isTablet: PropTypes.bool.isRequired,
+  isMobile: PropTypes.bool.isRequired
+};
+
+export { AssetResultSection as default };
+//# sourceMappingURL=AssetResultSection.js.map

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Table/AutoCompleteAssetSearch/AssetResultSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssetResultSection.js","sources":["../../../../../../../../src/components/OffsetWellPickerV3/components/CustomSelectionView/components/Table/AutoCompleteAssetSearch/AssetResultSection.js"],"sourcesContent":["import { useRef, useEffect, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { get, isEmpty } from 'lodash';\nimport { makeStyles, List, ListItem, ListItemText, Typography } from '@material-ui/core';\n\nconst PAGE_NAME = 'AssetResultSection';\nconst useStyles = makeStyles(theme => ({\n  assetListWrapper: {\n    height: 'calc(100% - 110px)',\n    margin: '8px 0 4px',\n    flex: 1,\n  },\n  assetListContainer: {\n    maxHeight: ({ isTablet, isMobile }) => (isTablet || !isMobile ? '350px' : '100% '),\n    backgroundColor: theme.palette.background.paper,\n    position: 'relative',\n    overflowY: 'auto',\n    overFlowX: 'hidden',\n  },\n  listSection: {\n    backgroundColor: 'inherit',\n  },\n  ul: {\n    backgroundColor: 'inherit',\n    padding: 0,\n  },\n  listGutters: {\n    padding: '2px 8px',\n  },\n  assetTypeSubheaderChip: {\n    height: '24px',\n    color: theme.palette.primary.text6,\n  },\n  assetItemTextRoot: {\n    minWidth: '300px',\n  },\n  assetItemTextPrimary: {\n    overflow: 'hidden',\n    whiteSpace: 'nowrap',\n    textOverflow: 'ellipsis',\n  },\n  loadingInfo: {\n    textAlign: 'center',\n    fontSize: '12px',\n    lineHeight: '17px',\n    color: theme.palette.primary.text8,\n  },\n  empty: {\n    color: theme.palette.primary.text6,\n    fontSize: '12px',\n    fontStyle: 'italic',\n    marginLeft: '8px',\n  },\n  topShadow: {\n    top: ({ isMobile }) => (isMobile ? '170px' : '111px'),\n    width: '100%',\n    height: '16px',\n    backgroundImage: `linear-gradient(0deg, rgba(65, 65, 65, 0) 0%, ${theme.palette.background.b9} 100%)`,\n    position: 'absolute',\n    zIndex: 2,\n  },\n  bottomShadow: {\n    width: '100%',\n    height: '15px',\n    backgroundImage: `linear-gradient(180deg, rgba(65, 65, 65, 0) 0%, ${theme.palette.background.b9} 100%)`,\n    position: 'absolute',\n    bottom: '16px',\n    zIndex: 2,\n  },\n}));\n\nconst isLastPage = data => {\n  return !data.find(([_, value]) => value.length === 40);\n};\n\nconst AssetResultSection = ({\n  page,\n  loading,\n  groupedAssets,\n  onClickAsset,\n  onScrollReached,\n  isTablet,\n  isMobile,\n}) => {\n  const classes = useStyles({ isTablet, isMobile });\n  const listRef = useRef(null);\n  const [scrollPosition, setScrollPosition] = useState('top');\n\n  useEffect(() => {\n    if (loading) return;\n    if (scrollPosition === 'top') {\n      listRef.current.scrollTo(0, 5);\n    }\n    if (scrollPosition === 'bottom') {\n      listRef.current.scrollTo(0, listRef.current.scrollHeight - listRef.current.offsetHeight - 5);\n    }\n  }, [loading]);\n\n  const handleScrollList = e => {\n    if (e.target.scrollHeight === e.target.offsetHeight) return;\n    const currentScrollBottom = e.target.scrollTop + e.target.offsetHeight;\n\n    // NOTE: if scroll is near 1px from the bottom, then load new data.\n    if (Math.abs(e.target.scrollHeight - currentScrollBottom) < 1 && !isLastPage(groupedAssets)) {\n      setScrollPosition('top');\n      onScrollReached('bottom');\n    }\n    if (Math.round(e.target.scrollTop) === 0 && page > 1) {\n      setScrollPosition('bottom');\n      onScrollReached('top');\n    }\n  };\n  return (\n    <div className={classes.assetListWrapper}>\n      <div className={classes.topShadow}> </div>\n      <List\n        className={classes.assetListContainer}\n        subheader={<li />}\n        onScroll={handleScrollList}\n        ref={listRef}\n      >\n        {groupedAssets.map(([assetTypeKey, asstes]) => (\n          <li key={`section-${assetTypeKey}`} className={classes.listSection}>\n            <ul className={classes.ul}>\n              {asstes.map(asset => (\n                <ListItem\n                  data-testid={`${PAGE_NAME}_item_${asset.name}MenuItem`}\n                  button\n                  classes={{ gutters: classes.listGutters }}\n                  disabled={!asset.redirectAssetId}\n                  key={`item-${assetTypeKey}-${\n                    get(asset, 'asset_id') ? get(asset, 'asset_id') : get(asset, 'id')\n                  }`}\n                  onClick={() => onClickAsset(asset)}\n                >\n                  <ListItemText\n                    primary={asset.name}\n                    classes={{\n                      root: classes.assetItemTextRoot,\n                      primary: classes.assetItemTextPrimary,\n                    }}\n                  />\n                </ListItem>\n              ))}\n            </ul>\n          </li>\n        ))}\n        {!loading && isEmpty(groupedAssets) && (\n          <div className={classes.empty}>Your search did not match any Asset Name</div>\n        )}\n      </List>\n      {loading && (\n        <Typography data-testid={`${PAGE_NAME}_loading`} className={classes.loadingInfo}>\n          Loading...\n        </Typography>\n      )}\n      <div className={classes.bottomShadow}> </div>\n    </div>\n  );\n};\n\nAssetResultSection.propTypes = {\n  page: PropTypes.number.isRequired,\n  loading: PropTypes.bool.isRequired,\n  groupedAssets: PropTypes.arrayOf([]).isRequired,\n  onClickAsset: PropTypes.func.isRequired,\n  onScrollReached: PropTypes.func.isRequired,\n  isTablet: PropTypes.bool.isRequired,\n  isMobile: PropTypes.bool.isRequired,\n};\n\nexport default AssetResultSection;\n"],"names":["PAGE_NAME","useStyles","makeStyles","theme","assetListWrapper","height","margin","flex","assetListContainer","maxHeight","isTablet","isMobile","backgroundColor","palette","background","paper","position","overflowY","overFlowX","listSection","ul","padding","listGutters","assetTypeSubheaderChip","color","primary","text6","assetItemTextRoot","minWidth","assetItemTextPrimary","overflow","whiteSpace","textOverflow","loadingInfo","textAlign","fontSize","lineHeight","text8","empty","fontStyle","marginLeft","topShadow","top","width","backgroundImage","b9","zIndex","bottomShadow","bottom","isLastPage","data","find","value","length","AssetResultSection","page","loading","groupedAssets","onClickAsset","onScrollReached","classes","listRef","useRef","useState","scrollPosition","setScrollPosition","useEffect","current","scrollTo","scrollHeight","offsetHeight","handleScrollList","e","target","currentScrollBottom","scrollTop","Math","abs","round","_jsxs","_jsx","map","assetTypeKey","asstes","asset","name","gutters","redirectAssetId","root","get","isEmpty","propTypes","PropTypes","number","isRequired","bool","arrayOf","func"],"mappings":"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"}

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Table/AutoCompleteAssetSearch/AssetTypesSection.js

@@ -1 +1,58 @@
-import e from"@babel/runtime/helpers/slicedToArray";import r from"prop-types";import{makeStyles as t,Typography as i,Chip as a}from"@material-ui/core";import{CATEGORY_KEY_VALUES as o}from"./constants.js";import{jsxs as p,jsx as l}from"react/jsx-runtime";var s=t({assetSelectorWrapper:{display:"flex",flexWrap:"wrap",gap:"8px"},description:{color:"#BDBDBD",fontSize:"12px",lineHeight:"17px",marginBottom:"8px"},assetTypeChip:{color:"#BDBDBD","&:last-child":{marginRight:"0px"}}}),n=function(r){var t=r.onClickAssetType,n=s();return p("div",{children:[l(i,{className:n.description,children:"I'm looking for..."}),l("div",{className:n.assetSelectorWrapper,children:o.map((function(r){var i=e(r,2),o=i[0],p=i[1];return l(a,{"data-testid":"".concat("AssetTypesSection","_chip_").concat(p.labelPlural),className:n.assetTypeChip,variant:"outlined",label:p.labelPlural,onClick:function(){return t(o)}},o)}))})]})};n.propTypes={onClickAssetType:r.func.isRequired};export{n as default};
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import PropTypes from 'prop-types';
+import { makeStyles, Typography, Chip } from '@material-ui/core';
+import { CATEGORY_KEY_VALUES } from './constants.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var PAGE_NAME = 'AssetTypesSection';
+var useStyles = makeStyles({
+  assetSelectorWrapper: {
+    display: 'flex',
+    flexWrap: 'wrap',
+    gap: '8px'
+  },
+  description: {
+    color: '#BDBDBD',
+    fontSize: '12px',
+    lineHeight: '17px',
+    marginBottom: '8px'
+  },
+  assetTypeChip: {
+    color: '#BDBDBD',
+    '&:last-child': {
+      marginRight: '0px'
+    }
+  }
+});
+var AssetTypesSection = function AssetTypesSection(_ref) {
+  var onClickAssetType = _ref.onClickAssetType;
+  var classes = useStyles();
+  return /*#__PURE__*/jsxs("div", {
+    children: [/*#__PURE__*/jsx(Typography, {
+      className: classes.description,
+      children: "I'm looking for..."
+    }), /*#__PURE__*/jsx("div", {
+      className: classes.assetSelectorWrapper,
+      children: CATEGORY_KEY_VALUES.map(function (_ref2) {
+        var _ref3 = _slicedToArray(_ref2, 2),
+          key = _ref3[0],
+          item = _ref3[1];
+        return /*#__PURE__*/jsx(Chip, {
+          "data-testid": "".concat(PAGE_NAME, "_chip_").concat(item.labelPlural),
+          className: classes.assetTypeChip,
+          variant: "outlined",
+          label: item.labelPlural,
+          onClick: function onClick() {
+            return onClickAssetType(key);
+          }
+        }, key);
+      })
+    })]
+  });
+};
+AssetTypesSection.propTypes = {
+  onClickAssetType: PropTypes.func.isRequired
+};
+
+export { AssetTypesSection as default };
+//# sourceMappingURL=AssetTypesSection.js.map

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Table/AutoCompleteAssetSearch/AssetTypesSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssetTypesSection.js","sources":["../../../../../../../../src/components/OffsetWellPickerV3/components/CustomSelectionView/components/Table/AutoCompleteAssetSearch/AssetTypesSection.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { makeStyles, Typography, Chip } from '@material-ui/core';\n\nimport { CATEGORY_KEY_VALUES } from './constants';\n\nconst PAGE_NAME = 'AssetTypesSection';\n\nconst useStyles = makeStyles({\n  assetSelectorWrapper: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    gap: '8px',\n  },\n  description: {\n    color: '#BDBDBD',\n    fontSize: '12px',\n    lineHeight: '17px',\n    marginBottom: '8px',\n  },\n  assetTypeChip: {\n    color: '#BDBDBD',\n    '&:last-child': {\n      marginRight: '0px',\n    },\n  },\n});\n\nconst AssetTypesSection = ({ onClickAssetType }) => {\n  const classes = useStyles();\n\n  return (\n    <div>\n      <Typography className={classes.description}>I&apos;m looking for...</Typography>\n      <div className={classes.assetSelectorWrapper}>\n        {CATEGORY_KEY_VALUES.map(([key, item]) => (\n          <Chip\n            data-testid={`${PAGE_NAME}_chip_${item.labelPlural}`}\n            key={key}\n            className={classes.assetTypeChip}\n            variant=\"outlined\"\n            label={item.labelPlural}\n            onClick={() => onClickAssetType(key)}\n          />\n        ))}\n      </div>\n    </div>\n  );\n};\n\nAssetTypesSection.propTypes = {\n  onClickAssetType: PropTypes.func.isRequired,\n};\n\nexport default AssetTypesSection;\n"],"names":["PAGE_NAME","useStyles","makeStyles","assetSelectorWrapper","display","flexWrap","gap","description","color","fontSize","lineHeight","marginBottom","assetTypeChip","marginRight","AssetTypesSection","onClickAssetType","classes","_jsxs","_jsx","CATEGORY_KEY_VALUES","map","key","item","labelPlural","propTypes","PropTypes","func","isRequired"],"mappings":";;;;;;AAKA,IAAMA,SAAS,GAAG,mBAAmB,CAAA;AAErC,IAAMC,SAAS,GAAGC,UAAU,CAAC;AAC3BC,EAAAA,oBAAoB,EAAE;AACpBC,IAAAA,OAAO,EAAE,MAAM;AACfC,IAAAA,QAAQ,EAAE,MAAM;AAChBC,IAAAA,GAAG,EAAE,KAAA;GACN;AACDC,EAAAA,WAAW,EAAE;AACXC,IAAAA,KAAK,EAAE,SAAS;AAChBC,IAAAA,QAAQ,EAAE,MAAM;AAChBC,IAAAA,UAAU,EAAE,MAAM;AAClBC,IAAAA,YAAY,EAAE,KAAA;GACf;AACDC,EAAAA,aAAa,EAAE;AACbJ,IAAAA,KAAK,EAAE,SAAS;AAChB,IAAA,cAAc,EAAE;AACdK,MAAAA,WAAW,EAAE,KAAA;AACf,KAAA;AACF,GAAA;AACF,CAAC,CAAC,CAAA;AAEF,IAAMC,iBAAiB,GAAG,SAApBA,iBAAiB,CAA6B,IAAA,EAAA;EAAA,IAAvBC,gBAAgB,QAAhBA,gBAAgB,CAAA;EAC3C,IAAMC,OAAO,GAAGf,SAAS,EAAE,CAAA;EAE3B,oBACEgB,IAAA,CAAA,KAAA,EAAA;AAAA,IAAA,QAAA,EAAA,cACEC,IAAC,UAAU,EAAA;MAAC,SAAS,EAAEF,OAAO,CAACT,WAAY;AAAA,MAAA,QAAA,EAAA,oBAAA;AAAA,KAAA,CAAqC,eAChFW,GAAA,CAAA,KAAA,EAAA;MAAK,SAAS,EAAEF,OAAO,CAACb,oBAAqB;MAAA,QAC1CgB,EAAAA,mBAAmB,CAACC,GAAG,CAAC,UAAA,KAAA,EAAA;AAAA,QAAA,IAAA,KAAA,GAAA,cAAA,CAAA,KAAA,EAAA,CAAA,CAAA;UAAEC,GAAG,GAAA,KAAA,CAAA,CAAA,CAAA;UAAEC,IAAI,GAAA,KAAA,CAAA,CAAA,CAAA,CAAA;AAAA,QAAA,oBAClCJ,IAAC,IAAI,EAAA;AACH,UAAA,aAAA,EAAA,EAAA,CAAA,MAAA,CAAgBlB,SAAS,EAAA,QAAA,CAAA,CAAA,MAAA,CAASsB,IAAI,CAACC,WAAW,CAAG;UAErD,SAAS,EAAEP,OAAO,CAACJ,aAAc;AACjC,UAAA,OAAO,EAAC,UAAU;UAClB,KAAK,EAAEU,IAAI,CAACC,WAAY;AACxB,UAAA,OAAO,EAAE,SAAA,OAAA,GAAA;YAAA,OAAMR,gBAAgB,CAACM,GAAG,CAAC,CAAA;AAAA,WAAA;AAAC,SAAA,EAJhCA,GAAG,CAKR,CAAA;OACH,CAAA;KACG,CAAA,CAAA;GACF,CAAA,CAAA;AAEV,EAAC;AAEDP,iBAAiB,CAACU,SAAS,GAAG;AAC5BT,EAAAA,gBAAgB,EAAEU,SAAS,CAACC,IAAI,CAACC,UAAAA;AACnC,CAAC;;;;"}

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Table/AutoCompleteAssetSearch/AutoCompleteAssetSearch.js

@@ -1 +1,236 @@
-import e from"@babel/runtime/helpers/slicedToArray";import{useState as t,useRef as o}from"react";import r from"prop-types";import{withRouter as i}from"react-router";import n from"lodash/get";import{withStyles as l,Tooltip as a,makeStyles as s,Input as c,Chip as p}from"@material-ui/core";import u from"@material-ui/icons/Close";import d from"./AssetTypesSection.js";import m from"./AssetResultSection.js";import{useAssetsData as f}from"./effects/useAssetsData.js";import{SEARCH_CATEGORIES as h,CATEGORY_KEY_VALUES as x}from"./constants.js";import{jsxs as b,jsx as g}from"react/jsx-runtime";var y=l((function(){return{tooltip:{backgroundColor:"#414141",color:"#ffffff",fontSize:"11px",lineHeight:"16px",borderRadius:"4px",boxShadow:"0px 4px 4px rgba(0, 0, 0, 0.12)",padding:"4px"}}}))(a),C=s((function(e){return{wrapper:{width:function(e){var t=e.isTablet,o=e.isMobile;return!t&&o?"100%":"472px"},height:function(e){var t=e.isTablet,o=e.isMobile;return!t&&o&&"100%"},display:"flex",flexDirection:"column",padding:"12px 16px"},inputWrapper:{display:"flex",width:"auto",marginBottom:"16px",alignItems:"center",flexWrap:"nowrap",justifyContent:"space-between"},selectedChip:{width:"fit-content",marginBottom:"10px",fontSize:"14px"},selectedChipDeleteIcon:{width:"16px",height:"16px",color:e.palette.primary.text6,"&:hover":{color:e.palette.primary.text1}},disabledIcon:{width:"16px",height:"16px",color:e.palette.primary.text6,opacity:.4},closeIconButton:{padding:0,"&:hover $closeIcon":{color:e.palette.primary.text1}},searchInput:{width:"100%",display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",borderBottom:"2px solid #03BCD4"},closeIcon:{color:e.palette.primary.text6,fontSize:"18px"},deleteIcon:{color:e.palette.primary.text1,height:"16px"}}})),v=function(r){var i=r.onClickAsset,l=r.company,a=r.isTablet,s=r.isMobile,v=t(null),I=e(v,2),w=I[0],A=I[1],T=t(null),S=e(T,2),R=S[0],j=S[1],k=t(1),D=e(k,2),M=D[0],B=D[1],q=C({isTablet:a,isMobile:s}),z=o(),N=f(R,w,M,l),W=e(N,2),K=W[0],P=W[1];return b("div",{className:q.wrapper,children:[g("div",{className:q.inputWrapper,children:b("div",{className:q.searchInput,children:[g(c,{"data-testid":"".concat("AutoCompleteAssetSearch","_searchInput"),inputRef:z,autoFocus:!0,disableUnderline:!0,fullWidth:!0,value:R||"",placeholder:"Search ".concat(n(h,[w,"labelPlural"],"assets"),"..."),onChange:function(e){var t=e.target.value;j(t),B(1)},onKeyUp:function(t){var o=t.target.value,r=t.keyCode,i=x.find((function(t){var r=e(t,2);return r[0],r[1].autoCategorizedKey===o.trim().toLowerCase()}));if(i&&(13===r||32===r))return j(""),A(i[0]),void B(1);""===o&&8===r&&(A(null),B(1))}}),g(y,{title:"Clear",children:g(u,{className:w||R?q.selectedChipDeleteIcon:q.disabledIcon,onClick:function(){z.current.focus(),j(""),A(null),B(1)}})})]})}),w&&g(p,{"data-not-migrated-muichip":!0,classes:{root:q.selectedChip,deleteIcon:q.deleteIcon},color:"primary",label:n(h,[w,"labelPlural"],"Assets"),deleteIcon:g(u,{}),onDelete:function(){A(null),B(1)}}),!w&&!R&&g(d,{onClickAssetType:function(e){z.current.focus(),A(e),B(1)}}),(w||R)&&g(m,{loading:K,page:M,groupedAssets:P,onClickAsset:i,onScrollReached:function(e){"top"===e&&M>1&&B((function(e){return e-1})),"bottom"===e&&B((function(e){return e+1}))},isTablet:a,isMobile:s})]})};v.propTypes={company:r.number.isRequired,onClickAsset:r.func.isRequired,isTablet:r.bool.isRequired,isMobile:r.bool.isRequired};var I=i(v);export{I as default};
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { useState, useRef } from 'react';
+import PropTypes from 'prop-types';
+import { withRouter } from 'react-router';
+import get from 'lodash/get';
+import { withStyles, Tooltip, makeStyles, Input, Chip } from '@material-ui/core';
+import CloseIcon from '@material-ui/icons/Close';
+import AssetTypesSection from './AssetTypesSection.js';
+import AssetResultSection from './AssetResultSection.js';
+import { useAssetsData } from './effects/useAssetsData.js';
+import { SEARCH_CATEGORIES, CATEGORY_KEY_VALUES } from './constants.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var PAGE_NAME = 'AutoCompleteAssetSearch';
+var StyledTooltip = withStyles(function () {
+  return {
+    tooltip: {
+      backgroundColor: '#414141',
+      color: '#ffffff',
+      fontSize: '11px',
+      lineHeight: '16px',
+      borderRadius: '4px',
+      boxShadow: '0px 4px 4px rgba(0, 0, 0, 0.12)',
+      padding: '4px'
+    }
+  };
+})(Tooltip);
+var useStyles = makeStyles(function (theme) {
+  return {
+    wrapper: {
+      width: function width(_ref) {
+        var isTablet = _ref.isTablet,
+          isMobile = _ref.isMobile;
+        return !isTablet && isMobile ? '100%' : '472px';
+      },
+      height: function height(_ref2) {
+        var isTablet = _ref2.isTablet,
+          isMobile = _ref2.isMobile;
+        return !isTablet && isMobile && '100%';
+      },
+      display: 'flex',
+      flexDirection: 'column',
+      padding: '12px 16px'
+    },
+    inputWrapper: {
+      display: 'flex',
+      width: 'auto',
+      marginBottom: '16px',
+      alignItems: 'center',
+      flexWrap: 'nowrap',
+      justifyContent: 'space-between'
+    },
+    selectedChip: {
+      width: 'fit-content',
+      marginBottom: '10px',
+      fontSize: '14px'
+    },
+    selectedChipDeleteIcon: {
+      width: '16px',
+      height: '16px',
+      color: theme.palette.primary.text6,
+      '&:hover': {
+        color: theme.palette.primary.text1
+      }
+    },
+    disabledIcon: {
+      width: '16px',
+      height: '16px',
+      color: theme.palette.primary.text6,
+      opacity: 0.4
+    },
+    closeIconButton: {
+      padding: 0,
+      '&:hover $closeIcon': {
+        color: theme.palette.primary.text1
+      }
+    },
+    searchInput: {
+      width: '100%',
+      display: 'flex',
+      flexDirection: 'row',
+      justifyContent: 'space-between',
+      alignItems: 'center',
+      borderBottom: '2px solid #03BCD4'
+    },
+    closeIcon: {
+      color: theme.palette.primary.text6,
+      fontSize: '18px'
+    },
+    deleteIcon: {
+      color: theme.palette.primary.text1,
+      height: '16px'
+    }
+  };
+});
+var AutoCompleteAssetSearch = function AutoCompleteAssetSearch(_ref3) {
+  var onClickAsset = _ref3.onClickAsset,
+    company = _ref3.company,
+    isTablet = _ref3.isTablet,
+    isMobile = _ref3.isMobile;
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    assetType = _useState2[0],
+    setAssetType = _useState2[1];
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    searchKey = _useState4[0],
+    setSearchKey = _useState4[1];
+  var _useState5 = useState(1),
+    _useState6 = _slicedToArray(_useState5, 2),
+    page = _useState6[0],
+    setPage = _useState6[1];
+  var classes = useStyles({
+    isTablet: isTablet,
+    isMobile: isMobile
+  });
+  var searchInputRef = useRef();
+  var _useAssetsData = useAssetsData(searchKey, assetType, page, company),
+    _useAssetsData2 = _slicedToArray(_useAssetsData, 2),
+    loading = _useAssetsData2[0],
+    groupedAssets = _useAssetsData2[1];
+  var handleDeleteAssetType = function handleDeleteAssetType() {
+    setAssetType(null);
+    setPage(1);
+  };
+  var handleChangeAssetType = function handleChangeAssetType(key) {
+    searchInputRef.current.focus();
+    setAssetType(key);
+    setPage(1);
+  };
+  var handleChangeSearchKey = function handleChangeSearchKey(_ref4) {
+    var value = _ref4.target.value;
+    setSearchKey(value);
+    setPage(1);
+  };
+  var handleKeyPress = function handleKeyPress(e) {
+    var value = e.target.value;
+    var keyCode = e.keyCode;
+    var availableCategory = CATEGORY_KEY_VALUES.find(function (_ref5) {
+      var _ref6 = _slicedToArray(_ref5, 2);
+        _ref6[0];
+        var item = _ref6[1];
+      return item.autoCategorizedKey === value.trim().toLowerCase();
+    });
+
+    // NOTE: when type one of categories defined and press enter key or space key
+    // then asset type will be auto selected and clear input field
+    if (availableCategory && (keyCode === 13 || keyCode === 32)) {
+      setSearchKey('');
+      setAssetType(availableCategory[0]);
+      setPage(1);
+      return;
+    }
+
+    // NOTE: when there is no value in input field and press back space key,
+    // then clear asset type as well.
+    if (value === '' && keyCode === 8) {
+      setAssetType(null);
+      setPage(1);
+    }
+  };
+  var handleSearchClear = function handleSearchClear() {
+    searchInputRef.current.focus();
+    setSearchKey('');
+    setAssetType(null);
+    setPage(1);
+  };
+  var handleScrollReached = function handleScrollReached(position) {
+    if (position === 'top' && page > 1) {
+      setPage(function (prev) {
+        return prev - 1;
+      });
+    }
+    if (position === 'bottom') {
+      setPage(function (prev) {
+        return prev + 1;
+      });
+    }
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: classes.wrapper,
+    children: [/*#__PURE__*/jsx("div", {
+      className: classes.inputWrapper,
+      children: /*#__PURE__*/jsxs("div", {
+        className: classes.searchInput,
+        children: [/*#__PURE__*/jsx(Input, {
+          "data-testid": "".concat(PAGE_NAME, "_searchInput"),
+          inputRef: searchInputRef,
+          autoFocus: true,
+          disableUnderline: true,
+          fullWidth: true,
+          value: searchKey || '',
+          placeholder: "Search ".concat(get(SEARCH_CATEGORIES, [assetType, 'labelPlural'], 'assets'), "..."),
+          onChange: handleChangeSearchKey,
+          onKeyUp: handleKeyPress
+        }), /*#__PURE__*/jsx(StyledTooltip, {
+          title: "Clear",
+          children: /*#__PURE__*/jsx(CloseIcon, {
+            className: assetType || searchKey ? classes.selectedChipDeleteIcon : classes.disabledIcon,
+            onClick: handleSearchClear
+          })
+        })]
+      })
+    }), assetType && /*#__PURE__*/jsx(Chip, {
+      "data-not-migrated-muichip": true,
+      classes: {
+        root: classes.selectedChip,
+        deleteIcon: classes.deleteIcon
+      },
+      color: "primary",
+      label: get(SEARCH_CATEGORIES, [assetType, 'labelPlural'], 'Assets'),
+      deleteIcon: /*#__PURE__*/jsx(CloseIcon, {}),
+      onDelete: handleDeleteAssetType
+    }), !assetType && !searchKey && /*#__PURE__*/jsx(AssetTypesSection, {
+      onClickAssetType: handleChangeAssetType
+    }), (assetType || searchKey) && /*#__PURE__*/jsx(AssetResultSection, {
+      loading: loading,
+      page: page,
+      groupedAssets: groupedAssets,
+      onClickAsset: onClickAsset,
+      onScrollReached: handleScrollReached,
+      isTablet: isTablet,
+      isMobile: isMobile
+    })]
+  });
+};
+AutoCompleteAssetSearch.propTypes = {
+  company: PropTypes.number.isRequired,
+  onClickAsset: PropTypes.func.isRequired,
+  isTablet: PropTypes.bool.isRequired,
+  isMobile: PropTypes.bool.isRequired
+};
+var AutoCompleteAssetSearch$1 = withRouter(AutoCompleteAssetSearch);
+
+export { AutoCompleteAssetSearch$1 as default };
+//# sourceMappingURL=AutoCompleteAssetSearch.js.map