\n {data &&\n data.map((it, idx) => (\n onClick(it)}>\n {itemRender ? itemRender(it, isSelected(it)) : displayName(it)}\n
\n ))}\n {children}\n \n )\n}\n\nexport default Sidebar\n\nconst Stepper = ({ step, it, idx, steps }) => {\n const classes = useStyles()\n const active = step === idx\n const past = idx < step\n const future = idx > step\n\n return (\n \n \n {it.label}\n \n {active &&
\n )}\n \n )\n}\n\nexport { Stepper }\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"Symbols\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/warning-icon/tomato\"\n}, /*#__PURE__*/React.createElement(\"rect\", {\n id: \"Rectangle\",\n stroke: \"#FF584A\",\n strokeWidth: 2,\n x: 1,\n y: 1,\n width: 22,\n height: 22,\n rx: 11\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M11.2971429,14.4857143 L11.1085714,5.82857143 L13.3714286,5.82857143 L13.2,14.4857143 L11.2971429,14.4857143 Z M11.1942857,18 L11.1942857,15.9771429 L13.3028571,15.9771429 L13.3028571,18 L11.1942857,18 Z\",\n id: \"!\",\n fill: \"#FF584A\",\n fillRule: \"nonzero\"\n})));\n\nfunction SvgTomato(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"24px\",\n height: \"24px\",\n viewBox: \"0 0 24 24\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgTomato);\nexport default __webpack_public_path__ + \"static/media/tomato.4b561f6f.svg\";\nexport { ForwardRef as ReactComponent };","import { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport React from 'react'\n\nimport styles from './styles'\n\nconst useStyles = makeStyles(styles)\n\nfunction H1({ children, noMargin, className, ...props }) {\n const classes = useStyles()\n const classNames = {\n [classes.h1]: true,\n [classes.noMargin]: noMargin,\n [className]: !!className\n }\n\n return (\n \n {children}\n
\n )\n}\n\nfunction H2({ children, noMargin, className, ...props }) {\n const classes = useStyles()\n const classNames = {\n [classes.h2]: true,\n [classes.noMargin]: noMargin,\n [className]: !!className\n }\n\n return (\n\n {children}\n
\n )\n}\n\nfunction H3({ children, noMargin, className, ...props }) {\n const classes = useStyles()\n const classNames = {\n [classes.h3]: true,\n [classes.noMargin]: noMargin,\n [className]: !!className\n }\n\n return (\n\n {children}\n
\n )\n}\n\nfunction H4({ children, noMargin, className, ...props }) {\n const classes = useStyles()\n const classNames = {\n [classes.h4]: true,\n [classes.noMargin]: noMargin,\n [className]: !!className\n }\n\n return (\n\n {children}\n
\n )\n}\n\nfunction H5({ children, noMargin, className, ...props }) {\n const classes = useStyles()\n const classNames = {\n [classes.h5]: true,\n [classes.noMargin]: noMargin,\n [className]: !!className\n }\n\n return (\n\n {children}\n
\n )\n}\n\nconst P = pBuilder('p')\nconst Info1 = pBuilder('info1')\nconst Info2 = pBuilder('info2')\nconst Info3 = pBuilder('info3')\nconst Mono = pBuilder('mono')\nconst TL1 = pBuilder('tl1')\nconst TL2 = pBuilder('tl2')\nconst Label1 = pBuilder('label1')\nconst Label2 = pBuilder('label2')\nconst Label3 = pBuilder('label3')\n\nfunction pBuilder(elementClass) {\n return ({ inline, noMargin, className, children, ...props }) => {\n const classes = useStyles()\n const classNames = {\n [className]: !!className,\n [classes[elementClass]]: elementClass,\n [classes.inline]: inline,\n [classes.noMargin]: noMargin\n }\n return (\n\n {children}\n
\n )\n }\n}\n\nexport {\n H1,\n H2,\n H3,\n H4,\n H5,\n TL1,\n TL2,\n P,\n Info1,\n Info2,\n Info3,\n Mono,\n Label1,\n Label2,\n Label3\n}\n","import { makeStyles } from '@material-ui/core'\nimport classnames from 'classnames'\nimport React from 'react'\n\nimport { ReactComponent as ErrorIcon } from 'src/styling/icons/warning-icon/tomato.svg'\nimport { errorColor } from 'src/styling/variables'\n\nimport { Info3 } from './typography'\n\nconst styles = {\n wrapper: {\n display: 'flex',\n alignItems: 'center',\n '& > svg': {\n marginRight: 10\n }\n },\n message: {\n display: 'flex',\n alignItems: 'center',\n color: errorColor,\n margin: 0,\n whiteSpace: 'break-spaces'\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst ErrorMessage = ({ className, children, ...props }) => {\n const classes = useStyles()\n\n return (\n\n {children} \n
\n )\n}\n\nexport default ErrorMessage\n","import { makeStyles } from '@material-ui/core/styles'\nimport React, { memo } from 'react'\n\nimport { spacer } from 'src/styling/variables'\n\nimport { H1 } from './typography'\n\nconst useStyles = makeStyles({\n title: {\n marginTop: spacer * 3,\n marginBottom: spacer * 3\n }\n})\n\nconst Title = memo(({ children }) => {\n const classes = useStyles()\n return {children}
\n})\n\nexport default Title\n","import typographyStyles from 'src/components/typography/styles'\nimport {\n white,\n fontColor,\n subheaderColor,\n subheaderDarkColor,\n offColor,\n offDarkColor\n} from 'src/styling/variables'\n\nconst { p } = typographyStyles\n\nconst colors = (color1, color2, color3) => {\n return {\n backgroundColor: color1,\n '&:hover': {\n backgroundColor: color2\n },\n '&:active': {\n backgroundColor: color3\n }\n }\n}\n\nexport default {\n actionButton: {\n extend: p,\n cursor: 'pointer',\n border: 'none',\n height: 28,\n outline: 0,\n borderRadius: 6,\n padding: '0 8px',\n display: 'flex',\n alignItems: 'center'\n },\n primary: {\n extend: colors(subheaderColor, subheaderDarkColor, offColor),\n '&:active': {\n color: white,\n '& $actionButtonIcon': {\n display: 'none'\n },\n '& $actionButtonIconActive': {\n display: 'flex'\n }\n },\n '& $actionButtonIconActive': {\n display: 'none'\n }\n },\n secondary: {\n extend: colors(offColor, offDarkColor, white),\n color: white,\n '&:active': {\n color: fontColor,\n '& $actionButtonIcon': {\n display: 'flex'\n },\n '& $actionButtonIconActive': {\n display: 'none'\n }\n },\n '& $actionButtonIcon': {\n display: 'none'\n },\n '& $actionButtonIconActive': {\n display: 'flex'\n }\n },\n actionButtonIcon: {\n display: 'flex',\n paddingRight: 7,\n '@global': {\n svg: {\n width: 14,\n height: 14\n }\n }\n },\n actionButtonIconActive: {}\n}\n","import { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport React, { memo } from 'react'\n\nimport styles from './ActionButton.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst ActionButton = memo(\n ({ className, Icon, InverseIcon, color, children, ...props }) => {\n const classes = useStyles()\n const classNames = {\n [classes.actionButton]: true,\n [classes.primary]: color === 'primary',\n [classes.secondary]: color === 'secondary'\n }\n\n return (\n \n )\n }\n)\n\nexport default ActionButton\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/add/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M11.5384615,6 C11.5384615,9.05815385 9.05815385,11.5384615 6,11.5384615 C2.94184615,11.5384615 0.461538462,9.05815385 0.461538462,6 C0.461538462,2.94184615 2.94184615,0.461538462 6,0.461538462 C9.05815385,0.461538462 11.5384615,2.94184615 11.5384615,6 Z\",\n id: \"Stroke-1\",\n stroke: \"#1B2559\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 6,\n y1: 3.69230769,\n x2: 6,\n y2: 8.30769231,\n id: \"Stroke-3\",\n stroke: \"#1B2559\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 3.69230769,\n y1: 6,\n x2: 8.30769231,\n y2: 6,\n id: \"Stroke-5\",\n stroke: \"#1B2559\"\n}));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.a976fef2.svg\";\nexport { ForwardRef as ReactComponent };","import { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport React, { memo } from 'react'\n\nimport typographyStyles from 'src/components/typography/styles'\nimport { ReactComponent as AddIcon } from 'src/styling/icons/button/add/zodiac.svg'\nimport { zircon, zircon2, comet, fontColor, white } from 'src/styling/variables'\n\nconst { p } = typographyStyles\n\nconst styles = {\n button: {\n extend: p,\n border: 'none',\n backgroundColor: zircon,\n cursor: 'pointer',\n outline: 0,\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n width: 167,\n height: 48,\n color: fontColor,\n '&:hover': {\n backgroundColor: zircon2\n },\n '&:active': {\n backgroundColor: comet,\n color: white,\n '& svg g *': {\n stroke: white\n }\n },\n '& svg': {\n marginRight: 8\n }\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst SimpleButton = memo(({ className, children, ...props }) => {\n const classes = useStyles()\n\n return (\n \n )\n})\n\nexport default SimpleButton\n","import typographyStyles from 'src/components/typography/styles'\nimport {\n white,\n disabledColor,\n secondaryColor,\n secondaryColorDark,\n secondaryColorDarker,\n spacer\n} from 'src/styling/variables'\n\nconst { h1, h3 } = typographyStyles\n\nconst pickSize = size => {\n switch (size) {\n case 'xl':\n return spacer * 7.625\n case 'sm':\n return spacer * 4\n case 'lg':\n default:\n return spacer * 5\n }\n}\n\nexport default {\n wrapper: ({ size }) => {\n const height = pickSize(size)\n const shadowSize = height / 12\n return { height: height + shadowSize / 2 }\n },\n button: ({ size }) => {\n const height = pickSize(size)\n const shadowSize = size === 'xl' ? 3 : height / 12\n const padding = size === 'xl' ? 20 : height / 2\n\n return {\n extend: size === 'xl' ? h1 : h3,\n border: 'none',\n color: white,\n cursor: 'pointer',\n fontWeight: 900,\n outline: 0,\n backgroundColor: secondaryColor,\n '&:disabled': {\n backgroundColor: disabledColor,\n boxShadow: 'none',\n '&:hover': {\n backgroundColor: disabledColor,\n boxShadow: 'none'\n },\n '&:active': {\n marginTop: 0\n }\n },\n shadowSize,\n height,\n padding: `0 ${padding}px`,\n borderRadius: height / 4,\n boxShadow: `0 ${shadowSize}px ${secondaryColorDark}`,\n '&:hover': {\n backgroundColor: secondaryColorDark,\n boxShadow: `0 ${shadowSize}px ${secondaryColorDarker}`\n },\n '&:active': {\n marginTop: shadowSize / 2,\n backgroundColor: secondaryColorDark,\n boxShadow: `0 ${shadowSize / 2}px ${secondaryColorDarker}`\n }\n }\n }\n}\n","import { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport React, { memo } from 'react'\n\nimport styles from './Button.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst ActionButton = memo(({ size = 'lg', children, className, ...props }) => {\n const classes = useStyles({ size })\n return (\n\n \n
\n )\n})\n\nexport default ActionButton\n","import {\n white,\n fontColor,\n subheaderColor,\n subheaderDarkColor,\n offColor,\n offDarkColor\n} from 'src/styling/variables'\n\nconst colors = (color1, color2, color3) => {\n return {\n backgroundColor: color1,\n '&:hover': {\n backgroundColor: color2\n },\n '&:active': {\n backgroundColor: color3\n }\n }\n}\n\nconst buttonHeight = 32\n\nexport default {\n baseButton: {\n extend: colors(subheaderColor, subheaderDarkColor, offColor),\n cursor: 'pointer',\n border: 'none',\n outline: 0,\n height: buttonHeight,\n color: fontColor,\n '&:active': {\n color: white\n }\n },\n primary: {\n extend: colors(subheaderColor, subheaderDarkColor, offColor),\n '&:active': {\n color: white,\n '& $buttonIcon': {\n display: 'none'\n },\n '& $buttonIconActive': {\n display: 'block'\n }\n },\n '& $buttonIconActive': {\n display: 'none'\n }\n },\n secondary: {\n extend: colors(offColor, offDarkColor, white),\n color: white,\n '&:active': {\n color: fontColor,\n '& $buttonIcon': {\n display: 'flex'\n },\n '& $buttonIconActive': {\n display: 'none'\n }\n },\n '& $buttonIcon': {\n display: 'none'\n },\n '& $buttonIconActive': {\n display: 'flex'\n }\n }\n}\n","import { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport React, { memo } from 'react'\n\nimport baseButtonStyles from './BaseButton.styles'\n\nconst { baseButton, primary } = baseButtonStyles\n\nconst styles = {\n featureButton: {\n extend: baseButton,\n width: baseButton.height,\n borderRadius: baseButton.height / 2,\n display: 'flex',\n padding: 0\n },\n primary,\n buttonIcon: {\n margin: 'auto',\n '& svg': {\n width: 16,\n height: 16,\n overflow: 'visible',\n '& g': {\n strokeWidth: 1.8\n }\n }\n },\n buttonIconActive: {} // required to extend primary\n}\n\nconst useStyles = makeStyles(styles)\n\nconst FeatureButton = memo(\n ({ className, Icon, InverseIcon, children, ...props }) => {\n const classes = useStyles()\n\n const classNames = {\n [classes.featureButton]: true,\n [classes.primary]: true\n }\n\n return (\n \n )\n }\n)\n\nexport default FeatureButton\n","import { makeStyles, Popper as MaterialPopper, Paper } from '@material-ui/core'\nimport classnames from 'classnames'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport { white } from 'src/styling/variables'\n\nconst Popover = ({\n children,\n bgColor = white,\n arrowSize = 6,\n className,\n ...props\n}) => {\n const [arrowRef, setArrowRef] = useState(null)\n\n const styles = {\n popover: {\n zIndex: 3000,\n backgroundColor: bgColor,\n borderRadius: 4\n },\n arrow: {\n position: 'absolute',\n fontSize: arrowSize,\n width: '3em',\n height: '3em'\n },\n arrowBottom: {\n top: 0,\n width: 0,\n height: 0,\n borderLeft: [['2em', 'solid', 'transparent']],\n borderRight: [['2em', 'solid', 'transparent']],\n borderBottom: [['2em', 'solid', bgColor]],\n marginTop: '-1.9em',\n '&:after': {\n zIndex: -10,\n content: '\"\"',\n position: 'absolute',\n width: arrowSize * 3,\n height: arrowSize * 3,\n marginLeft: 0,\n bottom: 0,\n top: 'calc(50% - 0px)',\n left: 0,\n border: '5px solid #fff',\n borderColor: 'transparent transparent #fff #fff',\n transformOrigin: '0 0',\n transform: 'rotate(45deg)',\n boxShadow:\n '0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)'\n }\n },\n arrowTop: {\n bottom: 0,\n width: 0,\n height: 0,\n borderLeft: [['2em', 'solid', 'transparent']],\n borderRight: [['2em', 'solid', 'transparent']],\n borderTop: [['2em', 'solid', bgColor]],\n marginBottom: '-1.9em',\n '&:after': {\n zIndex: -10,\n content: '\"\"',\n position: 'absolute',\n width: arrowSize * 3,\n height: arrowSize * 3,\n marginLeft: 0,\n bottom: 0,\n top: -(arrowSize * 4 + 2),\n left: 0,\n border: '5px solid #fff',\n borderColor: 'transparent transparent #fff #fff',\n transformOrigin: '0 0',\n transform: 'rotate(45deg)',\n boxShadow:\n '0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)'\n }\n },\n arrowRight: {\n left: 0,\n width: 0,\n height: 0,\n borderTop: [['2em', 'solid', 'transparent']],\n borderBottom: [['2em', 'solid', 'transparent']],\n borderRight: [['2em', 'solid', bgColor]],\n marginLeft: '-1.9em'\n },\n arrowLeft: {\n right: 0,\n width: 0,\n height: 0,\n borderTop: [['2em', 'solid', 'transparent']],\n borderBottom: [['2em', 'solid', 'transparent']],\n borderLeft: [['2em', 'solid', bgColor]],\n marginRight: '-1.9em'\n },\n root: {\n backgroundColor: bgColor\n }\n }\n\n const useStyles = makeStyles(styles)\n\n const classes = useStyles()\n\n const arrowClasses = {\n [classes.arrow]: true,\n [classes.arrowBottom]: props.placement === 'bottom',\n [classes.arrowTop]: props.placement === 'top',\n [classes.arrowRight]: props.placement === 'right',\n [classes.arrowLeft]: props.placement === 'left'\n }\n\n const modifiers = R.merge(props.modifiers, {\n flip: {\n enabled: false\n },\n preventOverflow: {\n enabled: true,\n boundariesElement: 'scrollParent'\n },\n offset: {\n enabled: true,\n offset: '0, 10'\n },\n arrow: {\n enabled: true,\n element: arrowRef\n },\n computeStyle: {\n gpuAcceleration: false\n }\n })\n\n return (\n <>\n \n
\n )}\n {InverseIcon && open && (\n \n
\n )}\n \n \n
\n \n \n )\n }\n)\n\nexport default IDButton\n","import { makeStyles, IconButton as IconB } from '@material-ui/core'\nimport React from 'react'\n\nimport { comet } from 'src/styling/variables'\n\nconst styles = {\n label: ({ size }) => ({\n width: size,\n height: size\n }),\n root: {\n '& svg': {\n flex: 1\n },\n '&:hover': {\n backgroundColor: 'inherit'\n },\n '&:hover rect': {\n stroke: comet\n },\n '&:hover polygon': {\n stroke: comet\n },\n '&:hover path': {\n stroke: comet\n }\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst IconButton = ({ size, children, onClick, ...props }) => {\n const classes = useStyles({ size })\n return (\n {children}
\n \n
\n )}\n {InverseIcon && (\n \n \n {(labels ?? []).map(({ icon, label }, idx) => (\n \n {label} \n \n ))}\n \n {children}\n
\n )\n}\n\nexport default TitleSection\n","import { ApolloProvider } from '@apollo/react-hooks'\nimport { InMemoryCache } from 'apollo-cache-inmemory'\nimport { ApolloClient } from 'apollo-client'\nimport { ApolloLink } from 'apollo-link'\nimport { onError } from 'apollo-link-error'\nimport { HttpLink } from 'apollo-link-http'\nimport React from 'react'\nimport { useHistory, useLocation } from 'react-router-dom'\n\nconst URI =\n process.env.NODE_ENV === 'development' ? 'https://localhost:8070' : ''\n\nconst getClient = (history, location) =>\n new ApolloClient({\n link: ApolloLink.from([\n onError(({ graphQLErrors, networkError }) => {\n if (graphQLErrors)\n graphQLErrors.forEach(({ message, locations, path, extensions }) => {\n if (extensions?.code === 'UNAUTHENTICATED') {\n if (location.pathname !== '/404') history.push('/404')\n }\n console.log(\n `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`\n )\n })\n if (networkError) console.log(`[Network error]: ${networkError}`)\n }),\n new HttpLink({\n credentials: 'include',\n uri: `${URI}/graphql`\n })\n ]),\n cache: new InMemoryCache(),\n defaultOptions: {\n watchQuery: {\n fetchPolicy: 'no-cache',\n errorPolicy: 'ignore'\n },\n query: {\n fetchPolicy: 'no-cache',\n errorPolicy: 'all'\n },\n mutate: {\n errorPolicy: 'all'\n }\n }\n })\n\nconst Provider = ({ children }) => {\n const history = useHistory()\n const location = useLocation()\n const client = getClient(history, location)\n return \n {title} \n {error && (\n Failed to save \n )}\n {button && (\n \n {button.text} \n \n )}\n
\n {icon}
\n \n
\n \n \n )\n}\n\nexport default NotificationCenter\n","import NotificationCenter from './NotificationCenter'\nexport default NotificationCenter\n","import { bySize, bold } from 'src/styling/helpers'\nimport { secondaryColor } from 'src/styling/variables'\n\nexport default {\n size: ({ size }) => ({\n marginTop: size === 'lg' ? 0 : 2,\n ...bySize(size)\n }),\n bold,\n root: ({ width, textAlign }) => ({\n width,\n '& input': {\n textAlign\n }\n }),\n underline: {\n '&:before': {\n borderBottomColor: secondaryColor\n },\n '&:hover:not(.Mui-disabled)::before': {\n borderBottomColor: secondaryColor\n }\n }\n}\n","import { makeStyles } from '@material-ui/core'\nimport TextField from '@material-ui/core/TextField'\nimport classnames from 'classnames'\nimport * as R from 'ramda'\nimport React, { memo } from 'react'\n\nimport styles from './TextInput.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst TextInput = memo(\n ({\n name,\n isPasswordFilled,\n onChange,\n onBlur,\n value,\n error,\n suffix,\n textAlign,\n width,\n // lg or sm\n size,\n bold,\n className,\n InputProps,\n ...props\n }) => {\n const classes = useStyles({ textAlign, width, size })\n const isTextFilled = !error && !R.isNil(value) && !R.isEmpty(value)\n const filled = isPasswordFilled || isTextFilled\n const inputClasses = {\n [classes.bold]: bold\n }\n\n return (\n \n
\n Notifications
\n \n\n {hasUnread && (\n setShowingUnread(!showingUnread)}>\n {showingUnread ? 'Show all' : 'Show unread'}\n \n )}\n {hasUnread && (\n \n Mark all as read\n \n )}\n
\n \n {!loading && buildNotifications()}\n
\n \n
\n )\n}\n\n// https://support.lamassu.is/hc/en-us/articles/360025595552-Installing-the-Sintra-Forte\n// Sintra and Sintra Forte can have up to 500 notes per cashOut box and up to 1000 per cashIn box\nconst CashIn = ({ currency, notes, total }) => {\n const classes = gridClasses()\n return (\n <>\n \n {percent <= threshold && (\n {percent.toFixed(0)}% \n )}\n
\n \n {percent > threshold && (\n {percent.toFixed(0)}% \n )}\n
\n \n
\n \n )\n}\n\nconst CashInFormik = ({\n capacity = 1000,\n onEmpty,\n field: {\n value: { notes, deviceId }\n },\n form: { setFieldValue }\n}) => {\n const classes = gridClasses()\n\n return (\n <>\n \n
\n \n {notes} notes \n
\n \n {/* Feature on hold until this can be calculated\n \n {total} {currency.code}\n \n */}\n
\n \n
\n \n )\n}\n\nconst CashOut = ({\n capacity = 500,\n denomination = 0,\n currency,\n notes,\n className,\n editingMode = false\n}) => {\n const percent = (100 * notes) / capacity\n const classes = gridClasses()\n return (\n <>\n \n
\n \n
\n \n {\n onEmpty({\n variables: {\n deviceId,\n action: 'emptyCashInBills'\n }\n }).then(() => setFieldValue('cashin.notes', 0))\n }}\n className={classes.link}\n color={'primary'}>\n Empty\n \n
\n \n
\n \n )\n}\n\nconst CashOutFormik = ({ capacity = 500, ...props }) => {\n const {\n name,\n onChange,\n onBlur,\n value: { notes }\n } = props.field\n const { touched, errors } = props.form\n\n const error = !!(touched[name] && errors[name])\n\n const percent = (100 * notes) / capacity\n const classes = gridClasses()\n\n return (\n <>\n \n
\n {!editingMode && (\n \n
\n )}\n \n {notes} \n
\n \n \n {notes * denomination} {currency.code}\n \n
\n \n
\n \n )\n}\n\nexport { Cashbox, CashIn, CashInFormik, CashOut, CashOutFormik }\n","import { makeStyles } from '@material-ui/core'\nimport React, { memo, useState } from 'react'\n\nimport { CashOut } from 'src/components/inputs/cashbox/Cashbox'\n\nimport { NumberInput } from '../base'\nconst useStyles = makeStyles({\n flex: {\n display: 'flex'\n },\n cashCassette: {\n width: 80,\n height: 36,\n marginRight: 16\n }\n})\n\nconst CashCassetteInput = memo(({ decimalPlaces, ...props }) => {\n const classes = useStyles()\n const { name, onChange, onBlur, value } = props.field\n const { touched, errors } = props.form\n const [notes, setNotes] = useState(value)\n const error = !!(touched[name] && errors[name])\n return (\n \n
\n \n
\n \n
\n \n {\n setNotes(e.target.value)\n return onChange(e)\n }}\n onBlur={onBlur}\n value={value}\n error={error}\n decimalPlaces={decimalPlaces}\n {...props}\n />\n
\n )\n})\n\nexport default CashCassetteInput\n","import React, { memo } from 'react'\n\nimport { NumberInput } from '../base'\n\nconst NumberInputFormik = memo(({ decimalPlaces, ...props }) => {\n const { name, onChange, onBlur, value } = props.field\n const { touched, errors } = props.form\n\n const error = !!(touched[name] && errors[name])\n\n return (\n \n
\n \n )\n}\n\nconst initialValues = {\n name: ''\n}\n\nconst validationSchema = Yup.object().shape({\n name: Yup.string()\n .required()\n .max(50)\n})\n\nconst MachineNameComponent = ({ nextStep, classes, setQrCode, setName }) => {\n const [register] = useMutation(SAVE_CONFIG, {\n onCompleted: ({ createPairingTotem }) => {\n if (process.env.NODE_ENV === 'development') {\n console.log(`totem: \"${createPairingTotem}\" `)\n }\n setQrCode(createPairingTotem)\n nextStep()\n },\n onError: e => console.log(e)\n })\n\n return (\n <>\n \n
\n \n
\n \n
\n {hasNewMachine && (\n \n
\n \n
\n \n To pair the machine you need scan the QR code with your machine.\n To do this either snap a picture of this QR code or download it\n through the button above and scan it with the scanning bay on\n your machine.\n
\n\n \n Machine has been successfully paired!\n \n
\n )}\n \n
\n \n \n {it.label}\n \n {active &&
\n )}\n \n )\n}\n\nconst AddMachine = memo(({ close, onPaired }) => {\n const classes = useStyles()\n const { data } = useQuery(GET_MACHINES)\n const [qrCode, setQrCode] = useState('')\n const [name, setName] = useState('')\n const [step, setStep] = useState(0)\n const count = getSize(data)\n\n const Component = steps[step].component\n\n return (\n \n \n \n \n \n
\n )\n})\n\nexport default AddMachine\n","import AddMachine from './AddMachine'\n\nexport default AddMachine\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/add/white\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M11.5384615,6 C11.5384615,9.05815385 9.05815385,11.5384615 6,11.5384615 C2.94184615,11.5384615 0.461538462,9.05815385 0.461538462,6 C0.461538462,2.94184615 2.94184615,0.461538462 6,0.461538462 C9.05815385,0.461538462 11.5384615,2.94184615 11.5384615,6 Z\",\n id: \"Stroke-1\",\n stroke: \"#FFFFFF\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 6,\n y1: 3.69230769,\n x2: 6,\n y2: 8.30769231,\n id: \"Stroke-3\",\n stroke: \"#FFFFFF\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 3.69230769,\n y1: 6,\n x2: 8.30769231,\n y2: 6,\n id: \"Stroke-5\",\n stroke: \"#FFFFFF\"\n}));\n\nfunction SvgWhite(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWhite);\nexport default __webpack_public_path__ + \"static/media/white.cc7667ff.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"defs\", null, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M17.8413132,12.8764646 C17.8413132,12.8764646 16.6555879,12.5091919 15.661533,12.2855556 C15.661533,12.2855556 15.3477198,10.3246465 14.8939121,8.23646465 C14.8939121,8.23646465 15.1560495,8.21373737 15.3383242,8.8710101 L16.0223242,12.0219192 C16.0223242,12.0219192 17.2343571,12.2991919 18.1795549,12.6537374 L17.8413132,12.8764646 Z M15.2603407,6.10282828 L15.5328132,5.80555556 C16.0627253,5.87828283 16.3483516,6.02828283 16.3483516,6.02828283 L16.291978,6.11191919 L16.3972088,6.9310101 C16.2440604,6.93646465 16.0091703,7.05919192 16.0091703,7.05919192 L15.8315934,6.95010101 L15.8315934,6.38282828 C15.3026209,6.29919192 15.2556429,6.21828283 15.2556429,6.21828283 L15.2603407,6.10282828 Z M12.4557527,18.2873737 C11.2831813,18.4964646 9.84565385,18.2237374 9.84565385,18.2237374 L9.89732967,17.9991919 C9.89732967,17.9991919 11.6496099,18.1955556 12.6248736,17.8973737 C12.5553462,18.0628283 12.5356154,18.1137374 12.4557527,18.2873737 L12.4557527,18.2873737 Z M9.18984066,14.5464646 C8.379,15.1364646 7.56064286,15.6791919 7.00442308,16.1091919 C6.9705989,16.6955556 6.91516484,17.6464646 6.91516484,17.6464646 L5.46448352,18.5182828 L5.22207692,18.3737374 C5.27845055,17.9219192 5.34891758,17.5882828 5.34891758,17.5882828 L5.55186264,17.4410101 C5.50676374,17.7282828 5.48515385,18.1346465 5.48515385,18.1346465 L6.5928956,17.440101 C6.63705495,16.7019192 6.72443407,15.960101 6.72443407,15.960101 C6.9705989,15.7373737 8.73697253,14.5237374 10.0100803,13.6864646 C10.0100803,13.6864646 10.018533,13.9437374 9.18984066,14.5464646 L9.18984066,14.5464646 Z M14.977533,0.195555556 C15.2612802,0.167373737 15.5065055,0.184646465 15.7103901,0.228282828 L15.7103901,0.228282828 L15.8813901,0.697373737 L16.1003077,0.361919192 C16.2694286,0.447373737 16.3746593,0.547373737 16.4056648,0.624646465 C16.4056648,0.624646465 16.3615055,0.909191919 16.4319725,1.36464646 C16.5005604,1.80373737 16.6988077,2.78191919 16.6988077,2.78191919 C16.9740989,3.00646465 17.2850934,3.51282828 17.2850934,3.51282828 C17.4758242,4.41737374 17.4645495,5.04919192 17.4636099,5.1210101 C16.6734396,4.68646465 15.6173736,4.58555556 15.6173736,4.58555556 L15.6173736,4.58555556 L15.2481264,4.90828283 C15.9753462,5.00828283 16.8792033,5.26555556 17.1122143,5.44555556 C17.2484505,5.74737374 17.3386484,6.22828283 17.3386484,6.22828283 L17.3386484,6.22828283 L17.0445659,6.58919192 L17.3198571,6.8810101 C17.3386484,7.22464646 17.2183846,7.56919192 17.2183846,7.56919192 C17.7905769,7.93010101 17.9512418,8.79373737 18.3101538,10.250101 C18.6700055,11.7064646 18.9903956,12.9055556 18.9903956,12.9055556 L18.9903956,12.9055556 L18.4567253,13.2019192 C19.1623352,15.7282828 18.444511,17.7391919 17.5378352,19.0664646 C16.6320989,20.3946465 16.0862143,21.7137374 16.1031264,22.8910101 L16.1031264,22.8910101 L16.5475385,23.2346465 L16.7749121,23.9491919 L14.3048077,23.9491919 L14.293533,23.2728283 C14.2925934,21.5619192 14.9230385,20.1328283 14.9230385,20.1328283 C15.2857088,20.0473737 15.6596538,19.7628283 15.6596538,19.7628283 C15.0733681,19.8828283 14.3414505,19.7964646 14.3414505,19.7964646 C14.8676044,18.8537374 15.0292088,18.1773737 15.0292088,18.1773737 L15.0292088,18.1773737 L14.7811648,18.1228283 C14.6956648,18.310101 14.6073462,18.4937374 14.5133901,18.6710101 C13.8754286,19.8864646 13.1735769,20.6628283 12.7554725,22.4055556 L12.7554725,22.4055556 L13.1933077,22.7455556 L13.6987912,23.9491919 L10.8509835,23.9491919 C10.8340714,21.8246465 11.495522,20.2273737 11.7341703,19.7628283 C10.2233571,19.9264646 8.42128022,19.1782828 6.99314835,19.4664646 C6.60041209,21.9473737 4.59257143,22.4355556 3.65019231,22.300101 L3.65019231,22.300101 L2.97652747,23.4146465 L3.58724176,23.9491919 L1.33135714,23.9491919 C1.32008242,23.8546465 1.2918956,23.7537374 1.22988462,23.6591919 C1.22988462,23.6591919 1.97401648,22.5882828 2.48231868,21.150101 C2.89008791,21.3255556 3.75166484,20.9928283 3.78736813,20.1055556 C3.82401099,19.2191919 3.67086264,17.8419192 4.46854945,16.7891919 C5.2652967,15.7355556 6.12687363,15.1655556 7.25152747,14.3328283 C7.98250549,13.7910101 9.22084615,12.8755556 9.99974176,12.3010101 L9.99974176,12.3010101 L9.61546154,12.3864646 L6.81087363,14.6491919 L5.82997253,14.6491919 L8.66368681,12.1164646 L8.29725824,12.1091919 L5.33576374,14.6491919 L4.34170879,14.6491919 L7.27313736,11.720101 L6.9208022,11.7173737 L3.88038462,14.6491919 L2.86565934,14.6491919 L5.8093022,11.3037374 L5.46918132,11.3055556 L2.43534066,14.6491919 L1.36706044,14.6491919 L4.22614286,10.8528283 L3.89635714,10.8573737 L0.963989011,14.6491919 L0,14.6491919 C0,14.6491919 4.11809341,8.22464646 4.92893407,7.00737374 C5.73883516,5.79010101 6.6192033,4.62282828 8.06894505,4.38464646 C9.53465934,4.14282828 10.5343516,4.46646465 11.2502967,5.63373737 C11.636456,6.2610101 12.1034176,6.97828283 12.4698462,7.55919192 C12.0968407,8.1510101 11.6298791,8.6110101 11.5857198,9.32282828 C11.534044,10.1419192 12.0921429,10.6373737 12.6558791,10.6773737 C12.2321374,10.5282828 11.8976538,10.0337374 12.0489231,9.37646465 C12.2058297,8.69737374 12.7554725,8.35191919 13.1726374,7.80282828 C13.5315495,7.32828283 13.5371868,6.63282828 13.5108791,6.4010101 C13.4836319,6.16919192 13.2167967,5.98828283 13.2167967,5.98828283 C13.2167967,5.98828283 13.2252527,5.52373737 13.2167967,5.01646465 C13.2083407,4.51010101 13.4300769,4.21828283 13.4300769,4.21828283 C13.4300769,4.21828283 13.4216209,3.4610101 13.3943736,2.57646465 C13.3671264,1.72555556 13.2863242,1.46828283 13.205522,1.35464646 C13.205522,1.35464646 13.2694121,1.10919192 13.5099396,0.844646465 L13.5099396,0.844646465 L13.7542253,1.06282828 L13.8284505,0.571919192 C13.9825385,0.469191919 14.1723297,0.375555556 14.4072198,0.307373737 C14.4325879,0.30010101 14.4570165,0.294646465 14.4823846,0.288282828 L14.4823846,0.288282828 L14.7896209,0.644646465 Z M7.71628243,19.8937938 C8.32897736,19.8402566 9.02386307,19.9393405 9.75797621,20.0432188 L9.75797621,20.0432188 L9.86538462,20.058401 C9.7449004,20.8103202 9.02106112,21.7691969 7.79193531,22.0896215 L7.79193531,22.0896215 L9.01358923,23.5151515 L7.36136769,23.5151515 C7.15589073,23.2226941 6.50396838,22.32135 6.16586538,21.9681638 C6.72065317,21.6525335 7.42954868,21.0388524 7.71628243,19.8937938 Z\",\n id: \"path-1\"\n}));\n\nvar _ref4 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"Symbols\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"nav-/-primary-/-1440\",\n transform: \"translate(-128.000000, -14.000000)\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/lamassu-logo\",\n transform: \"translate(128.000000, 14.000000)\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"color/amaz/default\"\n}, /*#__PURE__*/React.createElement(\"mask\", {\n id: \"mask-2\",\n fill: \"white\"\n}, /*#__PURE__*/React.createElement(\"use\", {\n xlinkHref: \"#path-1\"\n})), /*#__PURE__*/React.createElement(\"use\", {\n id: \"Mask\",\n fill: \"#16D6D3\",\n xlinkHref: \"#path-1\"\n})))));\n\nfunction SvgLogo(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"19px\",\n height: \"24px\",\n viewBox: \"0 0 19 24\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3, _ref4);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgLogo);\nexport default __webpack_public_path__ + \"static/media/logo.8ee79eab.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"Symbols\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"nav-/-primary-/-1440\",\n transform: \"translate(-1295.000000, -19.000000)\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/menu/notification\",\n transform: \"translate(1296.000000, 20.000000)\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M10.1052632,14.3157895 C10.1052632,15.2454737 9.35073684,16 8.42105263,16 C7.49136842,16 6.73684211,15.2454737 6.73684211,14.3157895\",\n id: \"Stroke-1\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M1.6,14.3157895 C0.7168,14.3157895 0,13.6031813 0,12.7251462 C0,11.8471111 0.7168,11.1345029 1.6,11.1345029 L1.6,6.3625731 C1.6,2.84884211 4.4656,0 8,0 C11.5344,0 14.4,2.84884211 14.4,6.3625731 L14.4,11.1345029 C15.2832,11.1345029 16,11.8471111 16,12.7251462 C16,13.6031813 15.2832,14.3157895 14.4,14.3157895 L1.6,14.3157895 Z\",\n id: \"Stroke-3\",\n strokeLinejoin: \"round\"\n}))));\n\nfunction SvgNotification(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"18px\",\n height: \"18px\",\n viewBox: \"0 0 18 18\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgNotification);\nexport default __webpack_public_path__ + \"static/media/notification.a9712ffd.svg\";\nexport { ForwardRef as ReactComponent };","import typographyStyles from 'src/components/typography/styles'\nimport {\n version,\n mainWidth,\n spacer,\n white,\n primaryColor,\n secondaryColor,\n placeholderColor,\n subheaderColor,\n fontColor\n} from 'src/styling/variables'\n\nconst { tl2, p } = typographyStyles\n\nlet headerHeight = spacer * 7\nlet subheaderHeight = spacer * 5\n\nif (version === 8) {\n headerHeight = spacer * 8\n subheaderHeight = spacer * 7\n}\n\nconst styles = {\n headerContainer: {\n position: 'relative'\n },\n header: {\n backgroundColor: primaryColor,\n color: white,\n height: headerHeight,\n display: 'flex'\n },\n content: {\n maxWidth: mainWidth,\n flex: 1,\n display: 'flex',\n alignItems: 'center',\n margin: '0 auto'\n },\n nav: {\n flex: 1,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between'\n },\n ul: {\n display: 'flex',\n paddingLeft: spacer * 4.5,\n height: spacer * 7,\n margin: 0\n },\n li: {\n // extend: tl2,\n // height: spacer * 7,\n listStyle: 'none',\n color: white,\n margin: [[spacer * 2.5, spacer * 2.5, 0, spacer * 2.5]],\n '&:hover': {\n color: white\n },\n '&:hover::after': {\n width: '50%',\n marginLeft: '-25%'\n },\n position: 'relative',\n '&:after': {\n content: '\"\"',\n display: 'block',\n background: white,\n width: 0,\n height: 4,\n left: '50%',\n marginLeft: 0,\n bottom: -8,\n position: 'absolute',\n borderRadius: 1000,\n transition: [['all', '0.2s', 'cubic-bezier(0.95, 0.1, 0.45, 0.94)']]\n }\n },\n link: {\n extend: p,\n textDecoration: 'none',\n border: 'none',\n color: white,\n backgroundColor: 'transparent'\n },\n forceSize: {\n display: 'inline-block',\n textAlign: 'center',\n '&:after': {\n display: 'block',\n content: 'attr(forcesize)',\n fontWeight: 700,\n height: 0,\n overflow: 'hidden',\n visibility: 'hidden'\n }\n },\n activeLink: {\n color: white,\n '& li::after': {\n width: '50%',\n marginLeft: '-25%'\n }\n },\n addMachine: {\n marginLeft: 'auto'\n },\n subheader: {\n backgroundColor: subheaderColor,\n color: white,\n height: subheaderHeight,\n display: 'flex'\n },\n subheaderUl: {\n display: 'flex',\n paddingLeft: 0\n },\n subheaderLi: {\n extend: tl2,\n display: 'flex',\n alignItems: 'center',\n height: spacer * 3,\n listStyle: 'none',\n padding: [[0, spacer * 2.5]],\n '&:first-child': {\n paddingLeft: 0\n }\n },\n subheaderLink: {\n extend: p,\n textDecoration: 'none',\n border: 'none',\n color: placeholderColor\n },\n activeSubheaderLink: {\n extend: tl2,\n color: fontColor\n },\n white: {\n color: white\n },\n logo: {\n display: 'flex',\n alignItems: 'center',\n '& > svg': {\n marginRight: 16\n }\n },\n logoLink: {\n cursor: 'pointer'\n },\n actionButtonsContainer: {\n zIndex: 1,\n position: 'relative',\n display: 'flex',\n justifyContent: 'space-between',\n minWidth: 200,\n transform: 'translateZ(0)'\n },\n notificationIcon: {\n marginTop: spacer / 2,\n cursor: 'pointer',\n background: 'transparent',\n boxShadow: '0px 0px 0px transparent',\n border: '0px solid transparent',\n textShadow: '0px 0px 0px transparent',\n outline: 'none'\n },\n hasUnread: {\n position: 'absolute',\n top: 4,\n left: 182,\n width: '9px',\n height: '9px',\n backgroundColor: secondaryColor,\n borderRadius: '50%'\n },\n popper: {\n zIndex: 1\n }\n}\n\nexport default styles\n","import { useQuery } from '@apollo/react-hooks'\nimport ClickAwayListener from '@material-ui/core/ClickAwayListener'\nimport Popper from '@material-ui/core/Popper'\nimport { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React, { memo, useState, useEffect, useRef } from 'react'\nimport { NavLink, useHistory } from 'react-router-dom'\n\nimport NotificationCenter from 'src/components/NotificationCenter'\nimport ActionButton from 'src/components/buttons/ActionButton'\nimport { H4 } from 'src/components/typography'\nimport AddMachine from 'src/pages/AddMachine'\nimport { ReactComponent as AddIconReverse } from 'src/styling/icons/button/add/white.svg'\nimport { ReactComponent as AddIcon } from 'src/styling/icons/button/add/zodiac.svg'\nimport { ReactComponent as Logo } from 'src/styling/icons/menu/logo.svg'\nimport { ReactComponent as NotificationIcon } from 'src/styling/icons/menu/notification.svg'\n\nimport styles from './Header.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst HAS_UNREAD = gql`\n query getUnread {\n hasUnreadNotifications\n }\n`\n\nconst Subheader = ({ item, classes }) => {\n const [prev, setPrev] = useState(null)\n\n return (\n \n
\n \n Add Machine \n \n \n \n \n
\n \n \n {steps.map((it, idx) => renderStepper(step, it, idx, classes))}\n \n
\n \n setStep(1)}\n count={count}\n onPaired={onPaired}\n qrCode={qrCode}\n setQrCode={setQrCode}\n name={name}\n setName={setName}\n />\n
\n \n
\n )\n}\n\nconst notNil = R.compose(R.not, R.isNil)\n\nconst Header = memo(({ tree }) => {\n const [open, setOpen] = useState(false)\n const [anchorEl, setAnchorEl] = useState(null)\n const [notifButtonCoords, setNotifButtonCoords] = useState({ x: 0, y: 0 })\n const [active, setActive] = useState()\n const [hasUnread, setHasUnread] = useState(false)\n\n const { data, refetch } = useQuery(HAS_UNREAD, { pollInterval: 60000 })\n const notifCenterButtonRef = useRef()\n const popperRef = useRef()\n const history = useHistory()\n const classes = useStyles()\n\n useEffect(() => {\n if (data?.hasUnreadNotifications) return setHasUnread(true)\n // if not true, make sure it's false and not undefined\n if (notNil(data?.hasUnreadNotifications)) return setHasUnread(false)\n }, [data])\n\n const onPaired = machine => {\n setOpen(false)\n history.push('/maintenance/machine-status', { id: machine.deviceId })\n }\n\n // these inline styles prevent scroll bubbling: when the user reaches the bottom of the notifications list and keeps scrolling,\n // the body scrolls, stealing the focus from the notification center, preventing the admin from scrolling the notifications back up\n // on the first scroll, needing to move the mouse to recapture the focus on the notification center\n // it also disables the scrollbars caused by the notification center's background to the right of the page, but keeps the scrolling on the body enabled\n const onClickAway = () => {\n setAnchorEl(null)\n document.querySelector('#root').classList.remove('root-notifcenter-open')\n document.querySelector('body').classList.remove('body-notifcenter-open')\n }\n\n const handleClick = event => {\n const coords = notifCenterButtonRef.current.getBoundingClientRect()\n setNotifButtonCoords({ x: coords.x, y: coords.y })\n\n setAnchorEl(anchorEl ? null : event.currentTarget)\n document.querySelector('#root').classList.add('root-notifcenter-open')\n document.querySelector('body').classList.add('body-notifcenter-open')\n }\n\n const popperOpen = Boolean(anchorEl)\n const id = popperOpen ? 'notifications-popper' : undefined\n return (\n \n \n
\n \n
\n \n {active && active.children && (\n \n {\n setActive(false)\n history.push('/dashboard')\n }}\n className={classnames(classes.logo, classes.logoLink)}>\n
\n \n Lamassu Admin
\n\n setOpen(true)}>\n Add machine\n \n \n \n
\n \n \n \n
\n \n \n \n
\n {children}
\n \n \n \n {parentElements}\n
\n {children}
\n \n \n )\n})\n\nexport { Tooltip, HoverableTooltip }\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"defs\", null, /*#__PURE__*/React.createElement(\"path\", {\n id: \"arrow-path\",\n d: \"M5.3501239,7.53208616 L0.473798314,2.73082122 C-0.158421727,2.1051411 -0.158421727,1.0952488 0.476737158,0.466675069 C1.11220338,-0.155816755 2.1378971,-0.155816755 2.77494316,0.468226909 L6.49990857,4.13723769 L10.2264532,0.466675069 C10.8619195,-0.155816755 11.8876132,-0.155816755 12.5260183,0.469568675 C13.1582383,1.0952488 13.1582383,2.1051411 12.5245507,2.73226987 L7.64673876,7.53497972 C7.33802629,7.83583835 6.92590837,8 6.49990828,8 C6.0739082,8 5.66179027,7.83583835 5.3501239,7.53208616 Z\"\n}));\n\nvar _ref4 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"Styleguide\",\n stroke: \"none\",\n strokeWidth: 1,\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/action/arrow/regular\"\n}, /*#__PURE__*/React.createElement(\"mask\", {\n id: \"mask-2\",\n fill: \"white\"\n}, /*#__PURE__*/React.createElement(\"use\", {\n xlinkHref: \"#path-1\"\n})), /*#__PURE__*/React.createElement(\"use\", {\n id: \"Mask\",\n fillRule: \"nonzero\",\n xlinkHref: \"#arrow-path\"\n})));\n\nfunction SvgRegular(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"13px\",\n height: \"8px\",\n viewBox: \"0 0 13 8\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3, _ref4);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgRegular);\nexport default __webpack_public_path__ + \"static/media/regular.3140e691.svg\";\nexport { ForwardRef as ReactComponent };","import { subheaderColor, offColor, white } from '../../../styling/variables'\nimport typographyStyles from '../../typography/styles'\n\nconst { p, label1 } = typographyStyles\n\nconst WIDTH = 152\n\nexport default {\n selectedItem: {\n width: WIDTH - 41,\n display: 'block',\n whiteSpace: 'nowrap',\n overflow: 'hidden'\n },\n select: {\n width: WIDTH,\n zIndex: 2,\n '& label': {\n extend: label1,\n color: offColor,\n paddingLeft: 10\n },\n '& button': {\n extend: p,\n position: 'relative',\n border: 0,\n backgroundColor: subheaderColor,\n width: WIDTH,\n padding: [[6, 0, 6, 12]],\n borderRadius: 20,\n lineHeight: '1.14',\n textAlign: 'left',\n color: offColor,\n cursor: 'pointer',\n outline: '0 none'\n },\n '& ul': {\n maxHeight: '200px',\n width: WIDTH,\n overflowY: 'auto',\n position: 'absolute',\n margin: 0,\n borderTop: 0,\n padding: 0,\n borderRadius: [[0, 0, 8, 8]],\n backgroundColor: subheaderColor,\n outline: '0 none',\n '& li': {\n extend: p,\n listStyleType: 'none',\n padding: [[6, 12]],\n cursor: 'pointer',\n '& span': {\n width: '100%',\n display: 'block',\n overflow: 'hidden',\n whiteSpace: 'nowrap'\n }\n },\n '& li:hover': {\n backgroundColor: offColor,\n color: white\n }\n },\n '& svg': {\n position: 'absolute',\n top: 12,\n right: 14,\n fill: offColor\n }\n },\n selectFiltered: {\n '& button': {\n backgroundColor: offColor,\n color: white\n },\n '& ul': {\n '& li': {\n backgroundColor: offColor,\n color: white\n },\n '& li:hover': {\n backgroundColor: subheaderColor,\n color: offColor\n }\n },\n '& svg': {\n fill: [[white], '!important']\n }\n },\n open: {\n '& button': {\n borderRadius: [[8, 8, 0, 0]]\n }\n }\n}\n","import { makeStyles } from '@material-ui/core'\nimport classnames from 'classnames'\nimport { useSelect } from 'downshift'\nimport React from 'react'\n\nimport { ReactComponent as Arrowdown } from 'src/styling/icons/action/arrow/regular.svg'\n\nimport styles from './Select.styles'\n\nconst useStyles = makeStyles(styles)\n\nfunction Select({ className, label, items, ...props }) {\n const classes = useStyles()\n\n const {\n isOpen,\n selectedItem,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getItemProps\n } = useSelect({\n items,\n selectedItem: props.selectedItem,\n onSelectedItemChange: item => {\n props.onSelectedItemChange(item.selectedItem)\n }\n })\n\n const selectClassNames = {\n [classes.select]: true,\n [classes.selectFiltered]: selectedItem !== props.default,\n [classes.open]: isOpen\n }\n\n return (\n \n \n \n
\n )\n}\n\nexport default Select\n","import * as R from 'ramda'\n\nconst namespaces = {\n CASH_OUT: 'cashOut',\n WALLETS: 'wallets',\n OPERATOR_INFO: 'operatorInfo',\n NOTIFICATIONS: 'notifications',\n LOCALE: 'locale',\n COMMISSIONS: 'commissions',\n RECEIPT: 'receipt',\n COIN_ATM_RADAR: 'coinAtmRadar',\n TERMS_CONDITIONS: 'termsConditions'\n}\n\nconst mapKeys = R.curry((fn, obj) =>\n R.fromPairs(R.map(R.adjust(0, fn), R.toPairs(obj)))\n)\n\nconst filterByKey = R.curry((fn, obj) =>\n R.fromPairs(R.filter(it => fn(it[0]), R.toPairs(obj)))\n)\n\nconst stripl = R.curry((q, str) =>\n R.startsWith(q, str) ? str.slice(q.length) : str\n)\n\nconst filtered = key => filterByKey(R.startsWith(`${key}_`))\nconst stripped = key => mapKeys(stripl(`${key}_`))\n\nconst fromNamespace = R.curry((key, config) =>\n R.compose(stripped(key), filtered(key))(config)\n)\n\nconst toNamespace = R.curry((key, config) =>\n mapKeys(it => `${key}_${it}`)(config)\n)\n\nexport { fromNamespace, toNamespace, namespaces }\n","import {\n spacer,\n fontPrimary,\n primaryColor,\n white,\n errorColor\n} from 'src/styling/variables'\nconst styles = {\n grid: {\n flex: 1,\n height: '100%'\n },\n content: {\n display: 'flex',\n flexDirection: 'column',\n flex: 1,\n marginLeft: spacer * 6\n },\n footer: {\n margin: [['auto', 0, spacer * 3, 'auto']]\n },\n modalTitle: {\n lineHeight: '120%',\n color: primaryColor,\n fontSize: 14,\n fontFamily: fontPrimary,\n fontWeight: 900\n },\n subtitle: {\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n flexDirection: 'row'\n },\n white: {\n color: white\n },\n deleteButton: {\n paddingLeft: 13\n },\n addressRow: {\n marginLeft: 8\n },\n error: {\n color: errorColor\n }\n}\n\nexport default styles\n","import { makeStyles, Modal as MaterialModal, Paper } from '@material-ui/core'\nimport classnames from 'classnames'\nimport React from 'react'\n\nimport { IconButton } from 'src/components/buttons'\nimport { H1, H4 } from 'src/components/typography'\nimport { ReactComponent as CloseIcon } from 'src/styling/icons/action/close/zodiac.svg'\n\nconst styles = {\n modal: {\n display: 'flex',\n justifyContent: 'center',\n flexDirection: 'column',\n alignItems: 'center'\n },\n wrapper: ({ width, height }) => ({\n width,\n height,\n display: 'flex',\n flexDirection: 'column',\n minHeight: height ?? 400,\n maxHeight: '90vh',\n overflowY: 'auto',\n borderRadius: 8,\n outline: 0\n }),\n infoPanelWrapper: ({ width, infoPanelHeight }) => ({\n width,\n height: infoPanelHeight,\n marginTop: 16,\n display: 'flex',\n flexDirection: 'column',\n minHeight: infoPanelHeight ?? 200,\n maxHeight: '90vh',\n overflowY: 'auto',\n borderRadius: 8,\n outline: 0\n }),\n panelContent: {\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n flex: 1,\n padding: [[0, 24]]\n },\n content: ({ small, xl }) => ({\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n flex: 1,\n padding: xl ? [[0, 60 + 28]] : small ? [[0, 16]] : [[0, 32]]\n }),\n button: ({ small, xl }) => ({\n padding: [[0, 0, xl ? 26 : 0, 0]],\n margin: xl\n ? [[0, 0, 'auto', 'auto']]\n : small\n ? [[12, 12, 'auto', 'auto']]\n : [[16, 16, 'auto', 'auto']]\n }),\n header: {\n display: 'flex'\n },\n title: ({ small }) => ({\n margin: small ? [[20, 0, 8, 16]] : [[28, 0, 8, 32]]\n })\n}\n\nconst useStyles = makeStyles(styles)\n\nconst Modal = ({\n width,\n height,\n infoPanelHeight,\n title,\n small,\n xl,\n infoPanel,\n handleClose,\n children,\n secondaryModal,\n className,\n closeOnEscape,\n closeOnBackdropClick,\n ...props\n}) => {\n const classes = useStyles({ width, height, small, infoPanelHeight, xl })\n const TitleCase = small ? H4 : H1\n const closeSize = xl ? 28 : small ? 16 : 20\n\n const innerClose = (evt, reason) => {\n if (!closeOnBackdropClick && reason === 'backdropClick') return\n if (!closeOnEscape && reason === 'escapeKeyDown') return\n handleClose()\n }\n\n return (\n - \n {isOpen &&\n items.map(({ code, display }, index) => (\n
- \n {display}\n \n ))}\n
\n {title && {title} }\n handleClose()}>\n
\n {children}
\n {infoPanel}
\n \n \n Blacklist address\n \n
\n \n )\n}\n\nexport default BlackListModal\n","import {\r\n Dialog,\r\n DialogActions,\r\n DialogContent,\r\n makeStyles\r\n} from '@material-ui/core'\r\nimport React from 'react'\r\n\r\nimport { Button, IconButton } from 'src/components/buttons'\r\nimport { H4, P } from 'src/components/typography'\r\nimport { ReactComponent as CloseIcon } from 'src/styling/icons/action/close/zodiac.svg'\r\nimport { spacer } from 'src/styling/variables'\r\n\r\nimport ErrorMessage from './ErrorMessage'\r\n\r\nconst useStyles = makeStyles({\r\n content: {\r\n width: 434,\r\n padding: spacer * 2,\r\n paddingRight: spacer * 3.5\r\n },\r\n titleSection: {\r\n padding: spacer * 2,\r\n paddingRight: spacer * 1.5,\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n margin: 0\r\n },\r\n actions: {\r\n padding: spacer * 4,\r\n paddingTop: spacer * 2\r\n },\r\n title: {\r\n margin: 0\r\n },\r\n closeButton: {\r\n padding: 0,\r\n marginTop: -(spacer / 2)\r\n }\r\n})\r\n\r\nexport const DialogTitle = ({ children, close }) => {\r\n const classes = useStyles()\r\n return (\r\n \r\n {children}\r\n {close && (\r\n \r\n
\r\n )\r\n}\r\n\r\nexport const DeleteDialog = ({\r\n title = 'Confirm Delete',\r\n open = false,\r\n onConfirmed,\r\n onDismissed,\r\n item = 'item',\r\n confirmationMessage = `Are you sure you want to delete this ${item}?`,\r\n errorMessage = ''\r\n}) => {\r\n const classes = useStyles()\r\n\r\n return (\r\n \r\n )\r\n}\r\n","import typographyStyles from 'src/components/typography/styles'\nimport { bySize, bold } from 'src/styling/helpers'\nimport {\n tableHeaderColor,\n tableHeaderHeight,\n tableErrorColor,\n tableSuccessColor,\n spacer,\n white,\n tableDoubleHeaderHeight,\n offColor,\n errorColor\n} from 'src/styling/variables'\n\nconst { tl2, p, label1 } = typographyStyles\n\nexport default {\n size: ({ size }) => bySize(size),\n bold,\n header: {\n extend: tl2,\n backgroundColor: tableHeaderColor,\n height: tableHeaderHeight,\n textAlign: 'left',\n color: white,\n display: 'flex',\n alignItems: 'center'\n },\n doubleHeader: {\n extend: tl2,\n backgroundColor: tableHeaderColor,\n height: tableDoubleHeaderHeight,\n color: white,\n display: 'table-row'\n },\n thDoubleLevel: ({ width }) => ({\n width,\n display: 'table-cell',\n '& > :first-child': {\n margin: [[0, 10]],\n extend: label1,\n fontWeight: 700,\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundColor: offColor,\n color: white,\n borderRadius: [[0, 0, 8, 8]],\n height: 28\n },\n '& > :last-child': {\n padding: [[0, 11]],\n display: 'table-cell',\n verticalAlign: 'middle',\n height: tableDoubleHeaderHeight - 28\n }\n }),\n cellDoubleLevel: {\n display: 'flex',\n padding: [[0, spacer * 2]]\n },\n td: ({ textAlign, width }) => ({\n width,\n padding: [[1, spacer * 3, 0, spacer * 3]],\n textAlign\n }),\n tdHeader: {\n verticalAlign: 'middle',\n display: 'table-cell',\n padding: [[0, spacer * 3]]\n },\n trError: {\n backgroundColor: tableErrorColor\n },\n trAdding: {\n backgroundColor: tableSuccessColor\n },\n mainContent: ({ size }) => {\n const sizes = {\n sm: 34,\n lg: 68\n }\n const minHeight = sizes[size] || 48\n return {\n display: 'flex',\n alignItems: 'center',\n minHeight\n }\n },\n // mui-overrides\n cardContentRoot: {\n margin: 0,\n padding: 0,\n '&:last-child': {\n padding: 0\n }\n },\n card: {\n extend: p,\n '&:before': {\n height: 0\n },\n margin: [[4, 0, 0, 0]],\n width: '100%',\n boxShadow: [[0, 0, 4, 0, 'rgba(0, 0, 0, 0.08)']]\n },\n actionCol: {\n marginLeft: 'auto'\n },\n errorContent: {\n padding: [[12, 0, 12, 24]],\n color: errorColor\n }\n}\n","import Card from '@material-ui/core/Card'\nimport CardContent from '@material-ui/core/CardContent'\nimport { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport React from 'react'\n\nimport { Link } from 'src/components/buttons'\n\nimport styles from './Table.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst Table = ({ children, className, ...props }) => (\n \n {children}\n
\n)\n\nconst THead = ({ children, className }) => {\n const classes = useStyles()\n return {children}
\n}\n\nconst TDoubleLevelHead = ({ children, className }) => {\n const classes = useStyles()\n\n return (\n \n {children}\n
\n )\n}\n\nconst TBody = ({ children, className }) => {\n return {children}
\n}\n\nconst Td = ({\n children,\n header,\n className,\n width = 100,\n size,\n bold,\n textAlign,\n action\n}) => {\n const classes = useStyles({ textAlign, width, size })\n const classNames = {\n [classes.td]: true,\n [classes.tdHeader]: header,\n [classes.actionCol]: action,\n [classes.size]: !header,\n [classes.bold]: !header && bold\n }\n return {children}
\n}\n\nconst Th = ({ children, ...props }) => {\n return (\n \n
\n )\n}\n\nconst Tr = ({\n onClick,\n error,\n errorMessage,\n children,\n className,\n size,\n newRow\n}) => {\n const classes = useStyles({ size })\n const cardClasses = { root: classes.cardContentRoot }\n const classNames = {\n [classes.tr]: true,\n [classes.trError]: error,\n [classes.card]: true,\n [classes.trAdding]: newRow,\n className\n }\n\n return (\n <>\n {title}
\n {children}
\n {children}
\n {error && {errorMessage}
}\n \n
\n )\n})\n\nexport default EmptyTable\n","import { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport React, { memo } from 'react'\n\nconst useStyles = makeStyles({\n table: {\n // backgroundColor: tableHeaderColor,\n tableLayout: 'fixed',\n borderCollapse: 'separate',\n borderSpacing: '0 0'\n }\n})\n\nconst Table = memo(({ className, children, ...props }) => {\n const classes = useStyles()\n return (\n {message}
\n\n
\n )\n}\n\nconst DataTable = ({\n elements = [],\n data = [],\n Details,\n className,\n expandable,\n initialExpanded,\n onClick,\n loading,\n emptyText,\n rowSize,\n ...props\n}) => {\n const [expanded, setExpanded] = useState(initialExpanded)\n\n useEffect(() => setExpanded(initialExpanded), [initialExpanded])\n\n const coreWidth = R.compose(R.sum, R.map(R.prop('width')))(elements)\n const expWidth = 1200 - coreWidth\n const width = coreWidth + (expandable ? expWidth : 0)\n\n const classes = useStyles({ width })\n\n const expandRow = (id, data) => {\n if (data.id) {\n cache.clear(data.id)\n setExpanded(data.id === expanded ? null : data.id)\n } else {\n cache.clear(id)\n setExpanded(id === expanded ? null : id)\n }\n }\n\n const cache = new CellMeasurerCache({\n defaultHeight: 58,\n fixedWidth: true\n })\n\n function rowRenderer({ index, key, parent, style }) {\n return (\n \n {\n expandable && expandRow(id, data)\n onClick && onClick(data)\n }}\n error={data.error}\n errorMessage={data.errorMessage}>\n {elements.map(({ view = it => it?.toString(), ...props }, idx) => (\n \n {view(data)}\n \n ))}\n {expandable && (\n \n expandRow(id, data)}\n className={classes.expandButton}>\n {expanded && \n )}\n \n
\n {expandable && expanded && (\n \n \n \n \n \n
\n )}\n \n
\n
\n )}\n \n )\n }\n\n return (\n | }\n |
|---|
\n {children && (\n <>\n \n
\n )\n}\n\nexport default CopyToClipboard\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/action/delete/enabled\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\"\n}, /*#__PURE__*/React.createElement(\"line\", {\n x1: 9,\n y1: 9,\n x2: 9,\n y2: 18,\n id: \"Stroke-1\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 13,\n y1: 9,\n x2: 13,\n y2: 18,\n id: \"Stroke-2\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-3\",\n stroke: \"#1B2559\",\n strokeWidth: 2,\n strokeLinejoin: \"round\",\n points: \"3 6 5 21 17 21 19 6\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 1,\n y1: 5,\n x2: 21,\n y2: 5,\n id: \"Stroke-5\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M14,4 C14,2.343 12.657,1 11,1 C9.343,1 8,2.343 8,4\",\n id: \"Stroke-7\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}));\n\nfunction SvgEnabled(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"22px\",\n height: \"22px\",\n viewBox: \"0 0 22 22\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgEnabled);\nexport default __webpack_public_path__ + \"static/media/enabled.a058fdfc.svg\";\nexport { ForwardRef as ReactComponent };","import { makeStyles } from '@material-ui/core/styles'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport { DeleteDialog } from 'src/components/DeleteDialog'\nimport { IconButton } from 'src/components/buttons'\nimport DataTable from 'src/components/tables/DataTable'\nimport { Label1 } from 'src/components/typography'\nimport CopyToClipboard from 'src/pages/Transactions/CopyToClipboard'\nimport { ReactComponent as DeleteIcon } from 'src/styling/icons/action/delete/enabled.svg'\n\nimport styles from './Blacklist.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst BlacklistTable = ({\n data,\n selectedCoin,\n handleDeleteEntry,\n errorMessage,\n setErrorMessage,\n deleteDialog,\n setDeleteDialog\n}) => {\n const classes = useStyles()\n\n const [toBeDeleted, setToBeDeleted] = useState()\n\n const elements = [\n {\n name: 'address',\n header: \n {children}\n
\n \n \n handleClick(event)}>\n \n
\n \n
\n \n \n )}\n Copied to clipboard!
\n \n {R.path(['address'], it)} \n
\n )\n },\n {\n name: 'deleteButton',\n header: \n \n \n {\n addressReuseSave({ rejectAddressReuse: event.target.checked })\n }}\n value={rejectAddressReuse}\n />\n {rejectAddressReuse ? 'On' : 'Off'} \n \n \n \n \n
\n \n {clickedItem.display\n ? `${clickedItem.display} blacklisted addresses`\n : ''}{' '}\n
\nReject reused addresses
\n\n The \"Reject reused addresses\" option means that all addresses\n that are used once will be automatically rejected if there's\n an attempt to use them again on a new transaction.\n
\n\r\n {view(values[name], values)}\r\n
\r\n )}\r\n {suffix && (\r\n \n {showButtonOnEmpty && canAdd && (\n {createText} \n )}\n {showTable && (\n <>\n {(title || enableCreate) && (\n \n
\n \n )}\n
\n \n {title && titleLg && (\n {title} \n )}\n {title && !titleLg && (\n {title} \n )}\n {enableCreate && canAdd && (\n \n {createText}\n \n )}\n
\n )}\n \n
\n )\n}\n\nexport default WizardSplash\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/stage/spring/current\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n id: \"Oval-2-Copy\",\n fill: \"#48F694\",\n cx: 9,\n cy: 9,\n r: 4\n}), /*#__PURE__*/React.createElement(\"circle\", {\n id: \"Oval-Copy-5\",\n stroke: \"#48F694\",\n strokeWidth: 2,\n transform: \"translate(9.000000, 9.000000) rotate(-270.000000) translate(-9.000000, -9.000000) \",\n cx: 9,\n cy: 9,\n r: 8\n}));\n\nfunction SvgCurrent(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"18px\",\n height: \"18px\",\n viewBox: \"0 0 18 18\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgCurrent);\nexport default __webpack_public_path__ + \"static/media/current.9bbfa93f.svg\";\nexport { ForwardRef as ReactComponent };","import { makeStyles } from '@material-ui/core'\nimport classnames from 'classnames'\nimport * as R from 'ramda'\nimport React, { memo } from 'react'\n\nimport { ReactComponent as CompleteStageIconSpring } from 'src/styling/icons/stage/spring/complete.svg'\nimport { ReactComponent as CurrentStageIconSpring } from 'src/styling/icons/stage/spring/current.svg'\nimport { ReactComponent as EmptyStageIconSpring } from 'src/styling/icons/stage/spring/empty.svg'\nimport { ReactComponent as CompleteStageIconZodiac } from 'src/styling/icons/stage/zodiac/complete.svg'\nimport { ReactComponent as CurrentStageIconZodiac } from 'src/styling/icons/stage/zodiac/current.svg'\nimport { ReactComponent as EmptyStageIconZodiac } from 'src/styling/icons/stage/zodiac/empty.svg'\nimport {\n primaryColor,\n secondaryColor,\n offColor,\n disabledColor\n} from 'src/styling/variables'\n\nconst styles = {\n stages: {\n display: 'flex',\n alignItems: 'center'\n },\n wrapper: {\n display: 'flex',\n alignItems: 'center',\n margin: 0\n },\n stage: {\n display: 'flex',\n height: 28,\n width: 28,\n zIndex: 2,\n '& > svg': {\n height: '100%',\n width: '100%',\n overflow: 'visible'\n }\n },\n separator: {\n width: 28,\n height: 2,\n border: [[2, 'solid']],\n zIndex: 1\n },\n separatorSpring: {\n borderColor: secondaryColor\n },\n separatorZodiac: {\n borderColor: primaryColor\n },\n separatorSpringEmpty: {\n borderColor: disabledColor\n },\n separatorZodiacEmpty: {\n borderColor: offColor\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst Stepper = memo(({ steps, currentStep, color = 'spring', className }) => {\n if (currentStep < 1 || currentStep > steps)\n throw Error('Value of currentStage is invalid')\n if (steps < 1) throw Error('Value of stages is invalid')\n\n const classes = useStyles()\n\n const separatorClasses = {\n [classes.separator]: true,\n [classes.separatorSpring]: color === 'spring',\n [classes.separatorZodiac]: color === 'zodiac'\n }\n\n const separatorEmptyClasses = {\n [classes.separator]: true,\n [classes.separatorSpringEmpty]: color === 'spring',\n [classes.separatorZodiacEmpty]: color === 'zodiac'\n }\n\n return (\n \n \n
\n {name} \n
\n \n \n
\n \n You are about to activate cash-out functionality on your {name}{' '}\n machine which will allow your customers to sell crypto to you.\n
\n\n In order to activate cash-out for this machine, please enter the\n denominations for the machine.\n
\n\n {R.range(1, currentStep).map(idx => (\n
\n )\n})\n\nexport default Stepper\n","export default __webpack_public_path__ + \"static/media/cashout-cassette-1.fac6c691.svg\";","export default __webpack_public_path__ + \"static/media/cashout-cassette-2.34a98cfa.svg\";","import { errorColor, spacer } from 'src/styling/variables'\n\nconst LABEL_WIDTH = 150\n\nexport default {\n title: {\n margin: [[0, 0, 12, 0]]\n },\n titleDiv: {\n paddingBottom: 32\n },\n subtitle: {\n margin: [[32, 0, 21, 0]]\n },\n edit: {\n margin: [[0, 0, 0, 0]]\n },\n error: {\n color: errorColor\n },\n bill: {\n width: 131,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'end'\n },\n billInput: {\n width: '100%'\n },\n suffix: {\n paddingLeft: spacer * 2\n },\n button: {\n marginLeft: 'auto'\n },\n submit: {\n float: 'right'\n },\n picker: {\n width: LABEL_WIDTH\n },\n header: {\n display: 'flex',\n paddingBottom: 95\n },\n thirdStepHeader: {\n display: 'flex',\n paddingBottom: 188\n },\n step: {\n flex: 1\n },\n stepImage: {\n position: 'relative',\n top: -20,\n right: 14\n },\n content: {\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'space-between',\n flex: 1,\n paddingBottom: 32\n },\n disclaimer: {\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n justifyContent: 'space-between'\n },\n disclaimerIcon: {\n float: 'left',\n margin: [[-4, 16, 48, 0]]\n }\n}\n","import { makeStyles } from '@material-ui/core'\nimport { Formik, Form, Field } from 'formik'\nimport React from 'react'\n\nimport ErrorMessage from 'src/components/ErrorMessage'\nimport Stepper from 'src/components/Stepper'\nimport { Button } from 'src/components/buttons'\nimport { NumberInput } from 'src/components/inputs/formik'\nimport { Info2, H4, P, Info1, Label1 } from 'src/components/typography'\nimport cassetteOne from 'src/styling/icons/cassettes/cashout-cassette-1.svg'\nimport cassetteTwo from 'src/styling/icons/cassettes/cashout-cassette-2.svg'\nimport { ReactComponent as WarningIcon } from 'src/styling/icons/warning-icon/comet.svg'\n\nimport styles from './WizardStep.styles'\nconst useStyles = makeStyles(styles)\n\nconst WizardStep = ({\n name,\n step,\n schema,\n error,\n lastStep,\n onContinue,\n steps,\n fiatCurrency,\n options\n}) => {\n const classes = useStyles()\n\n const label = lastStep ? 'Finish' : 'Next'\n\n const cassetesArtworks = {\n 1: cassetteOne,\n 2: cassetteTwo\n }\n\n return (\n \n {idx > 1 && }\n
\n ))}\n \n {color === 'spring' &&
\n \n {currentStep > 1 && }\n
\n {R.range(currentStep + 1, steps + 1).map(idx => (\n \n {color === 'spring' &&
\n \n \n
\n ))}\n \n {color === 'spring' &&
\n \n \n \n \n )}\n\n {step === 3 && (\n \n \n \n )}\n\n {lastStep && (\n
\n )\n}\n\nexport default WizardStep\n","import * as Yup from 'yup'\n\nimport { NumberInput } from 'src/components/inputs/formik'\n\nconst currencyMax = 999999999\nconst DenominationsSchema = Yup.object().shape({\n top: Yup.number()\n .label('Cassette 1 (Top)')\n .required()\n .min(1)\n .max(currencyMax),\n bottom: Yup.number()\n .label('Cassette 2 (Bottom)')\n .required()\n .min(1)\n .max(currencyMax),\n zeroConfLimit: Yup.number()\n .label('0-conf Limit')\n .required()\n .min(0)\n .max(currencyMax)\n})\n\nconst getElements = (machines, { fiatCurrency } = {}) => {\n return [\n {\n name: 'id',\n header: 'Machine',\n width: 200,\n view: it => machines.find(({ deviceId }) => deviceId === it).name,\n size: 'sm',\n editable: false\n },\n {\n name: 'top',\n header: 'Cassette 1 (Top)',\n size: 'sm',\n stripe: true,\n width: 200,\n textAlign: 'right',\n input: NumberInput,\n inputProps: {\n decimalPlaces: 0\n },\n suffix: fiatCurrency\n },\n {\n name: 'bottom',\n header: 'Cassette 2 (Bottom)',\n size: 'sm',\n stripe: true,\n textAlign: 'right',\n width: 200,\n input: NumberInput,\n inputProps: {\n decimalPlaces: 0\n },\n suffix: fiatCurrency\n },\n {\n name: 'zeroConfLimit',\n header: '0-conf Limit',\n size: 'sm',\n stripe: true,\n textAlign: 'right',\n width: 200,\n input: NumberInput,\n inputProps: {\n decimalPlaces: 0\n },\n suffix: fiatCurrency\n }\n ]\n}\n\nexport { DenominationsSchema, getElements }\n","import * as R from 'ramda'\nimport React, { useState } from 'react'\nimport * as Yup from 'yup'\n\nimport Modal from 'src/components/Modal'\nimport { Autocomplete } from 'src/components/inputs/formik'\nimport denominations from 'src/utils/bill-denominations'\nimport { toNamespace } from 'src/utils/config'\n\nimport WizardSplash from './WizardSplash'\nimport WizardStep from './WizardStep'\nimport { DenominationsSchema } from './helper'\n\nconst LAST_STEP = 4\nconst MODAL_WIDTH = 554\nconst MODAL_HEIGHT = 520\n\nconst getOptions = R.curry((locale, denomiations) => {\n const currency = R.prop('fiatCurrency')(locale)\n return R.compose(\n R.map(code => ({ code, display: code })),\n R.keys,\n R.path([currency])\n )(denomiations)\n})\n\nconst Wizard = ({ machine, locale, onClose, save, error }) => {\n const [{ step, config }, setState] = useState({\n step: 0,\n config: { active: true }\n })\n\n const options = getOptions(locale, denominations)\n\n const title = `Enable cash-out`\n const isLastStep = step === LAST_STEP\n\n const onContinue = async it => {\n if (isLastStep) {\n return save(\n toNamespace(machine.deviceId, DenominationsSchema.cast(config))\n )\n }\n\n const newConfig = R.merge(config, it)\n\n setState({\n step: step + 1,\n config: newConfig\n })\n }\n\n const steps = [\n {\n type: 'top',\n display: 'Cassette 1 (Top)',\n component: Autocomplete,\n inputProps: {\n options: R.map(it => ({ code: it, display: it }))(options),\n labelProp: 'display',\n valueProp: 'code'\n }\n },\n {\n type: 'bottom',\n display: 'Cassette 2',\n component: Autocomplete,\n inputProps: {\n options: R.map(it => ({ code: it, display: it }))(options),\n labelProp: 'display',\n valueProp: 'code'\n }\n },\n {\n type: 'zeroConfLimit',\n display: '0-conf Limit',\n schema: Yup.object().shape({\n zeroConfLimit: Yup.number().required()\n })\n }\n ]\n\n const schema = () =>\n Yup.object().shape({\n top: Yup.number().required(),\n bottom: step >= 2 ? Yup.number().required() : Yup.number()\n })\n\n return (\n \n {name} \n
\n\n {step <= 2 && (\n \n Cash-out Bill Count \n Default Commissions \n
\n )}\n \n
\n
\n {error && Failed to save }\n \n
\n \n {\n save({ fudgeFactorActive: event.target.checked })\n }}\n value={fudgeFactorActive}\n />\n \n {fudgeFactorActive ? 'On' : 'Off'}\n \n \n \n
\n Transaction fudge factor
\n\n Automatically accept customer deposits as complete if their\n received amount is 100 crypto atoms or less.\n
\n\n (Crypto atoms are the smallest unit in each cryptocurrency. E.g.,\n satoshis in Bitcoin, or wei in Ethereum.)\n
\n\n {(title || error) && (\n
\n )\n}\n\nexport default Section\n","export default {\n section: {\n marginBottom: 72\n },\n sectionHeader: {\n display: 'flex',\n alignItems: 'center'\n },\n sectionTitle: {\n margin: [[16, 20, 23, 0]]\n }\n}\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"Styleguide\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/direction/cash-in\",\n transform: \"translate(-1.000000, 0.000000)\",\n fill: \"#16D6D3\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M3.99134364,0.321790399 L10.1430099,4.40569595 C11.0271728,4.99266501 11.2660914,6.1822461 10.6766494,7.06269968 C10.5357408,7.27317585 10.3543728,7.45378298 10.1430099,7.59410043 L3.99134364,11.678006 C3.10718075,12.264975 1.91258801,12.0270588 1.32314609,11.1466052 C1.11243854,10.8318699 1,10.4620686 1,10.0838037 L1,1.91599264 C1,0.857819122 1.86143307,0 2.92406462,0 C3.30392305,0 3.67528233,0.11196683 3.99134364,0.321790399 Z\",\n id: \"Path-3\"\n})));\n\nfunction SvgCashIn(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"10px\",\n height: \"12px\",\n viewBox: \"0 0 10 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgCashIn);\nexport default __webpack_public_path__ + \"static/media/cash-in.c06970a7.svg\";\nexport { ForwardRef as ReactComponent };","import * as _ from 'lodash/fp'\nimport * as R from 'ramda'\nimport React from 'react'\nimport { v4 } from 'uuid'\nimport * as Yup from 'yup'\n\nimport { NumberInput } from 'src/components/inputs/formik'\nimport Autocomplete from 'src/components/inputs/formik/Autocomplete.js'\nimport { ReactComponent as TxInIcon } from 'src/styling/icons/direction/cash-in.svg'\nimport { ReactComponent as TxOutIcon } from 'src/styling/icons/direction/cash-out.svg'\nimport { primaryColor, secondaryColorDark } from 'src/styling/variables'\n\nconst ALL_MACHINES = {\n name: 'All Machines',\n deviceId: 'ALL_MACHINES'\n}\n\nconst ALL_COINS = {\n display: 'All Coins',\n code: 'ALL_COINS'\n}\n\nconst cashInAndOutHeaderStyle = { marginLeft: 6 }\n\nconst cashInHeader = (\n \n {title} \n {error && Failed to save changes }\n
\n )}\n {children}\n \n
\n)\n\nconst cashOutHeader = (\n \n
\n)\n\nconst getView = (data, code, compare) => it => {\n if (!data) return ''\n\n // The following boolean should come undefined if it is rendering an unpaired machine\n const attribute = R.find(R.propEq(compare ?? 'code', it))(data)\n\n return attribute ? R.prop(code, attribute) : 'Unpaired machine'\n}\n\nconst displayCodeArray = data => it => {\n if (!it) return it\n\n return R.compose(R.join(', '), R.map(getView(data, 'display')))(it)\n}\n\nconst onCryptoChange = (prev, curr, setValue) => {\n const hasAllCoins = R.includes(ALL_COINS.code)(curr)\n const hadAllCoins = R.includes(ALL_COINS.code)(prev)\n\n if (hasAllCoins && hadAllCoins && R.length(curr) > 1) {\n return setValue(R.reject(R.equals(ALL_COINS.code))(curr))\n }\n\n if (hasAllCoins && !hadAllCoins) {\n return setValue([ALL_COINS.code])\n }\n\n setValue(curr)\n}\n\nconst boldStyle = () => {\n return {\n fontWeight: 'bold'\n }\n}\n\nconst getOverridesFields = (getData, currency, auxElements) => {\n const machineData = [ALL_MACHINES].concat(getData(['machines']))\n const rawCryptos = getData(['cryptoCurrencies'])\n const cryptoData = [ALL_COINS].concat(\n R.map(it => ({ display: it.code, code: it.code }))(rawCryptos ?? [])\n )\n\n return [\n {\n name: 'machine',\n width: 196,\n size: 'sm',\n view: getView(machineData, 'name', 'deviceId'),\n input: Autocomplete,\n inputProps: {\n options: machineData,\n valueProp: 'deviceId',\n labelProp: 'name'\n }\n },\n {\n name: 'cryptoCurrencies',\n width: 280,\n size: 'sm',\n view: displayCodeArray(cryptoData),\n input: Autocomplete,\n inputProps: {\n options: cryptoData,\n valueProp: 'code',\n labelProp: 'display',\n multiple: true,\n onChange: onCryptoChange,\n shouldStayOpen: true\n }\n },\n {\n header: cashInHeader,\n name: 'cashIn',\n display: 'Cash-in',\n width: 130,\n input: NumberInput,\n textAlign: 'right',\n suffix: '%',\n textStyle: boldStyle,\n inputProps: {\n decimalPlaces: 3\n }\n },\n {\n header: cashOutHeader,\n name: 'cashOut',\n display: 'Cash-out',\n width: 130,\n input: NumberInput,\n textAlign: 'right',\n suffix: '%',\n textStyle: boldStyle,\n inputProps: {\n decimalPlaces: 3\n }\n },\n {\n name: 'fixedFee',\n display: 'Fixed fee',\n width: 144,\n input: NumberInput,\n doubleHeader: 'Cash-in only',\n textAlign: 'right',\n suffix: currency,\n textStyle: boldStyle,\n inputProps: {\n decimalPlaces: 2\n }\n },\n {\n name: 'minimumTx',\n display: 'Minimun Tx',\n width: 144,\n input: NumberInput,\n doubleHeader: 'Cash-in only',\n textAlign: 'right',\n suffix: currency,\n textStyle: boldStyle,\n inputProps: {\n decimalPlaces: 2\n }\n }\n ]\n}\n\nconst mainFields = currency => [\n {\n header: cashInHeader,\n name: 'cashIn',\n display: 'Cash-in',\n width: 169,\n size: 'lg',\n editingAlign: 'right',\n input: NumberInput,\n suffix: '%',\n textStyle: boldStyle,\n inputProps: {\n decimalPlaces: 3\n }\n },\n {\n header: cashOutHeader,\n name: 'cashOut',\n display: 'Cash-out',\n width: 169,\n size: 'lg',\n editingAlign: 'right',\n input: NumberInput,\n suffix: '%',\n textStyle: boldStyle,\n inputProps: {\n decimalPlaces: 3\n }\n },\n {\n name: 'fixedFee',\n display: 'Fixed fee',\n width: 169,\n size: 'lg',\n doubleHeader: 'Cash-in only',\n textAlign: 'center',\n editingAlign: 'right',\n input: NumberInput,\n suffix: currency,\n textStyle: boldStyle,\n inputProps: {\n decimalPlaces: 2\n }\n },\n {\n name: 'minimumTx',\n display: 'Minimun Tx',\n width: 169,\n size: 'lg',\n doubleHeader: 'Cash-in only',\n textAlign: 'center',\n editingAlign: 'right',\n input: NumberInput,\n suffix: currency,\n textStyle: boldStyle,\n inputProps: {\n decimalPlaces: 2\n }\n }\n]\n\nconst overrides = (auxData, currency, auxElements) => {\n const getData = R.path(R.__, auxData)\n\n return getOverridesFields(getData, currency, auxElements)\n}\n\nconst percentMax = 100\nconst currencyMax = 9999999\nconst schema = Yup.object().shape({\n cashIn: Yup.number()\n .label('Cash-in')\n .min(0)\n .max(percentMax)\n .required(),\n cashOut: Yup.number()\n .label('Cash-out')\n .min(0)\n .max(percentMax)\n .required(),\n fixedFee: Yup.number()\n .label('Fixed Fee')\n .min(0)\n .max(currencyMax)\n .required(),\n minimumTx: Yup.number()\n .label('Minimum Tx')\n .min(0)\n .max(currencyMax)\n .required()\n})\n\nconst getAlreadyUsed = (id, machine, values) => {\n const getCrypto = R.prop('cryptoCurrencies')\n const getMachineId = R.prop('machine')\n\n const filteredOverrides = R.filter(R.propEq('machine', machine))(values)\n const originalValue = R.find(R.propEq('id', id))(values)\n\n const originalCryptos = getCrypto(originalValue)\n const originalMachineId = getMachineId(originalValue)\n\n const alreadyUsed = R.compose(\n R.uniq,\n R.flatten,\n R.map(getCrypto)\n )(filteredOverrides)\n\n if (machine !== originalMachineId) return alreadyUsed ?? []\n\n return R.difference(alreadyUsed, originalCryptos)\n}\n\nconst getOverridesSchema = (values, rawData) => {\n const getData = R.path(R.__, rawData)\n const machineData = [ALL_MACHINES].concat(getData(['machines']))\n const rawCryptos = getData(['cryptoCurrencies'])\n const cryptoData = [ALL_COINS].concat(\n R.map(it => ({ display: it.code, code: it.code }))(rawCryptos ?? [])\n )\n\n return Yup.object().shape({\n machine: Yup.string()\n .nullable()\n .label('Machine')\n .required(),\n cryptoCurrencies: Yup.array()\n .test({\n test() {\n const { id, machine, cryptoCurrencies } = this.parent\n const alreadyUsed = getAlreadyUsed(id, machine, values)\n\n const isAllMachines = machine === ALL_MACHINES.deviceId\n const isAllCoins = R.includes(ALL_COINS.code, cryptoCurrencies)\n if (isAllMachines && isAllCoins) {\n return this.createError({\n message: `All machines and all coins should be configured in the default setup table`\n })\n }\n\n const repeated = R.intersection(alreadyUsed, cryptoCurrencies)\n if (!R.isEmpty(repeated)) {\n const codes = displayCodeArray(cryptoData)(repeated)\n const machineView = getView(\n machineData,\n 'name',\n 'deviceId'\n )(machine)\n\n const message = `${codes} already overriden for machine: ${machineView}`\n\n return this.createError({ message })\n }\n return true\n }\n })\n .label('Crypto Currencies')\n .required()\n .min(1),\n cashIn: Yup.number()\n .label('Cash-in')\n .min(0)\n .max(percentMax)\n .required(),\n cashOut: Yup.number()\n .label('Cash-out')\n .min(0)\n .max(percentMax)\n .required(),\n fixedFee: Yup.number()\n .label('Fixed Fee')\n .min(0)\n .max(currencyMax)\n .required(),\n minimumTx: Yup.number()\n .label('Minimum Tx')\n .min(0)\n .max(currencyMax)\n .required()\n })\n}\n\nconst defaults = {\n cashIn: '',\n cashOut: '',\n fixedFee: '',\n minimumTx: ''\n}\n\nconst overridesDefaults = {\n machine: null,\n cryptoCurrencies: [],\n cashIn: '',\n cashOut: '',\n fixedFee: '',\n minimumTx: ''\n}\n\nconst getOrder = ({ machine, cryptoCurrencies }) => {\n const isAllMachines = machine === ALL_MACHINES.deviceId\n const isAllCoins = R.contains(ALL_COINS.code, cryptoCurrencies)\n\n if (isAllMachines && isAllCoins) return 0\n if (isAllMachines) return 1\n if (isAllCoins) return 2\n\n return 3\n}\n\nconst createCommissions = (cryptoCode, deviceId, isDefault, config) => {\n return {\n minimumTx: config.minimumTx,\n fixedFee: config.fixedFee,\n cashOut: config.cashOut,\n cashIn: config.cashIn,\n machine: deviceId,\n cryptoCurrencies: [cryptoCode],\n default: isDefault,\n id: v4()\n }\n}\n\nconst getCommissions = (cryptoCode, deviceId, config) => {\n const overrides = R.prop('overrides', config) ?? []\n\n if (!overrides && R.isEmpty(overrides)) {\n return createCommissions(cryptoCode, deviceId, true, config)\n }\n\n const specificOverride = R.find(\n it => it.machine === deviceId && _.includes(cryptoCode)(it.cryptoCurrencies)\n )(overrides)\n\n if (specificOverride !== undefined)\n return createCommissions(cryptoCode, deviceId, false, specificOverride)\n\n const machineOverride = R.find(\n it =>\n it.machine === deviceId && _.includes('ALL_COINS')(it.cryptoCurrencies)\n )(overrides)\n\n if (machineOverride !== undefined)\n return createCommissions(cryptoCode, deviceId, false, machineOverride)\n\n const coinOverride = R.find(\n it =>\n it.machine === 'ALL_MACHINES' &&\n _.includes(cryptoCode)(it.cryptoCurrencies)\n )(overrides)\n\n if (coinOverride !== undefined)\n return createCommissions(cryptoCode, deviceId, false, coinOverride)\n\n return createCommissions(cryptoCode, deviceId, true, config)\n}\n\nconst getListCommissionsSchema = () => {\n return Yup.object().shape({\n machine: Yup.string()\n .label('Machine')\n .required(),\n cryptoCurrencies: Yup.array()\n .label('Crypto Currency')\n .required()\n .min(1),\n cashIn: Yup.number()\n .label('Cash-in')\n .min(0)\n .max(percentMax)\n .required(),\n cashOut: Yup.number()\n .label('Cash-out')\n .min(0)\n .max(percentMax)\n .required(),\n fixedFee: Yup.number()\n .label('Fixed Fee')\n .min(0)\n .max(currencyMax)\n .required(),\n minimumTx: Yup.number()\n .label('Minimum Tx')\n .min(0)\n .max(currencyMax)\n .required()\n })\n}\n\nconst getTextStyle = (obj, isEditing) => {\n return { color: obj.default ? primaryColor : secondaryColorDark }\n}\n\nconst commissionsList = (auxData, currency, auxElements) => {\n const getData = R.path(R.__, auxData)\n\n return getListCommissionsFields(getData, currency, defaults)\n}\n\nconst getListCommissionsFields = (getData, currency, defaults) => {\n const machineData = [ALL_MACHINES].concat(getData(['machines']))\n\n return [\n {\n name: 'machine',\n width: 196,\n size: 'sm',\n view: getView(machineData, 'name', 'deviceId'),\n editable: false\n },\n {\n name: 'cryptoCurrencies',\n display: 'Crypto Currency',\n width: 265,\n view: R.prop(0),\n size: 'sm',\n editable: false\n },\n {\n header: cashInHeader,\n name: 'cashIn',\n display: 'Cash-in',\n width: 130,\n input: NumberInput,\n textAlign: 'right',\n suffix: '%',\n textStyle: obj => getTextStyle(obj),\n inputProps: {\n decimalPlaces: 3\n }\n },\n {\n header: cashOutHeader,\n name: 'cashOut',\n display: 'Cash-out',\n width: 130,\n input: NumberInput,\n textAlign: 'right',\n greenText: true,\n suffix: '%',\n textStyle: obj => getTextStyle(obj),\n inputProps: {\n decimalPlaces: 3\n }\n },\n {\n name: 'fixedFee',\n display: 'Fixed fee',\n width: 144,\n input: NumberInput,\n doubleHeader: 'Cash-in only',\n textAlign: 'right',\n suffix: currency,\n textStyle: obj => getTextStyle(obj),\n inputProps: {\n decimalPlaces: 2\n }\n },\n {\n name: 'minimumTx',\n display: 'Minimun Tx',\n width: 144,\n input: NumberInput,\n doubleHeader: 'Cash-in only',\n textAlign: 'right',\n suffix: currency,\n textStyle: obj => getTextStyle(obj),\n inputProps: {\n decimalPlaces: 2\n }\n }\n ]\n}\n\nexport {\n mainFields,\n overrides,\n schema,\n getOverridesSchema,\n defaults,\n overridesDefaults,\n getOrder,\n getCommissions,\n getListCommissionsSchema,\n commissionsList\n}\n","import * as R from 'ramda'\nimport React, { useState, memo } from 'react'\n\nimport { Table as EditableTable } from 'src/components/editableTable'\nimport Section from 'src/components/layout/Section'\nimport {\n mainFields,\n overrides,\n schema,\n getOverridesSchema,\n defaults,\n overridesDefaults,\n getOrder\n} from 'src/pages/Commissions/helper'\n\nconst CommissionsDetails = memo(\n ({ config, currency, data, error, save, saveOverrides }) => {\n const [isEditingDefault, setEditingDefault] = useState(false)\n const [isEditingOverrides, setEditingOverrides] = useState(false)\n\n const commission = config && !R.isEmpty(config) ? config : defaults\n const commissionOverrides = commission?.overrides ?? []\n\n const orderedCommissionsOverrides = R.sortWith([\n R.ascend(getOrder),\n R.ascend(R.prop('machine'))\n ])(commissionOverrides)\n\n const onEditingDefault = (it, editing) => setEditingDefault(editing)\n const onEditingOverrides = (it, editing) => setEditingOverrides(editing)\n\n return (\n <>\n \n
\n )\n }\n)\n\nexport default CommissionsList\n","import { useQuery, useMutation } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport TitleSection from 'src/components/layout/TitleSection'\nimport { ReactComponent as ReverseListingViewIcon } from 'src/styling/icons/circle buttons/listing-view/white.svg'\nimport { ReactComponent as ListingViewIcon } from 'src/styling/icons/circle buttons/listing-view/zodiac.svg'\nimport { ReactComponent as OverrideLabelIcon } from 'src/styling/icons/status/spring2.svg'\nimport { fromNamespace, toNamespace, namespaces } from 'src/utils/config'\n\nimport CommissionsDetails from './components/CommissionsDetails'\nimport CommissionsList from './components/CommissionsList'\n\nconst styles = {\n listViewButton: {\n marginLeft: 4\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst GET_DATA = gql`\n query getData {\n config\n cryptoCurrencies {\n code\n display\n }\n machines {\n name\n deviceId\n }\n }\n`\n\nconst SAVE_CONFIG = gql`\n mutation Save($config: JSONObject) {\n saveConfig(config: $config)\n }\n`\nconst removeCoinFromOverride = crypto => override =>\n R.mergeRight(override, {\n cryptoCurrencies: R.without([crypto], override.cryptoCurrencies)\n })\n\nconst Commissions = ({ name: SCREEN_KEY }) => {\n const classes = useStyles()\n const [showMachines, setShowMachines] = useState(false)\n const [error, setError] = useState(null)\n const { data } = useQuery(GET_DATA)\n const [saveConfig] = useMutation(SAVE_CONFIG, {\n refetchQueries: () => ['getData'],\n onError: error => setError(error)\n })\n\n const config = data?.config && fromNamespace(SCREEN_KEY)(data.config)\n const localeConfig =\n data?.config && fromNamespace(namespaces.LOCALE)(data.config)\n\n const currency = R.prop('fiatCurrency')(localeConfig)\n const overrides = R.prop('overrides')(config)\n\n const save = it => {\n const config = toNamespace(SCREEN_KEY)(it.commissions[0])\n return saveConfig({ variables: { config } })\n }\n\n const saveOverrides = it => {\n const config = toNamespace(SCREEN_KEY)(it)\n setError(null)\n return saveConfig({ variables: { config } })\n }\n\n const saveOverridesFromList = it => (_, override) => {\n const cryptoOverriden = R.path(['cryptoCurrencies', 0], override)\n\n const sameMachine = R.eqProps('machine', override)\n const notSameOverride = it => !R.eqProps('cryptoCurrencies', override, it)\n\n const filterMachine = R.filter(R.both(sameMachine, notSameOverride))\n const removeCoin = removeCoinFromOverride(cryptoOverriden)\n\n const machineOverrides = R.map(removeCoin)(filterMachine(it))\n\n const overrides = machineOverrides.concat(\n R.filter(it => !sameMachine(it), it)\n )\n\n const config = {\n commissions_overrides: R.prepend(override, overrides)\n }\n\n return saveConfig({ variables: { config } })\n }\n\n const labels = showMachines\n ? [\n {\n label: 'Override value',\n icon: \n
\n \n
\n \n
\n )\n}\n\nexport { Status, MainStatus }\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/authorize/white\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n id: \"Oval\",\n stroke: \"#FFFFFF\",\n cx: 6,\n cy: 6,\n r: 5\n}), /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-13\",\n stroke: \"#FFFFFF\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\",\n points: \"4 6.66666667 5 8 8 4\"\n}));\n\nfunction SvgWhite(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWhite);\nexport default __webpack_public_path__ + \"static/media/white.51296906.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/authorize/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-9\",\n stroke: \"#1B2559\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n id: \"Oval\",\n cx: 6,\n cy: 6,\n r: 5\n})), /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-13\",\n stroke: \"#1B2559\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\",\n points: \"4 6.66666667 5 8 8 4\"\n}));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.2fe856d5.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/cancel/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-5\",\n stroke: \"#1B2559\",\n strokeWidth: 1.2\n}, /*#__PURE__*/React.createElement(\"line\", {\n x1: 12,\n y1: 0,\n x2: 0,\n y2: 12,\n id: \"Stroke-1\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 0,\n y1: 0,\n x2: 12,\n y2: 12,\n id: \"Stroke-3\"\n})));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.3b13c0b7.svg\";\nexport { ForwardRef as ReactComponent };","import { white, tomato, spring4, comet } from 'src/styling/variables'\n\nconst propertyCardStyles = {\n label1: {\n display: 'flex',\n marginBottom: 2,\n marginTop: 'auto',\n width: 85\n },\n label1Pending: {\n color: comet\n },\n label1Rejected: {\n color: tomato\n },\n label1Accepted: {\n color: spring4\n },\n cardActionButton: {\n display: 'flex',\n height: 28,\n marginRight: 'auto',\n marginLeft: 12\n },\n propertyCardTopRow: {\n display: 'flex',\n margin: [[0, 10, 5, 0]]\n },\n propertyCardBottomRow: {\n display: 'flex',\n flexDirection: 'row',\n height: 45\n },\n propertyCard: {\n display: 'flex',\n flexDirection: 'column',\n borderRadius: 8,\n width: '100%',\n height: 100,\n padding: [[20]],\n boxSizing: 'border-box',\n boxShadow: '0 0 8px 0 rgba(0, 0, 0, 0.04)',\n border: 'solid 0',\n backgroundColor: white,\n margin: [[20, 0, 0, 0]]\n },\n rowSpaceBetween: {\n display: 'flex',\n flexFlow: 'row nowrap',\n alignItems: 'center',\n justifyContent: 'space-between'\n },\n columnSpaceBetween: {\n display: 'flex',\n flexFlow: 'column nowrap',\n alignItems: 'center',\n justifyContent: 'space-between',\n width: 90\n },\n buttonsWrapper: {\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'flex-end',\n marginLeft: 'auto',\n marginTop: 'auto'\n }\n}\n\nexport { propertyCardStyles }\n","import { Paper } from '@material-ui/core'\nimport { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport React, { memo } from 'react'\n\nimport { MainStatus } from 'src/components/Status'\nimport { ActionButton } from 'src/components/buttons'\nimport { H3 } from 'src/components/typography'\nimport { ReactComponent as AuthorizeReversedIcon } from 'src/styling/icons/button/authorize/white.svg'\nimport { ReactComponent as AuthorizeIcon } from 'src/styling/icons/button/authorize/zodiac.svg'\nimport { ReactComponent as RejectReversedIcon } from 'src/styling/icons/button/cancel/white.svg'\nimport { ReactComponent as RejectIcon } from 'src/styling/icons/button/cancel/zodiac.svg'\n\nimport { propertyCardStyles } from './PropertyCard.styles'\n\nconst useStyles = makeStyles(propertyCardStyles)\n\nconst OVERRIDE_PENDING = 'automatic'\nconst OVERRIDE_AUTHORIZED = 'verified'\nconst OVERRIDE_REJECTED = 'blocked'\n\nconst PropertyCard = memo(\n ({ className, title, state, authorize, reject, children }) => {\n const classes = useStyles()\n\n const label1ClassNames = {\n [classes.label1]: true,\n [classes.label1Pending]: state === OVERRIDE_PENDING,\n [classes.label1Rejected]: state === OVERRIDE_REJECTED,\n [classes.label1Accepted]: state === OVERRIDE_AUTHORIZED\n }\n\n const AuthorizeButton = () => (\n {title}
\n\n
\n \n )\n }\n)\n\nexport {\n PropertyCard,\n OVERRIDE_PENDING,\n OVERRIDE_AUTHORIZED,\n OVERRIDE_REJECTED\n}\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/block/white\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-5\",\n stroke: \"#FFFFFF\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n id: \"Oval\",\n cx: 6,\n cy: 6,\n r: 5\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 9,\n y1: 3,\n x2: 3,\n y2: 9,\n id: \"Stroke-3\"\n})));\n\nfunction SvgWhite(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWhite);\nexport default __webpack_public_path__ + \"static/media/white.e72682b5.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/block/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-5\",\n stroke: \"#1B2559\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n id: \"Oval\",\n cx: 6,\n cy: 6,\n r: 5\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 9,\n y1: 3,\n x2: 3,\n y2: 9,\n id: \"Stroke-3\"\n})));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.bb7722c5.svg\";\nexport { ForwardRef as ReactComponent };","import { comet } from 'src/styling/variables'\n\nexport default {\n labelLink: {\n cursor: 'pointer',\n color: comet\n },\n breadcrumbs: {\n margin: [[20, 0]]\n },\n actionLabel: {\n color: comet,\n margin: [[4, 0]]\n },\n customerDetails: {\n marginBottom: 18\n }\n}\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/sf-small/search/white\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M15.8635238,8.17028571 C15.8635238,12.4198095 12.4187619,15.8645714 8.1692381,15.8645714 C3.92066667,15.8645714 0.475904762,12.4198095 0.475904762,8.17028571 C0.475904762,3.9207619 3.92066667,0.476 8.1692381,0.476 C12.4187619,0.476 15.8635238,3.9207619 15.8635238,8.17028571 Z\",\n id: \"Stroke-1\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 13.7035238,\n y1: 13.7046667,\n x2: 19.4844762,\n y2: 19.485619,\n id: \"Stroke-3\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2,\n strokeLinecap: \"round\"\n}));\n\nfunction SvgWhite(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"20px\",\n height: \"20px\",\n viewBox: \"0 0 20 20\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWhite);\nexport default __webpack_public_path__ + \"static/media/white.e8851a0a.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/sf-small/search/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M15.8635238,8.17028571 C15.8635238,12.4198095 12.4187619,15.8645714 8.1692381,15.8645714 C3.92066667,15.8645714 0.475904762,12.4198095 0.475904762,8.17028571 C0.475904762,3.9207619 3.92066667,0.476 8.1692381,0.476 C12.4187619,0.476 15.8635238,3.9207619 15.8635238,8.17028571 Z\",\n id: \"Stroke-1\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 13.7035238,\n y1: 13.7046667,\n x2: 19.4844762,\n y2: 19.485619,\n id: \"Stroke-3\",\n stroke: \"#1B2559\",\n strokeWidth: 2,\n strokeLinecap: \"round\"\n}));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"20px\",\n height: \"20px\",\n viewBox: \"0 0 20 20\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.91792e22.svg\";\nexport { ForwardRef as ReactComponent };","import { makeStyles, ClickAwayListener } from '@material-ui/core'\nimport classnames from 'classnames'\nimport React, { memo, useState } from 'react'\n\nimport Popper from 'src/components/Popper'\nimport { FeatureButton } from 'src/components/buttons'\nimport { ReactComponent as ZoomIconInverse } from 'src/styling/icons/circle buttons/search/white.svg'\nimport { ReactComponent as ZoomIcon } from 'src/styling/icons/circle buttons/search/zodiac.svg'\n\nimport imagePopperStyles from './ImagePopper.styles'\n\nconst useStyles = makeStyles(imagePopperStyles)\n\nconst ImagePopper = memo(\n ({ className, width, height, popupWidth, popupHeight, src }) => {\n const classes = useStyles({\n width,\n height,\n popupWidth,\n popupHeight\n })\n const [popperAnchorEl, setPopperAnchorEl] = useState(null)\n\n const handleOpenPopper = event => {\n setPopperAnchorEl(popperAnchorEl ? null : event.currentTarget)\n }\n\n const handleClosePopper = () => {\n setPopperAnchorEl(null)\n }\n\n const popperOpen = Boolean(popperAnchorEl)\n\n const Image = ({ className }) => (\n \n
\n {children}\n \n {authorize && state !== OVERRIDE_AUTHORIZED && AuthorizeButton()}\n {reject && state !== OVERRIDE_REJECTED && RejectButton()}\n
\n \n \n \n
\n \n
\n \n
\n )}\n \n )\n}\n\nconst ComplianceDetails = ({ customer, updateCustomer }) => {\n const classes = useStyles({ width: imageWidth })\n\n const sanctions = R.path(['sanctions'])(customer)\n const sanctionsAt = R.path(['sanctionsAt'])(customer)\n const sanctionsDisplay = !sanctionsAt\n ? 'Not checked yet'\n : sanctions\n ? 'Passed'\n : 'Failed'\n\n return (\n \n
\n )\n}\n\nexport default ComplianceDetails\n","const complianceDetailsStyles = {\n complianceDetailsGrid: {\n display: 'flex',\n flexDirection: 'row'\n },\n firstColumn: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n marginRight: 10\n },\n lastColumn: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n marginLeft: 10\n },\n photoWrapper: ({ width }) => ({\n display: 'flex',\n justifyContent: 'center',\n width\n })\n}\n\nexport { complianceDetailsStyles }\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/ID/card/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-2\",\n stroke: \"#1B2559\",\n strokeWidth: 1.6\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"id-copy\"\n}, /*#__PURE__*/React.createElement(\"polygon\", {\n id: \"Stroke-1\",\n points: \"0 16 22 16 22 0 0 0\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 11.7857143,\n y1: 4,\n x2: 18.8571429,\n y2: 4,\n id: \"Stroke-3\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 11.7857143,\n y1: 7.2,\n x2: 18.8571429,\n y2: 7.2,\n id: \"Stroke-4\"\n}), /*#__PURE__*/React.createElement(\"polygon\", {\n id: \"Stroke-5\",\n points: \"3.14285714 11.2 8.64285714 11.2 8.64285714 4 3.14285714 4\"\n}))));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"22px\",\n height: \"16px\",\n viewBox: \"0 0 22 16\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.05a22c3a.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/sf-small/law/white\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"bevel\"\n}, /*#__PURE__*/React.createElement(\"line\", {\n x1: 8.4141,\n y1: 7.4648,\n x2: 14.0711,\n y2: 1.8078,\n id: \"Stroke-1\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 12.6568,\n y1: 0.3936,\n x2: 15.4858,\n y2: 3.2216,\n id: \"Stroke-3\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 7,\n y1: 6.0498,\n x2: 9.829,\n y2: 8.8788,\n id: \"Stroke-6\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 11.2427,\n y1: 4.6357,\n x2: 19.2427,\n y2: 12.6357,\n id: \"Stroke-7\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 3,\n y1: 16.5,\n x2: 10,\n y2: 16.5,\n id: \"Stroke-9\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 0,\n y1: 19.5,\n x2: 13,\n y2: 19.5,\n id: \"Stroke-10\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2\n}));\n\nfunction SvgWhite(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"20px\",\n height: \"20px\",\n viewBox: \"0 0 20 20\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWhite);\nexport default __webpack_public_path__ + \"static/media/white.06f073be.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/sf-small/law/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"bevel\"\n}, /*#__PURE__*/React.createElement(\"line\", {\n x1: 8.4141,\n y1: 7.4648,\n x2: 14.0711,\n y2: 1.8078,\n id: \"Stroke-1\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 12.6568,\n y1: 0.3936,\n x2: 15.4858,\n y2: 3.2216,\n id: \"Stroke-3\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 7,\n y1: 6.0498,\n x2: 9.829,\n y2: 8.8788,\n id: \"Stroke-6\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 11.2427,\n y1: 4.6357,\n x2: 19.2427,\n y2: 12.6357,\n id: \"Stroke-7\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 3,\n y1: 16.5,\n x2: 10,\n y2: 16.5,\n id: \"Stroke-9\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 0,\n y1: 19.5,\n x2: 13,\n y2: 19.5,\n id: \"Stroke-10\",\n stroke: \"#1B2559\",\n strokeWidth: 2\n}));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"20px\",\n height: \"20px\",\n viewBox: \"0 0 20 20\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.96d45453.svg\";\nexport { ForwardRef as ReactComponent };","import typographyStyles from 'src/components/typography/styles'\nimport baseStyles from 'src/pages/Logs.styles'\nimport { zircon, comet, primaryColor, fontSize4 } from 'src/styling/variables'\n\nconst { label1 } = typographyStyles\nconst { titleWrapper, titleAndButtonsContainer } = baseStyles\n\nexport default {\n titleWrapper,\n titleAndButtonsContainer,\n row: {\n display: 'flex',\n flexFlow: 'row nowrap'\n },\n rowSpaceBetween: {\n display: 'flex',\n flexFlow: 'row nowrap',\n alignItems: 'center',\n justifyContent: 'space-between'\n },\n column: {\n display: 'flex',\n flexFlow: 'column nowrap',\n width: '100%',\n height: '100%',\n justifyContent: 'space-between'\n },\n textInput: {\n width: 144\n },\n p: {\n fontFamily: 'MuseoSans',\n fontSize: fontSize4,\n fontWeight: 500,\n fontStretch: 'normal',\n fontStyle: 'normal',\n lineHeight: 1.14,\n letterSpacing: 'normal',\n color: primaryColor\n },\n txId: {\n fontFamily: 'MuseoSans',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis'\n },\n txClassIconLeft: {\n marginRight: 11\n },\n txClassIconRight: {\n marginLeft: 11\n },\n headerLabels: {\n display: 'flex',\n flexDirection: 'row',\n '& div': {\n display: 'flex',\n alignItems: 'center'\n },\n '& > div:first-child': {\n marginRight: 24\n },\n '& span': {\n extend: label1,\n marginLeft: 6\n }\n },\n photo: {\n width: 92,\n height: 92,\n borderRadius: 8,\n backgroundColor: zircon,\n margin: [[0, 28, 0, 0]],\n alignItems: 'center',\n justifyContent: 'center',\n display: 'flex'\n },\n img: {\n width: 80\n },\n customerName: {\n marginBottom: 32\n },\n icon: {\n marginRight: 11\n },\n name: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center'\n },\n value: {\n height: 16\n },\n label: {\n marginBottom: 4,\n color: comet\n },\n idIcon: {\n marginRight: 10\n },\n subpageButton: {\n marginLeft: 16\n }\n}\n","import { parsePhoneNumberFromString } from 'libphonenumber-js'\nimport * as R from 'ramda'\n\nconst CUSTOMER_BLOCKED = 'blocked'\n\nconst getAuthorizedStatus = it =>\n it.authorizedOverride === CUSTOMER_BLOCKED\n ? { label: 'Blocked', type: 'error' }\n : it.daysSuspended > 0\n ? { label: `${it.daysSuspended} day suspension`, type: 'warning' }\n : { label: 'Authorized', type: 'success' }\n\nconst getFormattedPhone = (phone, country) => {\n const phoneNumber =\n phone && country ? parsePhoneNumberFromString(phone, country) : null\n\n return phoneNumber ? phoneNumber.formatInternational() : phone\n}\n\nconst getName = it => {\n const idData = R.path(['idCardData'])(it)\n\n return `${R.path(['firstName'])(idData) ?? ''} ${R.path(['lastName'])(\n idData\n ) ?? ''}`.trim()\n}\n\nexport { getAuthorizedStatus, getFormattedPhone, getName }\n","import { Paper } from '@material-ui/core'\nimport { makeStyles } from '@material-ui/core/styles'\nimport React, { memo } from 'react'\n\nimport { ReactComponent as CrossedCameraIcon } from 'src/styling/icons/ID/photo/crossed-camera.svg'\nimport { URI } from 'src/utils/apollo'\n\nimport mainStyles from '../CustomersList.styles'\n\nconst useStyles = makeStyles(mainStyles)\n\nconst FrontCameraPhoto = memo(({ frontCameraPath }) => {\n const classes = useStyles()\n\n return (\n Compliance details
\n\n \n \n \n updateCustomer({ idCardPhotoOverride: OVERRIDE_AUTHORIZED })\n }\n reject={() =>\n updateCustomer({ idCardPhotoOverride: OVERRIDE_REJECTED })\n }>\n \n updateCustomer({ frontCameraOverride: OVERRIDE_AUTHORIZED })\n }\n reject={() =>\n updateCustomer({ frontCameraOverride: OVERRIDE_REJECTED })\n }>\n \n \n \n updateCustomer({ usSsnOverride: OVERRIDE_AUTHORIZED })\n }\n reject={() =>\n updateCustomer({ usSsnOverride: OVERRIDE_REJECTED })\n }>\n \n updateCustomer({ sanctionsOverride: OVERRIDE_AUTHORIZED })\n }\n reject={() =>\n updateCustomer({ sanctionsOverride: OVERRIDE_REJECTED })\n }>\n {sanctionsDisplay} \n \n \n \n
\n \n \n Compliance details\n \n
\n \n {name.length\n ? name\n : getFormattedPhone(R.path(['phone'])(customer), locale.country)}\n
\nTransactions
\n\n
\n {hasData && \n
\n \n {loading\n ? 'Loading'\n : hasData\n ? 'All transactions from this customer'\n : 'No transactions so far'}\n
\n\n \n setShowCompliance(!showCompliance)}\n />\n {!loading && !customerData.isAnonymous && (\n
\n {!showCompliance && (\n \n Actions \n \n updateCustomer({\n authorizedOverride: blocked\n ? OVERRIDE_AUTHORIZED\n : OVERRIDE_REJECTED\n })\n }>\n {`${blocked ? 'Authorize' : 'Block'} customer`}\n \n
\n )}\n \n \n
\n \n {` ${cashIn} ${localeFiatCurrency}`} \n
\n \n {` ${cashOut} ${localeFiatCurrency}`} \n
\n \n \n \n {R.keys(withCommissions).map(key => renderFooterItem(key))}\n \n \n
\n \n \n )\n}\n\nexport default Footer\n","import Footer from './Footer'\nexport default Footer\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/label/icon/down\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-6\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n id: \"Oval\",\n fill: \"#FFECEB\",\n cx: 6,\n cy: 6,\n r: 6\n}), /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-5\",\n transform: \"translate(6.096194, 6.096194) rotate(-315.000000) translate(-6.096194, -6.096194) translate(2.596194, 3.096194)\",\n stroke: \"#FF584A\"\n}, /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Path-2\",\n points: \"3.15780333 -4.54747351e-13 6.15780333 2.82998193 3.15780333 5.65996386\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 5.42178888,\n y1: 2.82998193,\n x2: -5.45696821e-13,\n y2: 2.82998193,\n id: \"Path-3\"\n}))));\n\nfunction SvgDown(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgDown);\nexport default __webpack_public_path__ + \"static/media/down.919a0c2a.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/label/icon/equal\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-6\",\n fill: \"#EBEFFF\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n id: \"Oval\",\n cx: 6,\n cy: 6,\n r: 6\n})), /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group\",\n transform: \"translate(4.000000, 4.000000)\",\n stroke: \"#5F668A\",\n strokeLinecap: \"square\"\n}, /*#__PURE__*/React.createElement(\"line\", {\n x1: 0,\n y1: 1,\n x2: 4,\n y2: 1,\n id: \"Line-12\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 0,\n y1: 3,\n x2: 4,\n y2: 3,\n id: \"Line-12\"\n})));\n\nfunction SvgEqual(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgEqual);\nexport default __webpack_public_path__ + \"static/media/equal.f4103789.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/label/icon/up\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-6\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n id: \"Oval\",\n fill: \"#ECFBEF\",\n cx: 6,\n cy: 6,\n r: 6\n}), /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-5\",\n transform: \"translate(6.096194, 6.096194) rotate(-45.000000) translate(-6.096194, -6.096194) translate(2.596194, 3.096194)\",\n stroke: \"#00CD5A\"\n}, /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Path-2\",\n points: \"3.15780333 -4.54747351e-13 6.15780333 2.82998193 3.15780333 5.65996386\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 5.42178888,\n y1: 2.82998193,\n x2: -5.45696821e-13,\n y2: 2.82998193,\n id: \"Path-3\"\n}))));\n\nfunction SvgUp(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgUp);\nexport default __webpack_public_path__ + \"static/media/up.bcdf0fc7.svg\";\nexport { ForwardRef as ReactComponent };","import { makeStyles } from '@material-ui/core'\nimport classnames from 'classnames'\nimport React from 'react'\n\nimport { Label1 } from 'src/components/typography/index'\nimport { java, neon, white } from 'src/styling/variables'\n\nconst styles = {\n wrapper: {\n display: 'flex',\n height: 130,\n marginTop: -8\n },\n percentageBox: {\n height: 130,\n borderRadius: 4,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n whiteSpace: 'pre'\n },\n label: {\n color: white\n },\n inColor: {\n backgroundColor: java\n },\n outColor: {\n backgroundColor: neon\n },\n other: {\n minWidth: '6px',\n borderRadius: 2\n },\n inWidth: {\n width: value => `${value}%`\n },\n outWidth: {\n width: value => `${100 - value}%`,\n marginRight: 4\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst PercentageChart = ({ cashIn, cashOut }) => {\n const value = cashIn || cashOut !== 0 ? cashIn : 50\n const classes = useStyles(value)\n\n const buildPercentageView = value => {\n if (value <= 15) return\n return \n \n {buildPercentageView(100 - value, 'cashOut')}\n
\n \n
\n \n )\n}\n\nexport default Nav\n","import { useQuery } from '@apollo/react-hooks'\nimport Grid from '@material-ui/core/Grid'\nimport { makeStyles } from '@material-ui/core/styles'\nimport BigNumber from 'bignumber.js'\nimport classnames from 'classnames'\nimport gql from 'graphql-tag'\nimport moment from 'moment'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport { Label1, Label2 } from 'src/components/typography/index'\nimport { ReactComponent as PercentDownIcon } from 'src/styling/icons/dashboard/down.svg'\nimport { ReactComponent as PercentNeutralIcon } from 'src/styling/icons/dashboard/equal.svg'\nimport { ReactComponent as PercentUpIcon } from 'src/styling/icons/dashboard/up.svg'\nimport { fromNamespace } from 'src/utils/config'\n\nimport PercentageChart from './Graphs/PercentageChart'\nimport LineChart from './Graphs/RefLineChart'\nimport Scatterplot from './Graphs/RefScatterplot'\nimport InfoWithLabel from './InfoWithLabel'\nimport Nav from './Nav'\nimport styles from './SystemPerformance.styles'\n\nBigNumber.config({ ROUNDING_MODE: BigNumber.ROUND_HALF_UP })\n\nconst getFiats = R.map(R.prop('fiat'))\nconst useStyles = makeStyles(styles)\nconst mapToFee = R.map(R.prop('cashInFee'))\n\nconst getDateSecondsAgo = (seconds = 0, startDate = null) => {\n const date = startDate ? moment(startDate) : moment()\n return date.subtract(seconds, 'second')\n}\n\nconst ranges = {\n Day: {\n left: getDateSecondsAgo(2 * 24 * 3600, moment()),\n right: getDateSecondsAgo(24 * 3600, moment())\n },\n Week: {\n left: getDateSecondsAgo(14 * 24 * 3600, moment()),\n right: getDateSecondsAgo(7 * 24 * 3600, moment())\n },\n Month: {\n left: getDateSecondsAgo(60 * 24 * 3600, moment()),\n right: getDateSecondsAgo(30 * 24 * 3600, moment())\n }\n}\n\nconst GET_DATA = gql`\n query getData {\n transactions {\n fiatCode\n fiat\n cashInFee\n commissionPercentage\n created\n txClass\n error\n }\n fiatRates {\n code\n name\n rate\n }\n config\n }\n`\n\nconst reducer = (acc, it) =>\n (acc +=\n Number.parseFloat(it.commissionPercentage) * Number.parseFloat(it.fiat))\n\nconst SystemPerformance = () => {\n const classes = useStyles()\n const [selectedRange, setSelectedRange] = useState('Day')\n const { data, loading } = useQuery(GET_DATA)\n const fiatLocale = fromNamespace('locale')(data?.config).fiatCurrency\n\n const isInRangeAndNoError = getLastTimePeriod => t => {\n if (t.error !== null) return false\n if (!getLastTimePeriod) {\n return (\n t.error === null &&\n moment(t.created).isBetween(ranges[selectedRange].right, moment())\n )\n }\n return (\n t.error === null &&\n moment(t.created).isBetween(\n ranges[selectedRange].left,\n ranges[selectedRange].right\n )\n )\n }\n\n const convertFiatToLocale = item => {\n if (item.fiatCode === fiatLocale) return item\n const itemRate = R.find(R.propEq('code', item.fiatCode))(data.fiatRates)\n const localeRate = R.find(R.propEq('code', fiatLocale))(data.fiatRates)\n const multiplier = localeRate.rate / itemRate.rate\n return { ...item, fiat: parseFloat(item.fiat) * multiplier }\n }\n\n const transactionsToShow = R.map(convertFiatToLocale)(\n R.filter(isInRangeAndNoError(false), data?.transactions ?? [])\n )\n const transactionsLastTimePeriod = R.map(convertFiatToLocale)(\n R.filter(isInRangeAndNoError(true), data?.transactions ?? [])\n )\n\n const getNumTransactions = () => {\n return R.length(transactionsToShow)\n }\n\n const getFiatVolume = () =>\n new BigNumber(R.sum(getFiats(transactionsToShow))).toFormat(2)\n\n const getProfit = transactions => {\n const cashInFees = R.sum(mapToFee(transactions))\n const commissionFees = R.reduce(reducer, 0, transactions)\n\n return new BigNumber(commissionFees + cashInFees)\n }\n\n const getPercentChange = () => {\n const thisTimePeriodProfit = getProfit(transactionsToShow)\n const previousTimePeriodProfit = getProfit(transactionsLastTimePeriod)\n\n if (thisTimePeriodProfit.eq(previousTimePeriodProfit)) return 0\n if (previousTimePeriodProfit.eq(0)) return 100\n\n return thisTimePeriodProfit\n .minus(previousTimePeriodProfit)\n .times(100)\n .div(previousTimePeriodProfit)\n .toNumber()\n }\n\n const getDirectionPercent = () => {\n const [cashIn, cashOut] = R.partition(R.propEq('txClass', 'cashIn'))(\n transactionsToShow\n )\n const totalLength = cashIn.length + cashOut.length\n if (totalLength === 0) {\n return { cashIn: 0, cashOut: 0 }\n }\n\n return {\n cashIn: Math.round((cashIn.length / totalLength) * 100),\n cashOut: Math.round((cashOut.length / totalLength) * 100)\n }\n }\n\n const percentChange = getPercentChange()\n\n const percentageClasses = {\n [classes.percentDown]: percentChange < 0,\n [classes.percentUp]: percentChange > 0,\n [classes.percentNeutral]: percentChange === 0\n }\n\n const getPercentageIcon = () => {\n if (percentChange === 0)\n return \n
\n {'System performance'}
\n\n {ranges.map((it, idx) => {\n return (\n handleClick(e.target.innerText)}\n className={\n isSelected(it)\n ? classnames(classes.newHighlightedLabel, classes.navButton)\n : classnames(classes.label, classes.navButton)\n }>\n {it}\n
\n )\n })}\n \n
\n \n {`${getProfit(transactionsToShow).toFormat(2)} ${\n data?.config.locale_fiatCurrency\n }`}\n
\n \n {getPercentageIcon()}\n {`${new BigNumber(percentChange).toFormat(2)}%`}\n
\n \n
\n - \n {alertsToRender.map((alert, idx) => {\n return (\n
{`${alert.message}${alert.detail\n .deviceId && ' - ' + machines[alert.detail.deviceId]}`}
\n\n \n \n {'Show less'}\n \n \n )}\n
\n {`Alerts (${alertsLength})`}
\n {showAllItems && (\n\n \n \n {'Show less'}\n \n \n )}\n
\n {!loading && (\n <>\n System status
{' '}\n {showAllItems && (\n\n \n \n {buttonName}\n \n \n
\n )\n}\n\nconst RightSide = () => {\n const classes = useStyles()\n const [systemStatusSize, setSystemStatusSize] = useState(cardState.DEFAULT)\n const [alertsSize, setAlertsSize] = useState(cardState.DEFAULT)\n\n const onReset = () => {\n setAlertsSize(cardState.DEFAULT)\n setSystemStatusSize(cardState.DEFAULT)\n }\n return (\n {title}
\n\n <>\n {\n setAlertsSize(cardState.EXPANDED)\n setSystemStatusSize(cardState.SHRUNK)\n }}\n onReset={onReset}\n size={alertsSize}\n />\n \n {\n setSystemStatusSize(cardState.EXPANDED)\n setAlertsSize(cardState.SHRUNK)\n }}\n onReset={onReset}\n size={systemStatusSize}\n />\n \n \n
\n \n \n
\n \n
\n \n \n \n \n \n \n \n \n
\n \n \n )\n}\n\nexport default Dashboard\n","import Dashboard from './Dashboard'\nexport default Dashboard\n","import { makeStyles } from '@material-ui/styles'\nimport classnames from 'classnames'\nimport React from 'react'\n\nimport { Label1 } from './typography'\n\nconst useStyles = makeStyles({\n wrapper: {\n display: 'flex',\n alignItems: 'center'\n },\n colorIndicator: {\n borderRadius: 3,\n height: 12,\n width: 12,\n marginRight: 8\n }\n})\n\nconst TableLabel = ({ className, label, color, ...props }) => {\n const classes = useStyles()\n return (\n \n {color && (\n {label} \n
\n )\n}\n\nexport default TableLabel\n","import typographyStyles from 'src/components/typography/styles'\nimport {\n disabledColor2,\n spacer,\n subheaderColor,\n errorColor,\n placeholderColor,\n comet\n} from 'src/styling/variables'\n\nconst { label1, mono } = typographyStyles\n\nexport default {\n wrapper: {\n display: 'flex',\n flex: 1,\n flexDirection: 'row',\n height: '100%'\n },\n main: {\n display: 'flex',\n flex: 1\n },\n firstSide: {\n margin: `0 ${spacer * 8}px 0 ${spacer * 6}px`\n },\n secondSide: {\n marginTop: -29\n },\n error: {\n color: errorColor\n },\n coinTotal: {\n margin: `${spacer * 1.5}px 0`\n },\n leftSpacer: {\n marginLeft: spacer\n },\n topSpacer: {\n marginTop: spacer * 5\n },\n addressWrapper: {\n display: 'flex',\n flexDirection: 'column',\n flex: 1,\n backgroundColor: subheaderColor\n },\n address: {\n width: 375,\n margin: `${spacer * 1.5}px ${spacer * 3}px`\n },\n itemWrapper: {\n textAlign: 'end'\n },\n item: {\n extend: label1,\n margin: 2\n },\n inactiveItem: {\n color: comet\n },\n firstItem: {\n fontWeight: 700,\n margin: 2\n },\n total: {\n marginTop: 'auto',\n textAlign: 'right',\n marginRight: 24\n },\n totalPending: {\n marginTop: 2\n },\n totalTitle: {\n color: placeholderColor,\n marginBottom: 2\n },\n table: {\n marginTop: spacer,\n marginLeft: spacer * 6\n },\n tableLabel: {\n justifyContent: 'end',\n marginTop: -38\n },\n pending: {\n backgroundColor: disabledColor2\n },\n copyToClipboard: {\n marginLeft: 'auto',\n paddingTop: 6,\n paddingLeft: 15,\n marginRight: -11\n },\n mono: {\n extend: mono,\n width: 375,\n margin: `${spacer * 1.5}px ${spacer * 3}px`\n }\n}\n","import { useQuery } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core/styles'\nimport BigNumber from 'bignumber.js'\nimport classnames from 'classnames'\nimport gql from 'graphql-tag'\nimport moment from 'moment'\nimport QRCode from 'qrcode.react'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport TableLabel from 'src/components/TableLabel'\nimport Title from 'src/components/Title'\nimport { Tr, Td, THead, TBody, Table } from 'src/components/fake-table/Table'\nimport Sidebar from 'src/components/layout/Sidebar'\nimport {\n H3,\n Info1,\n Info2,\n Info3,\n Label1,\n Label3\n} from 'src/components/typography'\nimport CopyToClipboard from 'src/pages/Transactions/CopyToClipboard'\nimport { primaryColor } from 'src/styling/variables'\nimport { formatCryptoAddress } from 'src/utils/coin'\n\nimport styles from './Funding.styles'\n\nconst useStyles = makeStyles(styles)\nconst sizes = {\n big: 165,\n time: 140,\n date: 130\n}\n\nconst GET_FUNDING = gql`\n {\n funding {\n cryptoCode\n errorMsg\n fundingAddress\n fundingAddressUrl\n confirmedBalance\n pending\n fiatConfirmedBalance\n fiatPending\n fiatCode\n display\n unitScale\n }\n }\n`\n\nconst formatAddress = (cryptoCode = '', address = '') =>\n formatCryptoAddress(cryptoCode, address).replace(/(.{4})/g, '$1 ')\nconst sumReducer = (acc, value) => acc.plus(value)\nconst formatNumber = it => new BigNumber(it).toFormat(2)\n\nconst getConfirmedTotal = list => {\n return formatNumber(\n list\n .filter(it => !it.errorMsg)\n .map(it => new BigNumber(it.fiatConfirmedBalance))\n .reduce(sumReducer, new BigNumber(0))\n )\n}\n\nconst getPendingTotal = list => {\n return formatNumber(\n list\n .filter(it => !it.errorMsg)\n .map(it => new BigNumber(it.fiatPending))\n .reduce(sumReducer, new BigNumber(0))\n )\n}\n\nconst Funding = () => {\n const [selected, setSelected] = useState(null)\n const [viewHistory] = useState(false)\n const classes = useStyles()\n const fundingHistory = [\n {\n cryptoAmount: 2.0,\n balance: 10.23,\n fiatValue: 1000.0,\n date: new Date(),\n performedBy: null,\n pending: true\n },\n {\n cryptoAmount: 10.0,\n balance: 12.23,\n fiatValue: 12000.0,\n date: new Date(),\n performedBy: null\n },\n {\n cryptoAmount: 5.0,\n balance: 5.0,\n fiatValue: 50000.0,\n date: new Date(),\n performedBy: null\n }\n ]\n\n const isSelected = it => {\n return selected && selected.cryptoCode === it.cryptoCode\n }\n\n const { data: fundingResponse } = useQuery(GET_FUNDING)\n const funding = R.path(['funding'])(fundingResponse) ?? []\n\n if (funding.length && !selected) {\n setSelected(funding[0])\n }\n\n const itemRender = (it, active) => {\n const itemClass = {\n [classes.item]: true,\n [classes.inactiveItem]: !active\n }\n const wrapperClass = {\n [classes.itemWrapper]: true,\n [classes.error]: it.errorMsg\n }\n\n return (\n \n
\n )\n }\n\n const pendingTotal = getPendingTotal(funding)\n const signIfPositive = num => (num >= 0 ? '+' : '')\n\n return (\n <>\n {it.display}
\n {!it.errorMsg && (\n <>\n \n {formatNumber(it.fiatConfirmedBalance)} {it.fiatCode}\n
\n \n {it.confirmedBalance} {it.cryptoCode}\n
\n \n )}\n \n Funding \n {/* */}\n
\n \n it.display}\n itemRender={itemRender}>\n {funding.length && (\n
\n \n )\n}\n\nexport default Funding\n","import * as R from 'ramda'\r\n\r\nconst secretTest = secret => ({\r\n test(val) {\r\n if (R.isNil(secret) && R.isNil(val)) {\r\n return this.createError()\r\n }\r\n return true\r\n }\r\n})\r\n\r\nexport default secretTest\r\n","import * as Yup from 'yup'\n\nimport {\n TextInput,\n SecretInput,\n Autocomplete\n} from 'src/components/inputs/formik'\n\nimport secretTest from './helper'\n\nconst isDefined = it => it && it.length\n\nconst buildTestValidation = (id, passphrase) => {\n return Yup.string()\n .max(100, 'Too long')\n .when(id, {\n is: isDefined,\n then: Yup.string().test(secretTest(passphrase))\n })\n}\n\nexport default {\n code: 'bitgo',\n name: 'BitGo',\n title: 'BitGo (Wallet)',\n elements: [\n {\n code: 'token',\n display: 'API Token',\n component: TextInput,\n face: true,\n long: true\n },\n {\n code: 'environment',\n display: 'Environment',\n component: Autocomplete,\n inputProps: {\n options: [\n { code: 'prod', display: 'prod' },\n { code: 'test', display: 'test' }\n ],\n labelProp: 'display',\n valueProp: 'code'\n },\n face: true\n },\n {\n code: 'BTCWalletId',\n display: 'BTC Wallet ID',\n component: TextInput\n },\n {\n code: 'BTCWalletPassphrase',\n display: 'BTC Wallet Passphrase',\n component: SecretInput\n },\n {\n code: 'LTCWalletId',\n display: 'LTC Wallet ID',\n component: TextInput\n },\n {\n code: 'LTCWalletPassphrase',\n display: 'LTC Wallet Passphrase',\n component: SecretInput\n },\n {\n code: 'ZECWalletId',\n display: 'ZEC Wallet ID',\n component: TextInput\n },\n {\n code: 'ZECWalletPassphrase',\n display: 'ZEC Wallet Passphrase',\n component: SecretInput\n },\n {\n code: 'BCHWalletId',\n display: 'BCH Wallet ID',\n component: TextInput\n },\n {\n code: 'BCHWalletPassphrase',\n display: 'BCH Wallet Passphrase',\n component: SecretInput\n },\n {\n code: 'DASHWalletId',\n display: 'DASH Wallet ID',\n component: TextInput\n },\n {\n code: 'DASHWalletPassphrase',\n display: 'DASH Wallet Passphrase',\n component: SecretInput\n }\n ],\n getValidationSchema: account => {\n return Yup.object().shape({\n token: Yup.string()\n .max(100, 'Too long')\n .required(),\n BTCWalletId: Yup.string().max(100, 'Too long'),\n BTCWalletPassphrase: buildTestValidation(\n 'BTCWalletId',\n account?.BTCWalletPassphrase\n ),\n LTCWalletId: Yup.string().max(100, 'Too long'),\n LTCWalletPassphrase: buildTestValidation(\n 'LTCWalletId',\n account?.LTCWalletPassphrase\n ),\n ZECWalletId: Yup.string().max(100, 'Too long'),\n ZECWalletPassphrase: buildTestValidation(\n 'ZECWalletId',\n account?.ZECWalletPassphrase\n ),\n BCHWalletId: Yup.string().max(100, 'Too long'),\n BCHWalletPassphrase: buildTestValidation(\n 'BCHWalletId',\n account?.BCHWalletPassphrase\n ),\n DASHWalletId: Yup.string().max(100, 'Too long'),\n DASHWalletPassphrase: buildTestValidation(\n 'DASHWalletId',\n account?.DASHWalletPassphrase\n ),\n environment: Yup.string()\n .matches(/(prod|test)/)\n .required()\n })\n }\n}\n","import * as Yup from 'yup'\n\nimport SecretInputFormik from 'src/components/inputs/formik/SecretInput'\nimport TextInputFormik from 'src/components/inputs/formik/TextInput'\n\nimport secretTest from './helper'\n\nexport default {\n code: 'bitstamp',\n name: 'Bitstamp',\n title: 'Bitstamp (Exchange)',\n elements: [\n {\n code: 'clientId',\n display: 'Client ID',\n component: TextInputFormik,\n face: true,\n long: true\n },\n {\n code: 'key',\n display: 'API Key',\n component: TextInputFormik,\n face: true,\n long: true\n },\n {\n code: 'secret',\n display: 'API Secret',\n component: SecretInputFormik\n }\n ],\n getValidationSchema: account => {\n return Yup.object().shape({\n clientId: Yup.string()\n .max(100, 'Too long')\n .required(),\n key: Yup.string()\n .max(100, 'Too long')\n .required(),\n secret: Yup.string()\n .max(100, 'Too long')\n .test(secretTest(account?.secret))\n })\n }\n}\n","import * as Yup from 'yup'\n\nimport TextInputFormik from 'src/components/inputs/formik/TextInput'\n\nexport default {\n code: 'blockcypher',\n name: 'Blockcypher',\n title: 'Blockcypher (Payments)',\n elements: [\n {\n code: 'token',\n display: 'API Token',\n component: TextInputFormik,\n face: true,\n long: true\n },\n {\n code: 'confidenceFactor',\n display: 'Confidence Factor',\n component: TextInputFormik,\n face: true\n }\n ],\n getValidationSchema: () => {\n return Yup.object().shape({\n token: Yup.string()\n .max(100, 'Too long')\n .required(),\n confidenceFactor: Yup.number()\n .integer('Please input a positive integer')\n .positive('Please input a positive integer')\n .required()\n })\n }\n}\n","import * as Yup from 'yup'\n\nimport SecretInputFormik from 'src/components/inputs/formik/SecretInput'\nimport TextInputFormik from 'src/components/inputs/formik/TextInput'\n\nimport secretTest from './helper'\n\nexport default {\n code: 'infura',\n name: 'Infura',\n title: 'Infura (Wallet)',\n elements: [\n {\n code: 'apiKey',\n display: 'Project ID',\n component: TextInputFormik,\n face: true,\n long: true\n },\n {\n code: 'apiSecret',\n display: 'Project Secret',\n component: SecretInputFormik\n },\n {\n code: 'endpoint',\n display: 'Endpoint',\n component: TextInputFormik,\n face: true\n }\n ],\n getValidationSchema: account => {\n return Yup.object().shape({\n apiKey: Yup.string()\n .max(100, 'Too long')\n .required(),\n apiSecret: Yup.string()\n .max(100, 'Too long')\n .test(secretTest(account?.apiSecret)),\n endpoint: Yup.string()\n .max(100, 'Too long')\n .required()\n })\n }\n}\n","import * as Yup from 'yup'\n\nimport SecretInputFormik from 'src/components/inputs/formik/SecretInput'\nimport TextInputFormik from 'src/components/inputs/formik/TextInput'\n\nimport secretTest from './helper'\n\nexport default {\n code: 'itbit',\n name: 'itBit',\n title: 'itBit (Exchange)',\n elements: [\n {\n code: 'userId',\n display: 'User ID',\n component: TextInputFormik,\n face: true,\n long: true\n },\n {\n code: 'walletId',\n display: 'Wallet ID',\n component: TextInputFormik,\n face: true,\n long: true\n },\n {\n code: 'clientKey',\n display: 'Client Key',\n component: TextInputFormik\n },\n {\n code: 'clientSecret',\n display: 'Client Secret',\n component: SecretInputFormik\n }\n ],\n getValidationSchema: account => {\n return Yup.object().shape({\n userId: Yup.string()\n .max(100, 'Too long')\n .required(),\n walletId: Yup.string()\n .max(100, 'Too long')\n .required(),\n clientKey: Yup.string()\n .max(100, 'Too long')\n .required(),\n clientSecret: Yup.string()\n .max(100, 'Too long')\n .test(secretTest(account?.clientSecret))\n })\n }\n}\n","import * as Yup from 'yup'\n\nimport SecretInputFormik from 'src/components/inputs/formik/SecretInput'\nimport TextInputFormik from 'src/components/inputs/formik/TextInput'\n\nimport secretTest from './helper'\n\nexport default {\n code: 'kraken',\n name: 'Kraken',\n title: 'Kraken (Exchange)',\n elements: [\n {\n code: 'apiKey',\n display: 'API Key',\n component: TextInputFormik,\n face: true,\n long: true\n },\n {\n code: 'privateKey',\n display: 'Private Key',\n component: SecretInputFormik\n }\n ],\n getValidationSchema: account => {\n return Yup.object().shape({\n apiKey: Yup.string()\n .max(100, 'Too long')\n .required(),\n privateKey: Yup.string()\n .max(100, 'Too long')\n .test(secretTest(account?.privateKey))\n })\n }\n}\n","import * as Yup from 'yup'\n\nimport TextInputFormik from 'src/components/inputs/formik/TextInput'\n\nexport default {\n code: 'mailgun',\n name: 'Mailgun',\n title: 'Mailgun (Email)',\n elements: [\n {\n code: 'apiKey',\n display: 'API Key',\n component: TextInputFormik\n },\n {\n code: 'domain',\n display: 'Domain',\n component: TextInputFormik\n },\n {\n code: 'fromEmail',\n display: 'From Email',\n component: TextInputFormik,\n face: true\n },\n {\n code: 'toEmail',\n display: 'To Email',\n component: TextInputFormik,\n face: true\n }\n ],\n getValidationSchema: () => {\n return Yup.object().shape({\n apiKey: Yup.string()\n .max(100, 'Too long')\n .required(),\n domain: Yup.string()\n .max(100, 'Too long')\n .required(),\n fromEmail: Yup.string()\n .max(100, 'Too long')\n .email('Please input a valid email address')\n .required(),\n toEmail: Yup.string()\n .max(100, 'Too long')\n .email('Please input a valid email address')\n .required()\n })\n }\n}\n","import * as Yup from 'yup'\n\nimport SecretInputFormik from 'src/components/inputs/formik/SecretInput'\nimport TextInputFormik from 'src/components/inputs/formik/TextInput'\n\nimport secretTest from './helper'\n\nexport default {\n code: 'twilio',\n name: 'Twilio',\n title: 'Twilio (SMS)',\n elements: [\n {\n code: 'accountSid',\n display: 'Account SID',\n component: TextInputFormik\n },\n {\n code: 'authToken',\n display: 'Auth Token',\n component: SecretInputFormik\n },\n {\n code: 'fromNumber',\n display: 'Twilio Number (international format)',\n component: TextInputFormik,\n face: true\n },\n {\n code: 'toNumber',\n display: 'Notifications Number (international format)',\n component: TextInputFormik,\n face: true\n }\n ],\n getValidationSchema: account => {\n return Yup.object().shape({\n accountSid: Yup.string()\n .max(100, 'Too long')\n .required(),\n authToken: Yup.string()\n .max(100, 'Too long')\n .test(secretTest(account?.authToken)),\n fromNumber: Yup.string()\n .max(100, 'Too long')\n .required(),\n toNumber: Yup.string()\n .max(100, 'Too long')\n .required()\n })\n }\n}\n","import bitgo from './bitgo'\nimport bitstamp from './bitstamp'\nimport blockcypher from './blockcypher'\nimport infura from './infura'\nimport itbit from './itbit'\nimport kraken from './kraken'\nimport mailgun from './mailgun'\nimport twilio from './twilio'\n\nexport default {\n [bitgo.code]: bitgo,\n [bitstamp.code]: bitstamp,\n [blockcypher.code]: blockcypher,\n [infura.code]: infura,\n [itbit.code]: itbit,\n [kraken.code]: kraken,\n [mailgun.code]: mailgun,\n [twilio.code]: twilio\n}\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"circle\", {\n cx: 52,\n cy: 32,\n r: 32,\n fill: \"#F7931A\"\n});\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"path\", {\n d: \"m66.1 27.4c0.6-4.3-2.6-6.5-7-8.1l1.4-5.8-3.5-0.9-1.4 5.6c-0.9-0.2-1.9-0.4-2.8-0.7l1.4-5.7-3.5-0.9-1.4 5.8c-0.8-0.2-1.5-0.3-2.2-0.5l0 0-4.8-1.2-0.9 3.8s2.6 0.6 2.6 0.6c1.4 0.4 1.7 1.3 1.6 2l-1.6 6.6c0.1 0 0.2 0.1 0.4 0.1-0.1 0-0.2-0.1-0.4-0.1l-2.3 9.2c-0.2 0.4-0.6 1.1-1.6 0.8 0 0.1-2.6-0.6-2.6-0.6l-1.7 4 4.6 1.1c0.9 0.2 1.7 0.4 2.5 0.6l-1.5 5.8 3.5 0.9 1.4-5.8c1 0.3 1.9 0.5 2.8 0.7l-1.4 5.7 3.5 0.9 1.5-5.8c6 1.1 10.5 0.7 12.4-4.7 1.5-4.4-0.1-6.9-3.2-8.5 2.3-0.5 4-2 4.5-5.2zm-8 11.2c-1.1 4.4-8.4 2-10.8 1.4l1.9-7.7c2.4 0.6 10 1.8 8.9 6.3zm1.1-11.3c-1 4-7.1 2-9.1 1.5l1.7-7c2 0.5 8.4 1.4 7.3 5.6z\",\n fill: \"#FFF\"\n});\n\nfunction SvgIconBitcoinColour(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n xmlns: \"http://www.w3.org/2000/svg\",\n width: 104,\n height: 64,\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgIconBitcoinColour);\nexport default __webpack_public_path__ + \"static/media/icon-bitcoin-colour.bd8da481.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#0AC18E\",\n d: \"m0,0l29.7,0a39,39,0,0,0,0,64l-29.7,0zm52,0a32,32,0,0,0,0,64a32,32,0,0,0,0,-64m52,0l-29.7,0a39,39,0,0,1,0,64l29.7,0z\"\n});\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n transform: \"rotate(-28 52 32)\",\n d: \"m66.103,27.444c0.637-4.258-2.605-6.547-7.038-8.074l1.438-5.768-3.511-0.875-1.4,5.616c-0.923-0.23-1.871-0.447-2.813-0.662l1.41-5.653-3.509-0.875-1.439,5.766c-0.764-0.174-1.514-0.346-2.242-0.527l0.004-0.018-4.842-1.209-0.934,3.75s2.605,0.597,2.55,0.634c1.422,0.355,1.679,1.296,1.636,2.042l-1.638,6.571c0.098,0.025,0.225,0.061,0.365,0.117-0.117-0.029-0.242-0.061-0.371-0.092l-2.296,9.205c-0.174,0.432-0.615,1.08-1.609,0.834,0.035,0.051-2.552-0.637-2.552-0.637l-1.743,4.019,4.569,1.139c0.85,0.213,1.683,0.436,2.503,0.646l-1.453,5.834,3.507,0.875,1.439-5.772c0.958,0.26,1.888,0.5,2.798,0.726l-1.434,5.745,3.511,0.875,1.453-5.823c5.987,1.133,10.489,0.676,12.384-4.739,1.527-4.36-0.076-6.875-3.226-8.515,2.294-0.529,4.022-2.038,4.483-5.155zm-8.022,11.249c-1.085,4.36-8.426,2.003-10.806,1.412l1.928-7.729c2.38,0.594,10.012,1.77,8.878,6.317zm1.086-11.312c-0.99,3.966-7.1,1.951-9.082,1.457l1.748-7.01c1.982,0.494,8.365,1.416,7.334,5.553z\"\n});\n\nfunction SvgIconBitcoincashColour(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n xmlns: \"http://www.w3.org/2000/svg\",\n width: 104,\n height: 64,\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgIconBitcoincashColour);\nexport default __webpack_public_path__ + \"static/media/icon-bitcoincash-colour.ed917caa.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"circle\", {\n cx: 1000,\n cy: 1000,\n r: 1000,\n fill: \"#2573c2\"\n});\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n fill: \"#fff\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M1652.6 736.8a143.65 143.65 0 0 0-19.2-63.6c-10-20-27.8-35.6-48.6-43.6a143.51 143.51 0 0 0-68.4-15H628.8l-63.6 190.6h804.2l-127 389.6h-804l-63.6 190.6h891.8a246.33 246.33 0 0 0 77.8-15c25-14.2 53.6-28.6 77.8-48.6a382.69 382.69 0 0 0 63.6-63.6 432.2 432.2 0 0 0 39.2-73.4l117.8-370.4a137.38 137.38 0 0 0 9.8-77.6z\"\n}), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M882.2 911.6H409l-63.6 176.2h478z\"\n}));\n\nfunction SvgIconDashColour(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n xmlns: \"http://www.w3.org/2000/svg\",\n viewBox: \"0 0 2000 2000\",\n width: 2500,\n height: 2500,\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgIconDashColour);\nexport default __webpack_public_path__ + \"static/media/icon-dash-colour.e01c021b.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"g\", null, /*#__PURE__*/React.createElement(\"polygon\", {\n fill: \"#343434\",\n points: \"127.9611 0 125.1661 9.5 125.1661 285.168 127.9611 287.958 255.9231 212.32\"\n}), /*#__PURE__*/React.createElement(\"polygon\", {\n fill: \"#8C8C8C\",\n points: \"127.962 0 0 212.32 127.962 287.959 127.962 154.158\"\n}), /*#__PURE__*/React.createElement(\"polygon\", {\n fill: \"#3C3C3B\",\n points: \"127.9611 312.1866 126.3861 314.1066 126.3861 412.3056 127.9611 416.9066 255.9991 236.5866\"\n}), /*#__PURE__*/React.createElement(\"polygon\", {\n fill: \"#8C8C8C\",\n points: \"127.962 416.9052 127.962 312.1852 0 236.5852\"\n}), /*#__PURE__*/React.createElement(\"polygon\", {\n fill: \"#141414\",\n points: \"127.9611 287.9577 255.9211 212.3207 127.9611 154.1587\"\n}), /*#__PURE__*/React.createElement(\"polygon\", {\n fill: \"#393939\",\n points: \"0.0009 212.3208 127.9609 287.9578 127.9609 154.1588\"\n}));\n\nfunction SvgIconEthereumColour(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"256px\",\n height: \"417px\",\n viewBox: \"0 0 256 417\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n preserveAspectRatio: \"xMidYMid\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgIconEthereumColour);\nexport default __webpack_public_path__ + \"static/media/icon-ethereum-colour.761723a2.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"circle\", {\n fill: \"#989898\",\n cx: 52,\n cy: 32,\n r: 32\n});\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n d: \"m46.92598,12.31703l-4.97801,18.8088l-3.42705,1.32711l-1.64691,6.17189l3.42705,-1.29514l-2.8461,10.76083l30.60893,0l2.09993,-7.98401l-18.42505,0l2.09993,-7.82412l3.3631,-1.26316l1.6469,-6.17188l-3.36309,1.29513l3.6509,-13.83611l-12.21053,0z\"\n});\n\nfunction SvgIconLitecoinColour(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n xmlns: \"http://www.w3.org/2000/svg\",\n width: 104,\n height: 64,\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgIconLitecoinColour);\nexport default __webpack_public_path__ + \"static/media/icon-litecoin-colour.bd861b5e.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"style\", {\n type: \"text/css\"\n}, \"\\n\\t.st0{fill:#231F20;}\\n\\t.st1{fill:#F4B728;}\\n\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"st0\",\n d: \"M245.4,20C121.1,20,20,121.1,20,245.4s101.1,225.4,225.4,225.4s225.4-101.1,225.4-225.4S369.7,20,245.4,20z M245.4,433.6c-103.8,0-188.2-84.4-188.2-188.2S141.6,57.2,245.4,57.2s188.2,84.4,188.2,188.2S349.2,433.6,245.4,433.6z\"\n});\n\nvar _ref4 = /*#__PURE__*/React.createElement(\"circle\", {\n className: \"st1\",\n cx: 245.4,\n cy: 245.4,\n r: 177.6\n});\n\nvar _ref5 = /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"st0\",\n points: \"165,315.5 165,349.9 226.5,349.9 226.5,387.6 264.3,387.6 264.3,349.9 325.8,349.9 325.8,304.4 230.4,304.4 325.8,175 325.8,140.6 264.3,140.6 264.3,103 226.5,103 226.5,140.6 165,140.6 165,186.2 260.4,186.2 \"\n});\n\nfunction SvgIconZcashColour(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n id: \"Layer_1\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n x: \"0px\",\n y: \"0px\",\n viewBox: \"0 0 493.3 490.2\",\n style: {\n enableBackground: \"new 0 0 493.3 490.2\"\n },\n xmlSpace: \"preserve\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), _ref2, title === undefined ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, \"headerArtboard 7\") : title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref3, _ref4, _ref5);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgIconZcashColour);\nexport default __webpack_public_path__ + \"static/media/icon-zcash-colour.68b1c20b.svg\";\nexport { ForwardRef as ReactComponent };","import { makeStyles } from '@material-ui/core'\nimport React from 'react'\n\nimport { Button } from 'src/components/buttons'\nimport { H1, P } from 'src/components/typography'\nimport { ReactComponent as BitcoinLogo } from 'src/styling/logos/icon-bitcoin-colour.svg'\nimport { ReactComponent as BitcoinCashLogo } from 'src/styling/logos/icon-bitcoincash-colour.svg'\nimport { ReactComponent as DashLogo } from 'src/styling/logos/icon-dash-colour.svg'\nimport { ReactComponent as EthereumLogo } from 'src/styling/logos/icon-ethereum-colour.svg'\nimport { ReactComponent as LitecoinLogo } from 'src/styling/logos/icon-litecoin-colour.svg'\nimport { ReactComponent as ZcashLogo } from 'src/styling/logos/icon-zcash-colour.svg'\n\nconst styles = {\n logo: {\n maxHeight: 80,\n maxWidth: 200\n },\n title: {\n margin: [[24, 0, 32, 0]]\n },\n text: {\n margin: 0\n },\n button: {\n marginTop: 'auto',\n marginBottom: 58\n },\n modalContent: {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center',\n padding: [[0, 42]],\n flex: 1\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst getLogo = code => {\n switch (code) {\n case 'BTC':\n return BitcoinLogo\n case 'BCH':\n return BitcoinCashLogo\n case 'DASH':\n return DashLogo\n case 'ETH':\n return EthereumLogo\n case 'LTC':\n return LitecoinLogo\n case 'ZEC':\n return ZcashLogo\n default:\n return null\n }\n}\n\nconst WizardSplash = ({ code, name, onContinue }) => {\n const classes = useStyles()\n const Logo = getLogo(code)\n\n return (\n \n \n Total Crypto Balance\n \n \n {getConfirmedTotal(funding)}\n {funding[0].fiatCode}\n \n \n ({signIfPositive(pendingTotal)} {pendingTotal} pending)\n \n
\n )}\n \n {selected && !viewHistory && selected.errorMsg && (\n \n
\n )}\n {selected && !viewHistory && !selected.errorMsg && (\n \n {selected.errorMsg} \n
\n \n
\n )}\n {selected && viewHistory && (\n \n
\n\n Balance ({selected.display})
\n\n \n {`${selected.confirmedBalance} ${selected.cryptoCode}`}\n \n \n {`(${signIfPositive(selected.pending)} ${\n selected.pending\n } pending)`}\n \n
\n\n \n \n {`= ${formatNumber(selected.fiatConfirmedBalance)} ${\n selected.fiatCode\n }`}\n \n \n {`(${signIfPositive(selected.fiatPending)} ${formatNumber(\n selected.fiatPending\n )} pending)`}\n \n
\n\n Address
\n\n
\n \n \n \n {formatAddress(\n selected.cryptoCode,\n selected.fundingAddress\n )}\n \n \n
\n \n Scan to send {selected.display} \n
\n \n \n \n
\n
\n )}\n | \n Amount Entered\n | \n\n Balance After\n | \n\n Cash Value\n | \n\n Date\n | \n\n Time (h:m:s)\n | \n\n Performed By\n | \n \n \n {fundingHistory.map((it, idx) => (\n\n {it.cryptoAmount} {selected.cryptoCode}\n | \n\n {it.balance} {selected.cryptoCode}\n | \n\n {it.fiatValue} {selected.fiatCode}\n | \n\n {moment(it.date).format('YYYY-MM-DD')}\n | \n\n {moment(it.date).format('hh:mm:ss')}\n | \nadd | \n \n ))}\n
\n
\n )\n}\n\nexport default WizardSplash\n","import { makeStyles, Grid } from '@material-ui/core'\nimport classnames from 'classnames'\nimport { Formik, Form, FastField } from 'formik'\nimport * as R from 'ramda'\nimport React from 'react'\n\nimport { Button } from 'src/components/buttons'\nimport { SecretInput } from 'src/components/inputs/formik'\n\nconst styles = {\n button: {\n margin: [['auto', 0, 32, 'auto']]\n },\n form: {\n flex: 1,\n display: 'flex',\n flexDirection: 'column'\n },\n grid: {\n marginBottom: 24,\n marginTop: 12\n }\n}\n\nconst useStyles = makeStyles(styles)\nconst FormRenderer = ({\n validationSchema,\n elements,\n value,\n save,\n buttonLabel = 'Save changes',\n buttonClass,\n xs = 12\n}) => {\n const classes = useStyles()\n\n const initialValues = R.compose(\n R.mergeAll,\n R.map(({ code }) => ({ [code]: (value && value[code]) ?? '' }))\n )(elements)\n\n const values = R.merge(initialValues, value)\n\n const saveNonEmptySecret = it => {\n const emptySecretFields = R.compose(\n R.map(R.prop('code')),\n R.filter(\n elem =>\n R.prop('component', elem) === SecretInput &&\n R.isEmpty(it[R.prop('code', elem)])\n )\n )(elements)\n return save(R.omit(emptySecretFields, it))\n }\n\n return (\n Enable {name}
\n\n You are about to enable {name} on your system. This will allow you to\n use this cryptocurrency on your machines. To be able to do that, you’ll\n have to set up all the necessary 3rd party services.\n
\n \n\n Select a {displayName} or set up a new one\n
\n\n {!R.isEmpty(unfilled) && !R.isNil(unfilled) && (\n {\n dispatch({ type: 'new' })\n }}\n labelClassName={classes.radioLabel}\n radioClassName={classes.radio}\n options={[{ display: 'Set up new', code: true }]}\n />\n )}\n {isNew && (\n {\n dispatch({ type: 'form', form: it })\n }}\n />\n )}\n
\n {form && (\n \n {error && Failed to save }\n innerContinue({ [type]: selected })}>\n {label}\n \n
\n )}\n \n )\n}\n\nexport default WizardStep\n","import * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport Modal from 'src/components/Modal'\nimport schema from 'src/pages/Services/schemas'\nimport { toNamespace } from 'src/utils/config'\n\nimport WizardSplash from './WizardSplash'\nimport WizardStep from './WizardStep'\n\nconst LAST_STEP = 4\nconst MODAL_WIDTH = 554\n\nconst contains = crypto => R.compose(R.contains(crypto), R.prop('cryptos'))\nconst sameClass = type => R.propEq('class', type)\nconst filterConfig = (crypto, type) =>\n R.filter(it => sameClass(type)(it) && contains(crypto)(it))\nconst removeDeprecated = R.filter(({ deprecated }) => !deprecated)\n\nconst getItems = (accountsConfig, accounts, type, crypto) => {\n const fConfig = removeDeprecated(filterConfig(crypto, type)(accountsConfig))\n\n const find = code => accounts && accounts[code]\n\n const [filled, unfilled] = R.partition(({ code }) => {\n const account = find(code)\n if (!schema[code]) return true\n\n const { getValidationSchema } = schema[code]\n return getValidationSchema(account).isValidSync(account)\n })(fConfig)\n\n return { filled, unfilled }\n}\n\nconst Wizard = ({ coin, onClose, accountsConfig, accounts, save, error }) => {\n const [{ step, config, accountsToSave }, setState] = useState({\n step: 0,\n config: { active: true },\n accountsToSave: {}\n })\n\n const title = `Enable ${coin.display}`\n const isLastStep = step === LAST_STEP\n\n const tickers = { filled: filterConfig(coin.code, 'ticker')(accountsConfig) }\n const wallets = getItems(accountsConfig, accounts, 'wallet', coin.code)\n const exchanges = getItems(accountsConfig, accounts, 'exchange', coin.code)\n const zeroConfs = getItems(accountsConfig, accounts, 'zeroConf', coin.code)\n\n const getValue = code => R.find(R.propEq('code', code))(accounts)\n\n const onContinue = async (stepConfig, stepAccount) => {\n const newConfig = R.merge(config, stepConfig)\n const newAccounts = stepAccount\n ? R.merge(accountsToSave, stepAccount)\n : accountsToSave\n\n if (isLastStep) {\n return save(toNamespace(coin.code, newConfig), newAccounts)\n }\n\n setState({\n step: step + 1,\n config: newConfig,\n accountsToSave: newAccounts\n })\n }\n\n const getStepData = () => {\n switch (step) {\n case 1:\n return { type: 'ticker', ...tickers }\n case 2:\n return { type: 'wallet', ...wallets }\n case 3:\n return { type: 'exchange', ...exchanges }\n case 4:\n return { type: 'zeroConf', name: 'zero conf', ...zeroConfs }\n default:\n return null\n }\n }\n\n return (\n \n Please note that all values you set that were based on your prior fiat\n currency are still the same. If you need to adjust these to reflect the\n new fiat currency (such as minimum transaction amounts, fixed fees, and\n compliance triggers, for example), please do so now.\n
\n\n Also, if you have cash-out enabled, you must define new dispenser bill\n counts for the new currency for cash-out on the new currency to work.\n
\n\n \n Cancel\n \n \n Save\n \n
\n \n )\n}\n\nconst Locales = ({ name: SCREEN_KEY }) => {\n const [wizard, setWizard] = useState(false)\n const [onChangeFunction, setOnChangeFunction] = useState(null)\n const [error, setError] = useState(null)\n const [isEditingDefault, setEditingDefault] = useState(false)\n const [isEditingOverrides, setEditingOverrides] = useState(false)\n const { data } = useQuery(GET_DATA)\n const [saveConfig] = useMutation(SAVE_CONFIG, {\n onCompleted: () => setWizard(false),\n refetchQueries: () => ['getData'],\n onError: error => setError(error)\n })\n\n const [dataToSave, setDataToSave] = useState(null)\n\n const config = data?.config && fromNamespace(SCREEN_KEY)(data.config)\n const wallets = data?.config && fromNamespace(namespaces.WALLETS)(data.config)\n\n const accountsConfig = data?.accountsConfig\n const accounts = data?.accounts ?? []\n const cryptoCurrencies = data?.cryptoCurrencies ?? []\n const locale = config && !R.isEmpty(config) ? config : localeDefaults\n const localeOverrides = locale.overrides ?? []\n\n const handleSave = it => {\n const newConfig = toNamespace(SCREEN_KEY)(it.locale[0])\n\n if (\n config.fiatCurrency &&\n newConfig.locale_fiatCurrency !== config.fiatCurrency\n )\n return setDataToSave(newConfig)\n\n return save(newConfig)\n }\n\n const save = config => {\n setDataToSave(null)\n return saveConfig({ variables: { config } })\n }\n\n const saveOverrides = it => {\n const config = toNamespace(SCREEN_KEY)(it)\n setError(null)\n return saveConfig({ variables: { config } })\n }\n\n const onChangeCoin = (prev, curr, setValue) => {\n const coin = R.difference(curr, prev)[0]\n if (!coin) return setValue(curr)\n\n const namespaced = fromNamespace(coin)(wallets)\n if (!WalletSchema.isValidSync(namespaced)) {\n setOnChangeFunction(() => () => setValue(curr))\n setWizard(coin)\n return\n }\n\n setValue(curr)\n }\n\n const onEditingDefault = (it, editing) => setEditingDefault(editing)\n const onEditingOverrides = (it, editing) => setEditingOverrides(editing)\n\n const wizardSave = it =>\n save(toNamespace(namespaces.WALLETS)(it)).then(it => {\n onChangeFunction()\n setOnChangeFunction(null)\n return it\n })\n\n return (\n <>\n Currently, there are no active promo codes on your network.
\n \n\n \n
\n )\n}\n\nexport default Tile\n","import { makeStyles } from '@material-ui/core/styles'\nimport moment from 'moment'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport typographyStyles from 'src/components/typography/styles'\nimport { ReactComponent as Arrow } from 'src/styling/icons/arrow/month_change.svg'\nimport { ReactComponent as RightArrow } from 'src/styling/icons/arrow/month_change_right.svg'\nimport { primaryColor, zircon } from 'src/styling/variables'\n\nimport Tile from './Tile'\n\nconst { p, label2 } = typographyStyles\n\nconst styles = {\n wrapper: {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center'\n },\n button: {\n outline: 'none'\n },\n navbar: {\n extend: p,\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n width: '100%',\n padding: [[15, 15]],\n color: primaryColor,\n '& button': {\n display: 'flex',\n alignItems: 'center',\n padding: 0,\n border: 'none',\n backgroundColor: zircon,\n cursor: 'pointer',\n borderRadius: '50%',\n width: 20,\n height: 20,\n position: 'relative',\n overflow: 'hidden',\n '& svg': {\n position: 'absolute',\n left: 0\n }\n }\n },\n table: {\n borderCollapse: 'collapse',\n width: '100%',\n color: primaryColor,\n '& tr': {\n '&:first-child': {\n paddingLeft: 5\n },\n '&:last-child': {\n paddingRight: 5\n }\n },\n '& th, & td': {\n margin: 0,\n padding: [[3, 0, 3, 0]]\n },\n '& th': {\n extend: label2\n }\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst Calendar = ({ minDate, maxDate, handleSelect, ...props }) => {\n const [currentDisplayedMonth, setCurrentDisplayedMonth] = useState(moment())\n\n const classes = useStyles()\n\n const weekdays = moment.weekdaysMin().map(day => day.slice(0, 1))\n const monthLength = month =>\n Number.parseInt(\n moment(month)\n .endOf('month')\n .format('D')\n )\n\n const monthdays = month => {\n const lastMonth = moment(month).subtract(1, 'month')\n const lastMonthRange = R.range(\n 0,\n moment(month)\n .startOf('month')\n .weekday()\n ).reverse()\n const lastMonthDays = R.map(i =>\n moment(lastMonth)\n .endOf('month')\n .subtract(i, 'days')\n )(lastMonthRange)\n\n const thisMonthRange = R.range(0, monthLength(month))\n const thisMonthDays = R.map(i =>\n moment(month)\n .startOf('month')\n .add(i, 'days')\n )(thisMonthRange)\n\n const nextMonth = moment(month).add(1, 'month')\n const nextMonthRange = R.range(\n 0,\n 42 - lastMonthDays.length - thisMonthDays.length\n )\n const nextMonthDays = R.map(i =>\n moment(nextMonth)\n .startOf('month')\n .add(i, 'days')\n )(nextMonthRange)\n\n return R.concat(R.concat(lastMonthDays, thisMonthDays), nextMonthDays)\n }\n\n const getRow = (month, row) => monthdays(month).slice(row * 7 - 7, row * 7)\n\n const handleNavPrev = currentMonth => {\n const prevMonth = moment(currentMonth).subtract(1, 'month')\n if (!minDate) setCurrentDisplayedMonth(prevMonth)\n else {\n setCurrentDisplayedMonth(\n prevMonth.isSameOrAfter(minDate, 'month')\n ? prevMonth\n : currentDisplayedMonth\n )\n }\n }\n const handleNavNext = currentMonth => {\n const nextMonth = moment(currentMonth).add(1, 'month')\n if (!maxDate) setCurrentDisplayedMonth(nextMonth)\n else {\n setCurrentDisplayedMonth(\n nextMonth.isSameOrBefore(maxDate, 'month')\n ? nextMonth\n : currentDisplayedMonth\n )\n }\n }\n\n return (\n \n \n
\n \n \n \n
\n
\n )\n}\n\nexport default Calendar\n","import { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport React, { useState, useEffect } from 'react'\n\nimport Calendar from './Calendar'\n\nconst styles = {\n wrapper: {\n backgroundColor: 'white',\n borderRadius: 10\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst DateRangePicker = ({ minDate, maxDate, className, onRangeChange }) => {\n const [from, setFrom] = useState(null)\n const [to, setTo] = useState(null)\n\n useEffect(() => {\n onRangeChange(from, to)\n }, [from, onRangeChange, to])\n\n const classes = useStyles()\n\n const handleSelect = (day, minDate, maxDate) => {\n if (\n (maxDate && day.isAfter(maxDate, 'day')) ||\n (minDate && day.isBefore(minDate, 'day'))\n )\n return\n\n if (from && !to && day.isBefore(from, 'day')) {\n setTo(from)\n setFrom(day)\n return\n }\n\n if (from && !to && day.isSameOrAfter(from, 'day')) {\n setTo(day)\n return\n }\n\n setFrom(day)\n setTo(null)\n }\n\n return (\n <>\n \n handleNavPrev(currentDisplayedMonth)}>\n handleNavNext(currentDisplayedMonth)}>\n
\n | {day} | \n ))}\n
|---|
\n
\n \n )\n}\n\nexport default DateRangePicker\n","import { useLazyQuery } from '@apollo/react-hooks'\nimport { makeStyles, ClickAwayListener } from '@material-ui/core'\nimport classnames from 'classnames'\nimport FileSaver from 'file-saver'\nimport moment from 'moment'\nimport * as R from 'ramda'\nimport React, { useState, useCallback } from 'react'\n\nimport { FeatureButton, Link } from 'src/components/buttons'\nimport { ReactComponent as Arrow } from 'src/styling/icons/arrow/download_logs.svg'\nimport { ReactComponent as DownloadInverseIcon } from 'src/styling/icons/button/download/white.svg'\nimport { ReactComponent as Download } from 'src/styling/icons/button/download/zodiac.svg'\nimport { primaryColor, offColor, zircon } from 'src/styling/variables'\n\nimport Popper from './Popper'\nimport DateRangePicker from './date-range-picker/DateRangePicker'\nimport { RadioGroup } from './inputs'\nimport typographyStyles from './typography/styles'\n\nconst { info1, label1, label2, h4 } = typographyStyles\n\nconst dateContainerStyles = {\n wrapper: {\n height: 46,\n width: 99\n },\n container: {\n display: 'flex'\n },\n monthWeekDayContainer: {\n display: 'flex',\n flexDirection: 'column'\n },\n label: {\n extend: label1,\n lineHeight: 1.33,\n color: primaryColor\n },\n bigNumber: {\n extend: info1,\n lineHeight: 1,\n marginRight: 7\n },\n monthYear: {\n extend: label2,\n lineHeight: 1.17,\n color: primaryColor\n },\n weekDay: {\n extend: label1,\n lineHeight: 1.33,\n color: offColor\n }\n}\n\nconst dateContainerUseStyles = makeStyles(dateContainerStyles)\n\nconst DateContainer = ({ date, children, ...props }) => {\n const classes = dateContainerUseStyles()\n\n return (\n \n
\n )\n}\n\nconst styles = {\n popoverContent: {\n width: 280\n },\n popoverHeader: {\n extend: h4,\n padding: [[15, 15, 0, 15]]\n },\n radioButtonsContainer: {\n padding: [[5, 15, 5, 15]]\n },\n radioButtons: {\n display: 'flex',\n justifyContent: 'space-between',\n flexDirection: 'row',\n color: primaryColor\n },\n dateRangePickerShowing: {\n display: 'block',\n height: '100%'\n },\n dateRangePickerHidden: {\n display: 'none',\n height: 0\n },\n download: {\n padding: [[10, 15]]\n },\n dateContainerWrapper: {\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n position: 'relative',\n backgroundColor: zircon,\n padding: [[0, 15]],\n minHeight: 70\n },\n arrowContainer: {\n position: 'absolute',\n left: 125,\n top: 26\n },\n arrow: {\n margin: 'auto'\n }\n}\n\nconst useStyles = makeStyles(styles)\nconst ALL = 'all'\nconst RANGE = 'range'\n\nconst LogsDownloaderPopover = ({ name, query, args, title, getLogs }) => {\n const [selectedRadio, setSelectedRadio] = useState(ALL)\n const [range, setRange] = useState({ from: null, until: null })\n const [anchorEl, setAnchorEl] = useState(null)\n const [fetchLogs] = useLazyQuery(query, {\n onCompleted: data => createLogsFile(getLogs(data), range)\n })\n\n const classes = useStyles()\n\n const dateRangePickerClasses = {\n [classes.dateRangePickerShowing]: selectedRadio === RANGE,\n [classes.dateRangePickerHidden]: selectedRadio === ALL\n }\n\n const handleRadioButtons = evt => {\n const selectedRadio = R.path(['target', 'value'])(evt)\n setSelectedRadio(selectedRadio)\n if (selectedRadio === ALL) setRange({ from: null, until: null })\n }\n\n const handleRangeChange = useCallback(\n (from, until) => {\n setRange({ from, until })\n },\n [setRange]\n )\n\n const downloadLogs = (range, args, fetchLogs) => {\n if (selectedRadio === ALL) {\n fetchLogs({\n variables: {\n ...args\n }\n })\n }\n\n if (!range || !range.from) return\n if (range.from && !range.until) range.until = moment()\n\n if (selectedRadio === RANGE) {\n fetchLogs({\n variables: {\n ...args,\n from: range.from,\n until: range.until\n }\n })\n }\n }\n\n const createLogsFile = (logs, range) => {\n const formatDateFile = date => {\n return moment(date).format('YYYY-MM-DD_HH-mm')\n }\n\n const blob = new window.Blob([logs], {\n type: 'text/plain;charset=utf-8'\n })\n\n FileSaver.saveAs(\n blob,\n selectedRadio === ALL\n ? `${formatDateFile(new Date())}_${name}.csv`\n : `${formatDateFile(range.from)}_${formatDateFile(\n range.until\n )}_${name}.csv`\n )\n }\n\n const handleOpenRangePicker = event => {\n setAnchorEl(anchorEl ? null : event.currentTarget)\n }\n\n const handleClickAway = () => {\n setAnchorEl(null)\n }\n\n const radioButtonOptions = [\n { display: 'All logs', code: ALL },\n { display: 'Date range', code: RANGE }\n ]\n\n const open = Boolean(anchorEl)\n const id = open ? 'date-range-popover' : undefined\n\n return (\n {children}
\n {date && (\n <>\n \n
\n \n )}\n {date.format('D')}
\n \n {`${date.format(\n 'MMM'\n )} ${date.format('YYYY')}`}\n {date.format('dddd')}\n
\n \n \n \n
\n \n
\n {title}
\n \n
\n {selectedRadio === RANGE && (\n \n
\n )}\n \n {range && (\n <>\n From \n To \n \n )}\n
\n \n
\n \n downloadLogs(range, args, fetchLogs)}>\n Download\n \n
\n \n
\n \n Machine Logs \n {logsResponse && (\n
\n \n R.path(['machineLogsCsv'])(logs)}\n />\n {saveMessage} \n
\n )}\n \n it.name}\n data={machineResponse?.machines || []}\n isSelected={isSelected}\n onClick={setSelected}\n />\n
\n \n )\n}\n\nexport default Logs\n","const styles = {\n cashbox: {\n width: 80,\n height: 36\n }\n}\n\nexport default styles\n","import { useMutation } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport gql from 'graphql-tag'\nimport React from 'react'\nimport * as Yup from 'yup'\n\nimport { Table as EditableTable } from 'src/components/editableTable'\nimport { CashOut, CashIn } from 'src/components/inputs/cashbox/Cashbox'\nimport { NumberInput } from 'src/components/inputs/formik'\nimport { fromNamespace } from 'src/utils/config'\n\nimport styles from './Cassettes.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst ValidationSchema = Yup.object().shape({\n name: Yup.string().required('Required'),\n cashbox: Yup.number()\n .label('Cashbox')\n .required()\n .integer()\n .min(0)\n .max(1000),\n cassette1: Yup.number()\n .required('Required')\n .integer()\n .min(0)\n .max(500),\n cassette2: Yup.number()\n .required('Required')\n .integer()\n .min(0)\n .max(500)\n})\n\nconst SET_CASSETTE_BILLS = gql`\n mutation MachineAction(\n $deviceId: ID!\n $action: MachineAction!\n $cashbox: Int!\n $cassette1: Int!\n $cassette2: Int!\n ) {\n machineAction(\n deviceId: $deviceId\n action: $action\n cashbox: $cashbox\n cassette1: $cassette1\n cassette2: $cassette2\n ) {\n deviceId\n cashbox\n cassette1\n cassette2\n }\n }\n`\n\nconst CashCassettes = ({ machine, config, refetchData }) => {\n const data = { machine, config }\n const classes = useStyles()\n\n const cashout = data?.config && fromNamespace('cashOut')(data.config)\n const locale = data?.config && fromNamespace('locale')(data.config)\n const fiatCurrency = locale?.fiatCurrency\n\n const getCashoutSettings = deviceId => fromNamespace(deviceId)(cashout)\n const isCashOutDisabled = ({ deviceId }) =>\n !getCashoutSettings(deviceId).active\n\n const elements = [\n {\n name: 'cashbox',\n header: 'Cashbox',\n width: 240,\n stripe: false,\n view: value => (\n \n \n
\n {loading &&
\n {'Loading...'}
}\n {!loading && !logsResponse?.machineLogs?.length && (\n{'No activity so far'}
\n )}\n\n
\n)\n\nconst cashOutHeader = (\n \n
\n)\n\nconst getOverridesFields = currency => {\n return [\n {\n name: 'name',\n width: 280,\n size: 'sm',\n view: it => `${it}`\n },\n {\n header: cashInHeader,\n name: 'cashIn',\n display: 'Cash-in',\n width: 130,\n textAlign: 'right',\n suffix: '%'\n },\n {\n header: cashOutHeader,\n name: 'cashOut',\n display: 'Cash-out',\n width: 130,\n textAlign: 'right',\n suffix: '%',\n inputProps: {\n decimalPlaces: 3\n }\n },\n {\n name: 'fixedFee',\n display: 'Fixed fee',\n width: 144,\n doubleHeader: 'Cash-in only',\n textAlign: 'right',\n suffix: currency\n },\n {\n name: 'minimumTx',\n display: 'Minimun Tx',\n width: 144,\n doubleHeader: 'Cash-in only',\n textAlign: 'right',\n suffix: currency\n }\n ]\n}\n\nconst overrides = currency => {\n return getOverridesFields(currency)\n}\n\nexport { overrides }\n","import { useQuery, useMutation } from '@apollo/react-hooks'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React from 'react'\n\nimport { Table as EditableTable } from 'src/components/editableTable'\nimport { fromNamespace, toNamespace, namespaces } from 'src/utils/config'\n\nimport { overrides } from './helper'\n\nconst GET_DATA = gql`\n query getData {\n config\n cryptoCurrencies {\n code\n display\n }\n machines {\n name\n deviceId\n }\n }\n`\n\nconst SAVE_CONFIG = gql`\n mutation Save($config: JSONObject) {\n saveConfig(config: $config)\n }\n`\n\nconst Commissions = ({ name: SCREEN_KEY, id: deviceId }) => {\n const { data, loading } = useQuery(GET_DATA)\n const [saveConfig] = useMutation(SAVE_CONFIG, {\n refetchQueries: () => ['getData']\n })\n\n const config = data?.config && fromNamespace(SCREEN_KEY)(data.config)\n const currency = R.path(['fiatCurrency'])(\n fromNamespace(namespaces.LOCALE)(data?.config)\n )\n\n const saveOverrides = it => {\n const config = toNamespace(SCREEN_KEY)(it)\n return saveConfig({ variables: { config } })\n }\n\n const getMachineCommissions = () => {\n if (loading || !deviceId || !config) {\n return []\n }\n const commissions = {}\n\n // first, get general non overridden commissions\n const makeInfo = x =>\n (commissions[R.prop('code')(x)] = {\n code: x.code,\n name: x.display,\n cashIn: config.cashIn,\n cashOut: config.cashOut,\n fixedFee: config.fixedFee,\n minimumTx: config.minimumTx\n })\n R.forEach(makeInfo)(data.cryptoCurrencies)\n\n // second, get overrides for all machines\n const isId = id => R.propEq('machine', id)\n const generalOverrides = config.overrides\n ? R.filter(isId('ALL_MACHINES'))(config.overrides)\n : []\n\n const overrideInfo = o => {\n commissions[o.cryptoCurrencies[0]].cashIn = o.cashIn\n commissions[o.cryptoCurrencies[0]].cashOut = o.cashOut\n commissions[o.cryptoCurrencies[0]].fixedFee = o.fixedFee\n commissions[o.cryptoCurrencies[0]].minimumTx = o.minimumTx\n }\n R.forEach(overrideInfo)(generalOverrides)\n\n // third, get overrides for this machine\n const machineOverrides = config.overrides\n ? R.filter(isId(deviceId))(config.overrides)\n : []\n R.forEach(overrideInfo)(machineOverrides)\n\n // in the end, the machine specific overrides overwrite the less general ALL_MACHINE overrides or the general overrides\n return R.values(commissions)\n }\n\n const machineCommissions = getMachineCommissions()\n\n return (\n \n
\n )\n}\n\nexport default Details\n","import {\n Dialog,\n DialogActions,\n DialogContent,\n makeStyles\n} from '@material-ui/core'\nimport React, { memo, useState } from 'react'\n\nimport { Button, IconButton } from 'src/components/buttons'\nimport { TextInput } from 'src/components/inputs'\nimport { H4, P } from 'src/components/typography'\nimport { ReactComponent as CloseIcon } from 'src/styling/icons/action/close/zodiac.svg'\nimport { spacer } from 'src/styling/variables'\n\nimport ErrorMessage from './ErrorMessage'\n\nconst useStyles = makeStyles({\n dialogContent: {\n width: 434,\n padding: spacer * 2,\n paddingRight: spacer * 3.5\n },\n dialogTitle: {\n padding: spacer * 2,\n paddingRight: spacer * 1.5,\n display: 'flex',\n 'justify-content': 'space-between',\n '& > h4': {\n margin: 0\n },\n '& > button': {\n padding: 0,\n marginTop: -(spacer / 2)\n }\n },\n dialogActions: {\n padding: spacer * 4,\n paddingTop: spacer * 2\n }\n})\n\nexport const DialogTitle = ({ children, onClose }) => {\n const classes = useStyles()\n return (\n \n Paired at \n
\n \n {data.pairedAt\n ? moment(data.pairedAt).format('YYYY-MM-DD HH:mm:ss')\n : ''}\n
\n\n Machine model \n
\n {data.model}
\n\n Software version \n
\n {data.version}
\n\n {children}\n {onClose && (\n \n \n )}\n
\n )\n}\n\nexport const ConfirmDialog = memo(\n ({\n title = 'Confirm action',\n errorMessage = 'This action requires confirmation',\n open,\n toBeConfirmed,\n saveButtonAlwaysEnabled = false,\n message,\n confirmationMessage = `Write '${toBeConfirmed}' to confirm this action`,\n onConfirmed,\n onDissmised,\n initialValue = '',\n disabled = false,\n ...props\n }) => {\n const classes = useStyles()\n const [value, setValue] = useState(initialValue)\n const [error, setError] = useState(false)\n const handleChange = event => setValue(event.target.value)\n\n const innerOnClose = () => {\n setValue('')\n setError(false)\n onDissmised()\n }\n\n const isOnErrorState =\n (!saveButtonAlwaysEnabled && toBeConfirmed !== value) || value === ''\n\n return (\n \n )\n }\n)\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/reboot/white\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-3\",\n stroke: \"#FFFFFF\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-2\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M3.57419317,11.1560104 C2.91506589,10.8661403 2.29620875,10.4522182 1.75493083,9.91362078 C-0.568892549,7.60089351 -0.587250991,3.86936104 1.71406849,1.57845195 C2.03057585,1.26367293 2.37407977,0.992496226 2.73740775,0.764921841\",\n id: \"Stroke-1\"\n}), /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-3\",\n points: \"3.37563213 1.84831169 3.36911784 0.595324675 2.18174122 4.15223411e-14\"\n})), /*#__PURE__*/React.createElement(\"line\", {\n x1: 5.92223784,\n y1: 7.57277922,\n x2: 5.92223784,\n y2: 3.98212987,\n id: \"Stroke-9\"\n}), /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-2\",\n transform: \"translate(9.818105, 6.000000) scale(-1, -1) translate(-9.818105, -6.000000) translate(7.636287, 0.000000)\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M3.57419317,11.1560104 C2.91506589,10.8661403 2.29620875,10.4522182 1.75493083,9.91362078 C-0.568892549,7.60089351 -0.587250991,3.86936104 1.71406849,1.57845195 C2.03057585,1.26367293 2.37407977,0.992496226 2.73740775,0.764921841\",\n id: \"Stroke-1\"\n}), /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-3\",\n points: \"3.37563213 1.84831169 3.36911784 0.595324675 2.18174122 4.15223411e-14\"\n}))));\n\nfunction SvgWhite(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"-0.493 -0.5 12.993 13\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWhite);\nexport default __webpack_public_path__ + \"static/media/white.fe6ed797.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/reboot/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-3\",\n stroke: \"#1B2559\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-2\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M3.57419317,11.1560104 C2.91506589,10.8661403 2.29620875,10.4522182 1.75493083,9.91362078 C-0.568892549,7.60089351 -0.587250991,3.86936104 1.71406849,1.57845195 C2.03057585,1.26367293 2.37407977,0.992496226 2.73740775,0.764921841\",\n id: \"Stroke-1\"\n}), /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-3\",\n points: \"3.37563213 1.84831169 3.36911784 0.595324675 2.18174122 4.15223411e-14\"\n})), /*#__PURE__*/React.createElement(\"line\", {\n x1: 5.92223784,\n y1: 7.57277922,\n x2: 5.92223784,\n y2: 3.98212987,\n id: \"Stroke-9\"\n}), /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-2\",\n transform: \"translate(9.818105, 6.000000) scale(-1, -1) translate(-9.818105, -6.000000) translate(7.636287, 0.000000)\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M3.57419317,11.1560104 C2.91506589,10.8661403 2.29620875,10.4522182 1.75493083,9.91362078 C-0.568892549,7.60089351 -0.587250991,3.86936104 1.71406849,1.57845195 C2.03057585,1.26367293 2.37407977,0.992496226 2.73740775,0.764921841\",\n id: \"Stroke-1\"\n}), /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-3\",\n points: \"3.37563213 1.84831169 3.36911784 0.595324675 2.18174122 4.15223411e-14\"\n}))));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"-0.493 -0.5 12.993 13\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.9cfc97dd.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/shut-down/white\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-5\",\n transform: \"translate(1.000000, 0.000000)\",\n stroke: \"#FFFFFF\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M7.7735,2 C9.116,2.89710351 10,4.4271328 10,6.16330077 C10,8.92665975 7.7615,11.1666667 5,11.1666667 C2.2385,11.1666667 0,8.92665975 0,6.16330077 C0,4.43663919 0.8745,2.91361461 2.204,2.01450976\",\n id: \"Stroke-1\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 5,\n y1: 0.75,\n x2: 5,\n y2: 3.25,\n id: \"Stroke-3\"\n})));\n\nfunction SvgWhite(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWhite);\nexport default __webpack_public_path__ + \"static/media/white.fa4681e8.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/shut-down/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-5\",\n transform: \"translate(1.000000, 0.000000)\",\n stroke: \"#1B2559\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M7.7735,2 C9.116,2.89710351 10,4.4271328 10,6.16330077 C10,8.92665975 7.7615,11.1666667 5,11.1666667 C2.2385,11.1666667 0,8.92665975 0,6.16330077 C0,4.43663919 0.8745,2.91361461 2.204,2.01450976\",\n id: \"Stroke-1\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 5,\n y1: 0.75,\n x2: 5,\n y2: 3.25,\n id: \"Stroke-3\"\n})));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.b27733af.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/unpair/white\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-12\",\n stroke: \"#FFFFFF\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-5\"\n}, /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-1\",\n points: \"3.75 6 2.25 6 0 3.75 3.75 0 6.75 3\"\n}), /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-3\",\n points: \"8.25 6 9.75 6 12 8.25 8.25 12 5.25 9\"\n})), /*#__PURE__*/React.createElement(\"line\", {\n x1: 8.25,\n y1: 3,\n x2: 8.25,\n y2: 1.5,\n id: \"Stroke-6\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 9.75,\n y1: 3,\n x2: 10.5,\n y2: 2.25,\n id: \"Stroke-7\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 9.75,\n y1: 4.5,\n x2: 11.25,\n y2: 4.5,\n id: \"Stroke-8\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 2.25,\n y1: 7.5,\n x2: 0.75,\n y2: 7.5,\n id: \"Stroke-9\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 2.25,\n y1: 9,\n x2: 1.5,\n y2: 9.75,\n id: \"Stroke-10\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 3.75,\n y1: 9,\n x2: 3.75,\n y2: 10.5,\n id: \"Stroke-11\"\n})));\n\nfunction SvgWhite(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWhite);\nexport default __webpack_public_path__ + \"static/media/white.f97c75d2.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/button/unpair/zodiac\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-12\",\n stroke: \"#1B2559\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-5\"\n}, /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-1\",\n points: \"3.75 6 2.25 6 0 3.75 3.75 0 6.75 3\"\n}), /*#__PURE__*/React.createElement(\"polyline\", {\n id: \"Stroke-3\",\n points: \"8.25 6 9.75 6 12 8.25 8.25 12 5.25 9\"\n})), /*#__PURE__*/React.createElement(\"line\", {\n x1: 8.25,\n y1: 3,\n x2: 8.25,\n y2: 1.5,\n id: \"Stroke-6\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 9.75,\n y1: 3,\n x2: 10.5,\n y2: 2.25,\n id: \"Stroke-7\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 9.75,\n y1: 4.5,\n x2: 11.25,\n y2: 4.5,\n id: \"Stroke-8\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 2.25,\n y1: 7.5,\n x2: 0.75,\n y2: 7.5,\n id: \"Stroke-9\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 2.25,\n y1: 9,\n x2: 1.5,\n y2: 9.75,\n id: \"Stroke-10\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 3.75,\n y1: 9,\n x2: 3.75,\n y2: 10.5,\n id: \"Stroke-11\"\n})));\n\nfunction SvgZodiac(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"12px\",\n height: \"12px\",\n viewBox: \"0 0 12 12\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgZodiac);\nexport default __webpack_public_path__ + \"static/media/zodiac.aa028a2c.svg\";\nexport { ForwardRef as ReactComponent };","import { useMutation } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core/styles'\nimport gql from 'graphql-tag'\nimport moment from 'moment'\nimport React, { useState } from 'react'\n\nimport { ConfirmDialog } from 'src/components/ConfirmDialog'\nimport { Status } from 'src/components/Status'\nimport ActionButton from 'src/components/buttons/ActionButton'\nimport { H3, Label3, P } from 'src/components/typography'\nimport { ReactComponent as RebootReversedIcon } from 'src/styling/icons/button/reboot/white.svg'\nimport { ReactComponent as RebootIcon } from 'src/styling/icons/button/reboot/zodiac.svg'\nimport { ReactComponent as ShutdownReversedIcon } from 'src/styling/icons/button/shut down/white.svg'\nimport { ReactComponent as ShutdownIcon } from 'src/styling/icons/button/shut down/zodiac.svg'\nimport { ReactComponent as UnpairReversedIcon } from 'src/styling/icons/button/unpair/white.svg'\nimport { ReactComponent as UnpairIcon } from 'src/styling/icons/button/unpair/zodiac.svg'\n\nimport styles from '../Machines.styles'\nconst useStyles = makeStyles(styles)\n\nconst MACHINE_ACTION = gql`\n mutation MachineAction(\n $deviceId: ID!\n $action: MachineAction!\n $newName: String\n ) {\n machineAction(deviceId: $deviceId, action: $action, newName: $newName) {\n deviceId\n }\n }\n`\n\nconst makeLastPing = lastPing => {\n if (!lastPing) return null\n const now = moment()\n const secondsAgo = now.diff(lastPing, 'seconds')\n if (secondsAgo < 60) {\n return `${secondsAgo} ${secondsAgo === 1 ? 'second' : 'seconds'} ago`\n }\n if (secondsAgo < 3600) {\n const minutes = Math.round(secondsAgo / 60)\n return `${minutes} ${minutes === 1 ? 'minute' : 'minutes'} ago`\n }\n if (secondsAgo < 3600 * 24) {\n const hours = Math.round(secondsAgo / 3600)\n return `${hours} ${hours === 1 ? 'hour' : 'hours'} ago`\n }\n const days = Math.round(secondsAgo / 3600 / 24)\n return `${days} ${days === 1 ? 'day' : 'days'} ago`\n}\n\nconst Overview = ({ data, onActionSuccess }) => {\n const [action, setAction] = useState('')\n const [confirmActionDialogOpen, setConfirmActionDialogOpen] = useState(false)\n const [errorMessage, setErrorMessage] = useState(null)\n const classes = useStyles()\n\n const [machineAction] = useMutation(MACHINE_ACTION, {\n onError: ({ message }) => {\n const errorMessage = message ?? 'An error ocurred'\n setErrorMessage(errorMessage)\n },\n onCompleted: () => {\n onActionSuccess && onActionSuccess()\n setConfirmActionDialogOpen(false)\n }\n })\n\n const confirmActionDialog = action =>\n setAction(action) || setConfirmActionDialogOpen(true)\n\n return (\n <>\n \n
\n \n
\n {data.name}
\n\n
\n \n Status \n {data && data.statuses ?
\n \n
\n \n Last ping \n
\n {makeLastPing(data.lastPing)}
\n\n
\n \n {' '}\n Actions \n {data.name && (\n
\n \n confirmActionDialog('Unpair')}>\n Unpair\n \n confirmActionDialog('Reboot')}>\n Reboot\n \n confirmActionDialog('Shutdown')}>\n Shutdown\n \n
\n )}\n \n
\n )\n}\n\nexport default memo(DetailsRow, (prev, next) => prev.id === next.id)\n","import { makeStyles, Box } from '@material-ui/core'\nimport classnames from 'classnames'\nimport * as R from 'ramda'\nimport React, { useState, useEffect } from 'react'\nimport {\n AutoSizer,\n List,\n CellMeasurer,\n CellMeasurerCache\n} from 'react-virtualized'\n\nimport {\n Table,\n TBody,\n THead,\n Tr,\n Td,\n Th\n} from 'src/components/fake-table/Table'\nimport styles from 'src/components/tables/DataTable.styles'\nimport { H4 } from 'src/components/typography'\nimport { ReactComponent as ExpandClosedIcon } from 'src/styling/icons/action/expand/closed.svg'\nimport { ReactComponent as ExpandOpenIcon } from 'src/styling/icons/action/expand/open.svg'\n\nconst useStyles = makeStyles(styles)\n\nconst Row = ({\n id,\n elements,\n data,\n width,\n Details,\n expanded,\n expandRow,\n expWidth,\n expandable,\n onClick\n}) => {\n const classes = useStyles()\n\n const hasPointer = onClick || expandable\n const trClasses = {\n [classes.pointer]: hasPointer,\n [classes.row]: true,\n [classes.expanded]: expanded\n }\n\n return (\n \n
\n \n \n
\n\n \n \n {tx.txClass === 'cashOut' ?
\n \n \n \n {tx.customerPhone && (\n \n {tx.customerPhone}\n \n )}\n {tx.customerIdCardPhotoPath && !tx.customerIdCardData && (\n \n \n \n \n
\n \n
\n \n )}\n {tx.customerFrontCameraPath && (\n \n
\n \n \n
\n {customer.name}
\n \n \n
\n {customer.age}
\n \n \n
\n {customer.country}
\n \n
\n \n \n
\n {customer.idCardNumber}
\n \n \n
\n {customer.idCardExpirationDate}
\n \n \n
\n {crypto > 0 ? displayExRate : '-'}
\n \n \n
\n \n {`${commission} ${tx.fiatCode} (${commissionPercentage * 100} %)`}\n {discount && (\n
\n \n {discount} \n
\n )}\n \n \n
\n \n {tx.txClass === 'cashIn'\n ? `${Number.parseFloat(tx.cashInFee)} ${tx.fiatCode}`\n : 'N/A'}\n
\n \n
\n \n \n
\n \n \n {formatAddress(tx.cryptoCode, tx.toAddress)}\n \n
\n \n \n
\n \n {tx.txClass === 'cashOut' ? (\n 'N/A'\n ) : (\n {tx.txHash} \n )}\n
\n \n \n {tx.id} \n
\n \n
\n \n {getStatusDetails(tx) ? (\n \n \n ) : (\n errorElements\n )}\n
\n {getStatusDetails(tx)}
\n\n
\n )\n}\n\nconst DataTable = ({\n elements = [],\n data = [],\n Details,\n className,\n expandable,\n initialExpanded,\n onClick,\n loading,\n emptyText,\n extraHeight,\n ...props\n}) => {\n const [expanded, setExpanded] = useState(initialExpanded)\n\n useEffect(() => setExpanded(initialExpanded), [initialExpanded])\n\n const coreWidth = R.compose(R.sum, R.map(R.prop('width')))(elements)\n const expWidth = 850 - coreWidth\n const width = coreWidth + (expandable ? expWidth : 0)\n\n const classes = useStyles({ width })\n\n const expandRow = id => {\n setExpanded(id === expanded ? null : id)\n }\n\n const cache = new CellMeasurerCache({\n defaultHeight: 62,\n fixedWidth: true\n })\n\n function rowRenderer({ index, key, parent, style }) {\n return (\n \n {\n expandable && expandRow(id)\n onClick && onClick(data)\n }}\n error={data.error}\n errorMessage={data.errorMessage}>\n {elements.map(({ view = it => it?.toString(), ...props }, idx) => (\n \n {view(data)}\n \n ))}\n {expandable && (\n \n expandRow(id)}\n className={classes.expandButton}>\n {expanded && \n )}\n \n
\n {expandable && expanded && (\n \n \n \n \n \n
\n )}\n \n
\n
\n \n )\n }\n\n return (\n | }\n |
|---|
\n \n Dashboard\n \n \n \n {selectedMachine}\n \n \n
\n \n \n {'Details'} \n
\n \n
\n {'Cash cassettes'} \n
\n \n {'Latest transactions'} \n
\n \n {'Commissions'} \n
\n \n \n
\n )\n}\n\nexport default CashCassettesFooter\n","import { useQuery, useMutation } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React from 'react'\nimport * as Yup from 'yup'\n\nimport { Table as EditableTable } from 'src/components/editableTable'\nimport { CashOut, CashIn } from 'src/components/inputs/cashbox/Cashbox'\nimport { NumberInput, CashCassetteInput } from 'src/components/inputs/formik'\nimport TitleSection from 'src/components/layout/TitleSection'\nimport { EmptyTable } from 'src/components/table'\nimport { fromNamespace } from 'src/utils/config'\n\nimport styles from './CashCassettes.styles.js'\nimport CashCassettesFooter from './CashCassettesFooter'\n\nconst useStyles = makeStyles(styles)\n\nconst ValidationSchema = Yup.object().shape({\n name: Yup.string().required(),\n cashbox: Yup.number()\n .label('Cashbox')\n .required()\n .integer()\n .min(0)\n .max(1000),\n cassette1: Yup.number()\n .label('Cassette 1 (top)')\n .required()\n .integer()\n .min(0)\n .max(500),\n cassette2: Yup.number()\n .label('Cassette 2 (bottom)')\n .required()\n .integer()\n .min(0)\n .max(500)\n})\n\nconst GET_MACHINES_AND_CONFIG = gql`\n query getData {\n machines {\n name\n id: deviceId\n cashbox\n cassette1\n cassette2\n }\n config\n }\n`\n\n/* \n // for cash in total calculation\n bills {\n fiat\n deviceId\n created\n cashbox\n }\n*/\n\nconst SET_CASSETTE_BILLS = gql`\n mutation MachineAction(\n $deviceId: ID!\n $action: MachineAction!\n $cashbox: Int!\n $cassette1: Int!\n $cassette2: Int!\n ) {\n machineAction(\n deviceId: $deviceId\n action: $action\n cashbox: $cashbox\n cassette1: $cassette1\n cassette2: $cassette2\n ) {\n deviceId\n cashbox\n cassette1\n cassette2\n }\n }\n`\n\nconst CashCassettes = () => {\n const classes = useStyles()\n\n const { data } = useQuery(GET_MACHINES_AND_CONFIG)\n\n const machines = R.path(['machines'])(data) ?? []\n const config = R.path(['config'])(data) ?? {}\n const [setCassetteBills, { error }] = useMutation(SET_CASSETTE_BILLS, {\n refetchQueries: () => ['getData']\n })\n const bills = R.groupBy(bill => bill.deviceId)(R.path(['bills'])(data) ?? [])\n const deviceIds = R.uniq(\n R.map(R.prop('deviceId'))(R.path(['bills'])(data) ?? [])\n )\n const cashout = data?.config && fromNamespace('cashOut')(data.config)\n const locale = data?.config && fromNamespace('locale')(data.config)\n const fiatCurrency = locale?.fiatCurrency\n\n const onSave = (...[, { id, cashbox, cassette1, cassette2 }]) => {\n return setCassetteBills({\n variables: {\n action: 'setCassetteBills',\n deviceId: id,\n cashbox,\n cassette1,\n cassette2\n }\n })\n }\n const getCashoutSettings = id => fromNamespace(id)(cashout)\n const isCashOutDisabled = ({ id }) => !getCashoutSettings(id).active\n\n const elements = [\n {\n name: 'name',\n header: 'Machine',\n width: 254,\n view: name => <>{name},\n input: ({ field: { value: name } }) => <>{name}\n },\n {\n name: 'cashbox',\n header: 'Cashbox',\n width: 240,\n view: value => (\n \n Cash value in System \n {/*
\n \n Cash-in: \n \n {totalInCashBox} {currencyCode}\n \n
*/}\n \n Cash-out: \n \n {totalInCassettes} {currencyCode}\n \n
\n {/* \n Total: \n \n {total} {currencyCode}\n \n
*/}\n \n
\n {children}
\n}\n\nconst useMDStyles = makeStyles(machineDetailsStyles)\n\nconst Container = ({ children, ...props }) => (\n - \n {machine.statuses.map((status, index) => (\n
- \n
\n \n ))}\n
- \n {machine.statuses\n .map(article)\n .map(({ label, article }, index) => (\n
- \n
\n \n \n ))}\n
\n \n setAction({\n command: 'rename',\n display: 'Rename',\n confirmationMessage: 'Write the new name for this machine'\n })\n }>\n Rename\n \n \n setAction({\n command: 'unpair',\n display: 'Unpair'\n })\n }>\n Unpair\n \n \n setAction({\n command: 'reboot',\n display: 'Reboot'\n })\n }>\n Reboot\n \n \n setAction({\n command: 'shutdown',\n display: 'Shutdown',\n message:\n 'In order to bring it back online, the machine will need to be visited and its power reset.'\n })\n }>\n Shutdown\n \n {\n fetchMachineEvents()\n setAction({\n command: 'restartServices',\n display: 'Restart services for'\n })\n }}>\n Restart Services\n \n
\n \n \n setAction({\n command: 'rename',\n display: 'Rename',\n confirmationMessage: 'Write the new name for this machine'\n })\n }>\n Rename\n \n \n setAction({\n command: 'unpair',\n display: 'Unpair'\n })\n }>\n Unpair\n \n \n setAction({\n command: 'reboot',\n display: 'Reboot'\n })\n }>\n Reboot\n \n \n setAction({\n command: 'shutdown',\n display: 'Shutdown',\n message:\n 'In order to bring it back online, the machine will need to be visited and its power reset.'\n })\n }>\n Shutdown\n \n {\n fetchMachineEvents()\n setAction({\n command: 'restartServices',\n display: 'Restart services for'\n })\n }}>\n Restart Services\n \n
\n \n
\n \n Machine Status \n
\n \n
\n \n
\n \n
\n \n setEditing(true)}\n className={classes.button}\n disabled={disabled}>\n {disabled ?
\n )\n}\n\nexport default Header\n","export default {\n header: {\n display: 'flex',\n alignItems: 'center',\n marginBottom: 16,\n height: 26,\n margin: 0\n },\n title: {\n flexShrink: 2,\n margin: 0,\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis'\n },\n button: {\n border: 'none',\n backgroundColor: 'transparent',\n cursor: 'pointer',\n marginLeft: 8\n },\n editingButtons: {\n display: 'flex',\n flexShrink: 0,\n marginLeft: 16,\n justifyContent: 'space-between',\n width: 110\n }\n}\n","import { makeStyles } from '@material-ui/core'\nimport classnames from 'classnames'\nimport { useFormikContext, Field as FormikField } from 'formik'\nimport React from 'react'\n\nimport { NumberInput } from 'src/components/inputs/formik'\nimport { Label1, Info1, TL2 } from 'src/components/typography'\n\nimport styles from './EditableNumber.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst EditableNumber = ({\n label,\n name,\n editing,\n displayValue,\n decoration,\n className,\n decimalPlaces = 0,\n width = 80\n}) => {\n const classes = useStyles({ width, editing })\n const { values } = useFormikContext()\n\n const classNames = {\n [classes.fieldWrapper]: true,\n className\n }\n\n return (\n {title}
\n {!editing && (\n\n \n Save\n \n \n Cancel\n \n
\n )}\n \n {label && {label} }\n
\n )\n}\n\nexport default EditableNumber\n","export default {\n text: {\n margin: [[7, 0, 7, 1]]\n },\n fieldWrapper: {\n height: 53\n },\n valueWrapper: {\n display: 'flex',\n alignItems: 'baseline'\n },\n label: {\n margin: 0\n },\n decoration: {\n margin: [[0, 0, 0, 7]]\n }\n}\n","import { Form, Formik } from 'formik'\nimport React, { useContext, useState } from 'react'\nimport * as Yup from 'yup'\n\nimport PromptWhenDirty from 'src/components/PromptWhenDirty'\nimport { transformNumber } from 'src/utils/number'\n\nimport NotificationsCtx from '../NotificationsContext'\n\nimport Header from './EditHeader'\nimport EditableNumber from './EditableNumber'\n\nconst SingleFieldEditableNumber = ({\n title,\n label,\n width = 80,\n min = 0,\n max = 9999999,\n name,\n section,\n className\n}) => {\n const [saving, setSaving] = useState(false)\n\n const innerSave = async (section, value) => {\n if (saving) return\n\n setSaving(true)\n\n // no response means the save failed\n await save(section, value)\n\n setSaving(false)\n }\n\n const {\n save,\n data,\n currency,\n isEditing,\n isDisabled,\n setEditing\n } = useContext(NotificationsCtx)\n\n const schema = Yup.object().shape({\n [name]: Yup.number()\n .transform(transformNumber)\n .integer()\n .min(min)\n .max(max)\n .nullable()\n })\n\n return (\n \n {!editing && (\n {displayValue(values[name])} \n )}\n {editing && (\n {decoration} \n
\n \n setEditing(LOW_BALANCE_KEY, it)}\n width={fieldWidth}\n />\n\n \n\n setEditing(HIGH_BALANCE_KEY, it)}\n width={fieldWidth}\n />\n
\n )\n}\n\nexport default CryptoBalanceAlerts\n","export default {\n cryptoBalanceAlerts: {\n display: 'flex',\n marginBottom: 36,\n height: 135,\n alignItems: 'center'\n },\n cryptoBalanceAlertsForm: {\n width: 222,\n marginRight: 32\n },\n cryptoBalanceAlertsSecondForm: {\n marginLeft: 50\n },\n vertSeparator: {\n width: 1,\n height: '100%',\n borderRight: [[1, 'solid', 'black']]\n }\n}\n","import * as R from 'ramda'\nimport React, { useContext } from 'react'\nimport * as Yup from 'yup'\n\nimport { Table as EditableTable } from 'src/components/editableTable'\nimport { NumberInput } from 'src/components/inputs/formik'\nimport Autocomplete from 'src/components/inputs/formik/Autocomplete.js'\nimport { transformNumber } from 'src/utils/number'\n\nimport NotificationsCtx from '../NotificationsContext'\n\nconst HIGH_BALANCE_KEY = 'highBalance'\nconst LOW_BALANCE_KEY = 'lowBalance'\nconst CRYPTOCURRENCY_KEY = 'cryptoCurrency'\nconst NAME = 'cryptoBalanceOverrides'\n\nconst CryptoBalanceOverrides = ({ section }) => {\n const {\n cryptoCurrencies = [],\n data,\n save,\n error,\n currency,\n isDisabled,\n setEditing\n } = useContext(NotificationsCtx)\n const setupValues = data?.cryptoBalanceOverrides ?? []\n const innerSetEditing = it => setEditing(NAME, it)\n\n const onDelete = id => {\n const newOverrides = {\n cryptoBalanceOverrides: R.reject(it => it.id === id, setupValues)\n }\n return save(newOverrides)\n }\n\n const overridenCryptos = R.map(R.prop(CRYPTOCURRENCY_KEY))(setupValues)\n const suggestionFilter = R.filter(\n it => !R.contains(it.code, overridenCryptos)\n )\n const suggestions = suggestionFilter(cryptoCurrencies)\n\n const findSuggestion = it => {\n const coin = R.compose(R.find(R.propEq('code', it?.cryptoCurrency)))(\n cryptoCurrencies\n )\n return coin ? [coin] : []\n }\n\n const initialValues = {\n [CRYPTOCURRENCY_KEY]: null,\n [LOW_BALANCE_KEY]: '',\n [HIGH_BALANCE_KEY]: ''\n }\n\n const notesMin = 0\n const currencyMax = 9999999\n const validationSchema = Yup.object().shape(\n {\n [CRYPTOCURRENCY_KEY]: Yup.string()\n .label('Cryptocurrency')\n .nullable()\n .required(),\n [LOW_BALANCE_KEY]: Yup.number()\n .label('Low Balance')\n .when(HIGH_BALANCE_KEY, {\n is: HIGH_BALANCE_KEY => !HIGH_BALANCE_KEY,\n then: Yup.number().required()\n })\n .transform(transformNumber)\n .integer()\n .min(notesMin)\n .max(currencyMax)\n .nullable(),\n [HIGH_BALANCE_KEY]: Yup.number()\n .label('High Balance')\n .when(LOW_BALANCE_KEY, {\n is: LOW_BALANCE_KEY => !LOW_BALANCE_KEY,\n then: Yup.number().required()\n })\n .transform(transformNumber)\n .integer()\n .min(notesMin)\n .max(currencyMax)\n .nullable()\n },\n [LOW_BALANCE_KEY, HIGH_BALANCE_KEY]\n )\n\n const viewCrypto = it =>\n R.compose(\n R.path(['display']),\n R.find(R.propEq('code', it))\n )(cryptoCurrencies)\n\n const elements = [\n {\n name: CRYPTOCURRENCY_KEY,\n header: 'Cryptocurrency',\n width: 166,\n size: 'sm',\n view: viewCrypto,\n input: Autocomplete,\n inputProps: {\n options: it => R.concat(suggestions, findSuggestion(it)),\n optionsLimit: null,\n valueProp: 'code',\n labelProp: 'display'\n }\n },\n {\n name: LOW_BALANCE_KEY,\n width: 155,\n textAlign: 'right',\n bold: true,\n input: NumberInput,\n suffix: currency,\n inputProps: {\n decimalPlaces: 2\n }\n },\n {\n name: HIGH_BALANCE_KEY,\n width: 155,\n textAlign: 'right',\n bold: true,\n input: NumberInput,\n suffix: currency,\n inputProps: {\n decimalPlaces: 2\n }\n }\n ]\n\n return (\n | Channel | \n {Object.keys(sizes).map(it => (\n\n {startCase(it)}\n | \n ))}\n \n \n
|---|
\n {label} }\n
\n )\n})\n\nconst CoinATMRadar = memo(() => {\n const classes = useStyles()\n\n const { data } = useQuery(GET_CONFIG)\n\n const [saveConfig] = useMutation(SAVE_CONFIG, {\n refetchQueries: ['getData']\n })\n\n const save = it =>\n saveConfig({\n variables: { config: toNamespace(namespaces.COIN_ATM_RADAR, it) }\n })\n\n const coinAtmRadarConfig =\n data?.config && fromNamespace(namespaces.COIN_ATM_RADAR, data.config)\n if (!coinAtmRadarConfig) return null\n\n return (\n \n save && save(event.target.checked)}\n />\n
\n {label && {title}
\n\n
\n )\n})\n\nexport default CoinATMRadar\n","import CoinATMRadar from './CoinATMRadar'\n\nexport default CoinATMRadar\n","import { createMuiTheme } from '@material-ui/core/styles'\n\nimport typographyStyles from 'src/components/typography/styles'\n\nimport {\n backgroundColor,\n inputFontFamily,\n secondaryColor,\n fontColor,\n offColor,\n subheaderColor,\n fontSize3,\n fontSize5\n} from './variables'\n\nconst { p } = typographyStyles\n\nexport default createMuiTheme({\n typography: {\n fontFamily: inputFontFamily,\n body1: { ...p }\n },\n MuiButtonBase: {\n disableRipple: true\n },\n palette: {\n primary: {\n light: secondaryColor,\n dark: secondaryColor,\n main: secondaryColor\n },\n secondary: {\n light: secondaryColor,\n dark: secondaryColor,\n main: secondaryColor\n },\n background: {\n default: backgroundColor\n }\n },\n overrides: {\n MuiRadio: {\n colorSecondary: {\n color: secondaryColor\n }\n },\n MuiAutocomplete: {\n root: {\n color: fontColor\n },\n noOptions: {\n padding: [[6, 16]]\n },\n option: {\n '&[data-focus=\"true\"]': {\n backgroundColor: subheaderColor\n }\n },\n paper: {\n color: fontColor,\n margin: 0\n },\n listbox: {\n padding: 0\n },\n tag: {\n '&[data-tag-index=\"0\"]': {\n marginLeft: 0\n },\n margin: 2,\n backgroundColor: subheaderColor,\n borderRadius: 4,\n height: 18\n }\n },\n MuiChip: {\n label: {\n paddingLeft: 4,\n paddingRight: 4,\n color: fontColor,\n fontSize: fontSize5\n }\n },\n MuiInput: {\n root: {\n color: fontColor\n },\n underline: {\n '&:before': {\n borderBottom: [[2, 'solid', fontColor]]\n }\n }\n },\n MuiInputLabel: {\n root: {\n font: 'inherit',\n fontSize: fontSize3,\n color: offColor\n },\n shrink: {\n color: fontColor,\n transform: 'translate(0, 1.7px) scale(0.83)'\n }\n },\n MuiFormLabel: {\n root: {\n '&$focused': {\n color: fontColor\n }\n }\n },\n MuiListItem: {\n root: {\n '&:nth-of-type(odd)': {\n backgroundColor: backgroundColor\n }\n }\n }\n }\n})\n","import typographyStyles from 'src/components/typography/styles'\nimport theme from 'src/styling/theme'\nimport { offColor } from 'src/styling/variables'\n\nconst { p } = typographyStyles\n\nconst styles = {\n header: {\n display: 'flex',\n alignItems: 'center',\n position: 'relative',\n flex: 'wrap'\n },\n transparentButton: {\n '& > *': {\n margin: 'auto 12px'\n },\n '& button': {\n border: 'none',\n backgroundColor: 'transparent',\n cursor: 'pointer'\n }\n },\n section: {\n marginBottom: 52\n },\n row: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n marginBottom: 28,\n width: 600,\n '&:last-child': {\n marginBottom: 0\n }\n },\n switchRow: {\n display: 'flex',\n alignItems: 'center',\n marginBottom: 28,\n width: 600\n },\n switch: {\n display: 'flex',\n alignItems: 'center',\n marginLeft: 120\n },\n submit: {\n justifyContent: 'flex-start',\n alignItems: 'center',\n height: 19,\n padding: [[0, 4, 4, 4]],\n '& > button': {\n marginRight: 40\n }\n },\n singleButton: {\n marginTop: 50,\n paddingLeft: 0\n }\n}\n\nconst contactInfoStyles = {\n infoMessage: {\n display: 'flex',\n marginBottom: 52,\n '& > p': {\n width: 330,\n color: offColor,\n marginTop: 4,\n marginLeft: 16\n }\n },\n radioButtonsRow: {\n height: 60,\n marginBottom: 14\n },\n radioButtons: {\n display: 'flex',\n flexDirection: 'row',\n paddingLeft: 4\n },\n rowWrapper: {\n display: 'flex',\n alignItems: 'center',\n position: 'relative',\n flex: 'wrap'\n },\n transparentButton: {\n '& > *': {\n margin: 'auto 12px'\n },\n '& button': {\n border: 'none',\n backgroundColor: 'transparent',\n cursor: 'pointer'\n }\n }\n}\n\nconst termsConditionsStyles = {\n enable: {\n display: 'flex',\n alignItems: 'center',\n marginBottom: 22 - theme.spacing(1),\n '& > span:first-child': {\n extend: p,\n marginRight: 116 - theme.spacing(1)\n },\n '& > span:last-child': {\n marginLeft: 4\n }\n }\n}\n\nconst fieldStyles = {\n field: {\n position: 'relative',\n width: 280,\n padding: [[0, 4, 4, 0]]\n },\n notEditing: {\n display: 'flex',\n flexDirection: 'column'\n },\n notEditingSingleLine: {\n '& > p:first-child': {\n height: 16,\n lineHeight: '16px',\n transform: 'scale(0.75)',\n transformOrigin: 'left',\n paddingLeft: 0,\n margin: [[1, 0, 6, 0]]\n },\n '& > p:last-child': {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n height: 25,\n margin: 0\n }\n },\n notEditingMultiline: {\n '& > p:first-child': {\n height: 16,\n lineHeight: '16px',\n transform: 'scale(0.75)',\n transformOrigin: 'left',\n paddingLeft: 0,\n margin: [[1, 0, 5, 0]]\n },\n '& > p:last-child': {\n width: 502,\n height: 121,\n overflowY: 'auto',\n lineHeight: '19px',\n wordWrap: 'anywhere',\n margin: 0\n }\n }\n}\n\nexport { styles, contactInfoStyles, termsConditionsStyles, fieldStyles }\n","import { useQuery, useMutation } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport classnames from 'classnames'\nimport { Form, Formik, Field as FormikField } from 'formik'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\nimport * as Yup from 'yup'\n\nimport ErrorMessage from 'src/components/ErrorMessage'\nimport PromptWhenDirty from 'src/components/PromptWhenDirty'\nimport { Link, IconButton } from 'src/components/buttons'\nimport Switch from 'src/components/inputs/base/Switch'\nimport { TextInput } from 'src/components/inputs/formik'\nimport { P, H4, Info3, Label1, Label2, Label3 } from 'src/components/typography'\nimport { ReactComponent as EditIcon } from 'src/styling/icons/action/edit/enabled.svg'\nimport { ReactComponent as WarningIcon } from 'src/styling/icons/warning-icon/comet.svg'\nimport { fontSize5 } from 'src/styling/variables'\nimport { fromNamespace, toNamespace, namespaces } from 'src/utils/config'\n\nimport {\n styles as globalStyles,\n contactInfoStyles\n} from './OperatorInfo.styles'\n\nconst FIELD_WIDTH = 280\n\nconst fieldStyles = {\n field: {\n position: 'relative',\n width: 280,\n height: 48,\n padding: [[0, 4, 4, 0]]\n },\n notEditing: {\n display: 'flex',\n flexDirection: 'column',\n '& > p:first-child': {\n height: 16,\n lineHeight: '16px',\n fontSize: fontSize5,\n transformOrigin: 'left',\n paddingLeft: 0,\n margin: [[3, 0, 3, 0]]\n },\n '& > p:last-child': {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n margin: 0\n }\n }\n}\n\nconst fieldUseStyles = makeStyles(fieldStyles)\n\nconst Field = ({ editing, field, displayValue, ...props }) => {\n const classes = fieldUseStyles()\n\n const classNames = {\n [classes.field]: true,\n [classes.notEditing]: !editing\n }\n\n return (\n \n save({ active: value })}\n label={coinAtmRadarConfig.active ? 'Yes' : 'No'}\n />\n save({ commissions: value })}\n />\n save({ limitsAndVerification: value })}\n />\n
\n \n \n \n
\n Coin ATM Radar share settings
\n\n For details on configuring this panel, please read the relevant\n knowledgebase article{' '}\n
{'Machine info'}
\n\n {!editing && (\n <>\n {field.label} \n {displayValue(field.value)} \n \n )}\n {editing && (\n
\n )\n}\n\nconst GET_CONFIG = gql`\n query getData {\n config\n }\n`\n\nconst SAVE_CONFIG = gql`\n mutation Save($config: JSONObject) {\n saveConfig(config: $config)\n }\n`\n\nconst styles = R.merge(globalStyles, contactInfoStyles)\n\nconst contactUseStyles = makeStyles(styles)\n\nconst ContactInfo = ({ wizard }) => {\n const classes = contactUseStyles()\n\n const [editing, setEditing] = useState(wizard || false)\n const [error, setError] = useState(null)\n\n const [saveConfig] = useMutation(SAVE_CONFIG, {\n onCompleted: () => setEditing(false),\n refetchQueries: () => ['getData'],\n onError: e => setError(e)\n })\n\n const { data } = useQuery(GET_CONFIG)\n\n const save = it => {\n return saveConfig({\n variables: { config: toNamespace(namespaces.OPERATOR_INFO, it) }\n })\n }\n\n const info =\n data?.config && fromNamespace(namespaces.OPERATOR_INFO, data.config)\n\n if (!info) return null\n\n const validationSchema = Yup.object().shape({\n active: Yup.boolean(),\n name: Yup.string(),\n phone: Yup.string(),\n email: Yup.string()\n .email('Please enter a valid email address')\n .required(),\n website: Yup.string(),\n companyNumber: Yup.string()\n })\n\n const fields = [\n {\n name: 'name',\n label: 'Full name',\n value: info.name ?? '',\n component: TextInput\n },\n {\n name: 'phone',\n label: 'Phone number',\n value: info.phone,\n component: TextInput\n },\n {\n name: 'email',\n label: 'Email',\n value: info.email ?? '',\n component: TextInput\n },\n {\n name: 'website',\n label: 'Website',\n value: info.website ?? '',\n component: TextInput\n },\n {\n name: 'companyNumber',\n label: 'Company number',\n value: info.companyNumber ?? '',\n component: TextInput\n }\n ]\n\n const findField = name => R.find(R.propEq('name', name))(fields)\n const findValue = name => findField(name).value\n\n const displayTextValue = value => value\n\n const form = {\n initialValues: {\n active: info.active,\n name: findValue('name'),\n phone: findValue('phone'),\n email: findValue('email'),\n website: findValue('website'),\n companyNumber: findValue('companyNumber')\n }\n }\n\n return (\n <>\n \n
\n Contact information
\n\n
\n Info card enabled?
\n\n \n save({\n active: event.target.checked\n })\n }\n />\n {info.active ? 'Yes' : 'No'} \n
\n \n save(validationSchema.cast(values))}\n onReset={() => {\n setEditing(false)\n setError(null)\n }}>\n \n \n
\n {!wizard && (\n \n setEditing(true)}>\n
\n Info card
\n {!editing && (\n\n \n Sharing your information with your customers through your machines\n allows them to contact you in case there's a problem with a machine\n in your network or a transaction.\n \n
\n )}\n \n )\n}\n\nexport default ContactInfo\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/table/false\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-4\",\n stroke: \"#FF584A\",\n strokeWidth: 4\n}, /*#__PURE__*/React.createElement(\"line\", {\n x1: 13.5,\n y1: 0.5,\n x2: 0.995667,\n y2: 13.004333,\n id: \"Line-7\"\n}), /*#__PURE__*/React.createElement(\"line\", {\n x1: 13.5,\n y1: 0.5,\n x2: 0.995667,\n y2: 13.004333,\n id: \"Line-7\",\n transform: \"translate(7.000000, 7.000000) scale(-1, 1) translate(-7.000000, -7.000000) \"\n})));\n\nfunction SvgFalse(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"14px\",\n height: \"14px\",\n viewBox: \"0 0 14 14\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgFalse);\nexport default __webpack_public_path__ + \"static/media/false.7f926859.svg\";\nexport { ForwardRef as ReactComponent };","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/table/true\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M4.17451294,13.3251347 L0.599425104,9.29667256 C-0.199808368,8.3960844 -0.199808368,6.94040225 0.599425104,6.03981409 C1.39865858,5.13922593 2.69051421,5.13922593 3.48974768,6.03981409 L5.61967423,8.439847 L12.5102523,0.675441122 C13.3094858,-0.225147041 14.6033855,-0.225147041 15.4005749,0.675441122 C16.1998084,1.57372599 16.1998084,3.03171143 15.4005749,3.93229959 L7.06483552,13.3251347 C6.66624082,13.7742771 6.14295752,14 5.61967423,14 C5.09639093,14 4.57310763,13.7742771 4.17451294,13.3251347 Z\",\n id: \"Fill-1\",\n fill: \"#48F694\"\n}));\n\nfunction SvgTrue(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"16px\",\n height: \"14px\",\n viewBox: \"0 0 16 14\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgTrue);\nexport default __webpack_public_path__ + \"static/media/true.8e532da3.svg\";\nexport { ForwardRef as ReactComponent };","import baseStyles from 'src/pages/Logs.styles'\nimport { backgroundColor, zircon } from 'src/styling/variables'\n\nconst { fillColumn } = baseStyles\n\nconst booleanPropertiesTableStyles = {\n booleanPropertiesTableWrapper: {\n display: 'flex',\n flexDirection: 'column',\n width: 396\n },\n tableRow: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n '&:nth-child(even)': {\n backgroundColor: backgroundColor\n },\n '&:nth-child(odd)': {\n backgroundColor: zircon\n },\n minHeight: 32,\n height: 'auto',\n padding: [[8, 16, 8, 24]],\n boxShadow: '0 0 0 0 rgba(0, 0, 0, 0)'\n },\n leftTableCell: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'left',\n width: 200,\n padding: [0]\n },\n rightTableCell: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'right',\n padding: [0]\n },\n transparentButton: {\n '& > *': {\n margin: 'auto 12px'\n },\n '& button': {\n border: 'none',\n backgroundColor: 'transparent',\n cursor: 'pointer'\n }\n },\n rowWrapper: {\n display: 'flex',\n alignItems: 'center',\n position: 'relative',\n flex: 'wrap'\n },\n rightAligned: {\n marginLeft: 'auto'\n },\n radioButtons: {\n display: 'flex',\n flexDirection: 'row',\n margin: [-15]\n },\n rightLink: {\n marginLeft: '20px'\n },\n fillColumn,\n popoverContent: {\n width: 272,\n padding: [[10, 15]]\n }\n}\n\nexport { booleanPropertiesTableStyles }\n","import { makeStyles } from '@material-ui/core/styles'\nimport classnames from 'classnames'\nimport { useFormikContext, Form, Formik, Field as FormikField } from 'formik'\nimport * as R from 'ramda'\nimport React, { useState, memo } from 'react'\nimport * as Yup from 'yup'\n\nimport PromptWhenDirty from 'src/components/PromptWhenDirty'\nimport { Link, IconButton } from 'src/components/buttons'\nimport { RadioGroup } from 'src/components/inputs/formik'\nimport { Table, TableBody, TableRow, TableCell } from 'src/components/table'\nimport { H4 } from 'src/components/typography'\nimport { ReactComponent as EditIconDisabled } from 'src/styling/icons/action/edit/disabled.svg'\nimport { ReactComponent as EditIcon } from 'src/styling/icons/action/edit/enabled.svg'\nimport { ReactComponent as FalseIcon } from 'src/styling/icons/table/false.svg'\nimport { ReactComponent as TrueIcon } from 'src/styling/icons/table/true.svg'\n\nimport { booleanPropertiesTableStyles } from './BooleanPropertiesTable.styles'\n\nconst useStyles = makeStyles(booleanPropertiesTableStyles)\n\nconst BooleanCell = ({ name }) => {\n const { values } = useFormikContext()\n return values[name] === 'true' ? \n \n {({ resetForm }) => {\n return (\n \n )\n }}\n \n
\n )\n }\n)\n\nexport default BooleanPropertiesTable\n","import { useQuery, useMutation } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core/styles'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React, { memo } from 'react'\n\nimport { BooleanPropertiesTable } from 'src/components/booleanPropertiesTable'\nimport { Switch } from 'src/components/inputs'\nimport { H4, P, Label2 } from 'src/components/typography'\nimport { fromNamespace, toNamespace, namespaces } from 'src/utils/config'\n\nimport { mainStyles } from './ReceiptPrinting.styles'\n\nconst useStyles = makeStyles(mainStyles)\n\nconst GET_CONFIG = gql`\n query getData {\n config\n }\n`\n\nconst SAVE_CONFIG = gql`\n mutation Save($config: JSONObject) {\n saveConfig(config: $config)\n }\n`\n\nconst ReceiptPrinting = memo(({ wizard }) => {\n const classes = useStyles()\n\n const { data } = useQuery(GET_CONFIG)\n\n const [saveConfig] = useMutation(SAVE_CONFIG, {\n refetchQueries: () => ['getData']\n })\n\n const save = it =>\n saveConfig({\n variables: { config: toNamespace(namespaces.RECEIPT, it) }\n })\n\n const receiptPrintingConfig =\n data?.config && fromNamespace(namespaces.RECEIPT, data.config)\n if (!receiptPrintingConfig) return null\n\n return (\n <>\n \n
\n Receipt options
\n\n {receiptPrintingConfig.active ? 'Yes' : 'No'} \n
\n Enable receipt printing?
\n\n \n saveConfig({\n variables: {\n config: toNamespace(\n namespaces.RECEIPT,\n R.merge(receiptPrintingConfig, {\n active: event.target.checked\n })\n )\n }\n })\n }\n />\n
\n \n {!editing && (\n <>\n {label} \n {value} \n \n )}\n {editing && (\n
\n )\n}\n\nconst GET_CONFIG = gql`\n query getData {\n config\n }\n`\n\nconst SAVE_CONFIG = gql`\n mutation Save($config: JSONObject) {\n saveConfig(config: $config)\n }\n`\n\nconst styles = R.merge(globalStyles, termsConditionsStyles)\n\nconst useTermsConditionsStyles = makeStyles(styles)\n\nconst TermsConditions = () => {\n const [error, setError] = useState(null)\n const [editing, setEditing] = useState(false)\n const [saveConfig] = useMutation(SAVE_CONFIG, {\n onCompleted: () => {\n setError(null)\n setEditing(false)\n },\n refetchQueries: () => ['getData'],\n onError: e => setError(e)\n })\n\n const classes = useTermsConditionsStyles()\n\n const { data } = useQuery(GET_CONFIG)\n\n const termsAndConditions =\n data?.config && fromNamespace(namespaces.TERMS_CONDITIONS, data.config)\n const formData = termsAndConditions ?? {}\n const showOnScreen = termsAndConditions?.active ?? false\n\n const save = it =>\n saveConfig({\n variables: { config: toNamespace(namespaces.TERMS_CONDITIONS, it) }\n })\n\n const fields = [\n {\n name: 'title',\n label: 'Screen title',\n value: formData.title ?? '',\n width: 282\n },\n {\n name: 'text',\n label: 'Text content',\n value: formData.text ?? '',\n width: 502,\n multiline: true,\n rows: 6\n },\n {\n name: 'acceptButtonText',\n label: 'Accept button text',\n value: formData.acceptButtonText ?? '',\n placeholder: 'I accept',\n width: 282\n },\n {\n name: 'cancelButtonText',\n label: 'Cancel button text',\n value: formData.cancelButtonText ?? '',\n placeholder: 'Cancel',\n width: 282\n }\n ]\n\n const findField = name => R.find(R.propEq('name', name))(fields)\n const findValue = name => findField(name).value\n\n const initialValues = {\n title: findValue('title'),\n text: findValue('text'),\n acceptButtonText: findValue('acceptButtonText'),\n cancelButtonText: findValue('cancelButtonText')\n }\n\n const validationSchema = Yup.object().shape({\n title: Yup.string()\n .required()\n .max(50, 'Too long'),\n text: Yup.string().required(),\n acceptButtonText: Yup.string()\n .required()\n .max(50, 'Too long'),\n cancelButtonText: Yup.string()\n .required()\n .max(50, 'Too long')\n })\n\n return (\n <>\n \n
\n Terms & Conditions
\n\n save(values)}\n onReset={() => {\n setEditing(false)\n setError(null)\n }}>\n \n \n
\n \n )\n}\n\nexport default TermsConditions\n","import { makeStyles } from '@material-ui/core'\nimport Chip from '@material-ui/core/Chip'\nimport * as R from 'ramda'\nimport React from 'react'\n\nimport {\n secondaryColorLighter,\n secondaryColorDarker,\n offErrorColor,\n errorColor,\n offColor,\n inputFontWeight,\n smallestFontSize,\n inputFontFamily,\n spacer\n} from 'src/styling/variables'\nimport { onlyFirstToUpper } from 'src/utils/string'\n\nimport typographyStyles from './typography/styles'\nconst { label1 } = typographyStyles\n\nconst colors = {\n running: secondaryColorDarker,\n notRunning: offErrorColor\n}\n\nconst backgroundColors = {\n running: secondaryColorLighter,\n notRunning: errorColor\n}\n\nconst styles = {\n uptimeContainer: {\n display: 'inline-block',\n minWidth: 104,\n margin: [[0, 20]]\n },\n name: {\n extend: label1,\n paddingLeft: 4,\n color: offColor\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nconst useChipStyles = makeStyles({\n root: {\n borderRadius: spacer / 2,\n marginTop: spacer / 2,\n marginRight: spacer / 4,\n marginBottom: spacer / 2,\n marginLeft: spacer / 4,\n height: spacer * 3,\n backgroundColor: ({ type }) => backgroundColors[type]\n },\n label: {\n fontSize: smallestFontSize,\n fontWeight: inputFontWeight,\n fontFamily: inputFontFamily,\n padding: [[spacer / 2, spacer]],\n color: ({ type }) => colors[type]\n }\n})\n\nconst Uptime = ({ process, ...props }) => {\n const classes = useStyles()\n\n const uptime = time => {\n if (time < 60) return `${time}s`\n if (time < 3600) return `${Math.floor(time / 60)}m`\n if (time < 86400) return `${Math.floor(time / 60 / 60)}h`\n return `${Math.floor(time / 60 / 60 / 24)}d`\n }\n\n return (\n \n Show on screen\n \n save({\n active: event.target.checked\n })\n }\n />\n {showOnScreen ? 'Yes' : 'No'} \n
\n \n Info card \n {!editing && (\n setEditing(true)}>\n
\n \n
\n )\n}\n\nexport default Uptime\n","import { useQuery } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport gql from 'graphql-tag'\nimport moment from 'moment'\nimport * as R from 'ramda'\nimport React, { useState, useRef } from 'react'\n\nimport LogsDowloaderPopover from 'src/components/LogsDownloaderPopper'\nimport Title from 'src/components/Title'\nimport Uptime from 'src/components/Uptime'\nimport { Select } from 'src/components/inputs'\nimport {\n Table,\n TableHead,\n TableRow,\n TableHeader,\n TableBody,\n TableCell\n} from 'src/components/table'\nimport { Info3, H4 } from 'src/components/typography'\nimport typographyStyles from 'src/components/typography/styles'\nimport { offColor } from 'src/styling/variables'\nimport { startCase } from 'src/utils/string'\n\nimport logsStyles from './Logs.styles'\n\nconst { p } = typographyStyles\nconst { tableWrapper } = logsStyles\n\nconst localStyles = {\n serverTableWrapper: {\n extend: tableWrapper,\n maxWidth: '100%',\n marginLeft: 0\n },\n serverVersion: {\n extend: p,\n color: offColor,\n margin: 'auto 0 auto 0'\n },\n headerLine2: {\n display: 'flex',\n justifyContent: 'space-between',\n marginBottom: 24\n },\n uptimeContainer: {\n margin: 'auto 0 auto 0'\n }\n}\n\nconst styles = R.merge(logsStyles, localStyles)\n\nconst useStyles = makeStyles(styles)\n\nconst SHOW_ALL = { code: 'SHOW_ALL', display: 'Show all' }\n\nconst formatDate = date => {\n return moment(date).format('YYYY-MM-DD HH:mm')\n}\n\nconst NUM_LOG_RESULTS = 500\n\nconst GET_CSV = gql`\n query ServerData($limit: Int, $from: Date, $until: Date) {\n serverLogsCsv(limit: $limit, from: $from, until: $until)\n }\n`\n\nconst GET_DATA = gql`\n query ServerData($limit: Int, $from: Date, $until: Date) {\n serverVersion\n uptime {\n name\n state\n uptime\n }\n serverLogs(limit: $limit, from: $from, until: $until) {\n logLevel\n id\n timestamp\n message\n }\n }\n`\n\nconst Logs = () => {\n const classes = useStyles()\n\n const tableEl = useRef()\n\n const [saveMessage, setSaveMessage] = useState(null)\n const [logLevel, setLogLevel] = useState(SHOW_ALL)\n\n const { data, loading } = useQuery(GET_DATA, {\n onCompleted: () => setSaveMessage(''),\n variables: {\n limit: NUM_LOG_RESULTS\n }\n })\n\n const defaultLogLevels = [\n { code: 'error', display: 'Error' },\n { code: 'info', display: 'Info' },\n { code: 'debug', display: 'Debug' }\n ]\n const serverVersion = data?.serverVersion\n const processStates = data?.uptime ?? []\n\n const getLogLevels = R.compose(\n R.prepend(SHOW_ALL),\n R.uniq,\n R.concat(defaultLogLevels),\n R.map(it => ({\n code: R.path(['logLevel'])(it),\n display: startCase(R.path(['logLevel'])(it))\n })),\n R.path(['serverLogs'])\n )\n\n const handleLogLevelChange = logLevel => {\n if (tableEl.current) tableEl.current.scrollTo(0, 0)\n\n setLogLevel(logLevel)\n }\n\n return (\n <>\n {R.toLower(process.name)}
\n \n
\n \n Server \n {data && (\n
\n \n R.path(['serverLogsCsv'])(logs)}\n />\n {saveMessage} \n
\n )}\n \n {serverVersion && Server version: v{serverVersion}}\n
\n \n {data && (\n
\n \n {processStates &&\n processStates.map((process, idx) => (\n
\n \n
\n \n )\n}\n\nexport default Logs\n","function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nvar _ref2 = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\");\n\nvar _ref3 = /*#__PURE__*/React.createElement(\"g\", {\n id: \"icon/action/edit/white\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n}, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M1,18 L1,18 C1,19.657 2.343,21 4,21 L18,21 C19.657,21 21,19.657 21,18\",\n id: \"Stroke-1\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2\n}), /*#__PURE__*/React.createElement(\"polygon\", {\n id: \"Stroke-3\",\n stroke: \"#FFFFFF\",\n strokeWidth: 2,\n points: \"6 12 17 1 21 5 10 16 6 16\"\n}));\n\nfunction SvgWhite(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, [\"title\", \"titleId\"]);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"22px\",\n height: \"22px\",\n viewBox: \"0 0 22 22\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _ref2, _ref3);\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWhite);\nexport default __webpack_public_path__ + \"static/media/white.5f161f2c.svg\";\nexport { ForwardRef as ReactComponent };","import typographyStyles from 'src/components/typography/styles'\nimport { offColor } from 'src/styling/variables'\n\nconst { label1, p } = typographyStyles\n\nexport default {\n tr: ({ height }) => ({\n margin: 0,\n height\n }),\n table: ({ width }) => ({\n width\n }),\n head: {\n display: 'flex',\n flex: 1,\n justifyContent: 'space-between',\n alignItems: 'center',\n paddingRight: 12\n },\n button: {\n marginBottom: 1\n },\n itemWrapper: {\n display: 'flex',\n flexDirection: 'column',\n marginTop: 16,\n minHeight: 35\n },\n label: {\n extend: label1,\n color: offColor,\n marginBottom: 4\n },\n item: {\n extend: p,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap'\n }\n}\n","import { makeStyles } from '@material-ui/core'\nimport classnames from 'classnames'\nimport React from 'react'\n\nimport { IconButton } from 'src/components/buttons'\nimport {\n Table,\n THead,\n TBody,\n Td,\n Th,\n Tr\n} from 'src/components/fake-table/Table'\nimport { ReactComponent as EditIcon } from 'src/styling/icons/action/edit/white.svg'\n\nimport styles from './SingleRowTable.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst SingleRowTable = ({\n width = 378,\n height = 128,\n title,\n items,\n onEdit,\n className\n}) => {\n const classes = useStyles({ width, height })\n\n return (\n <>\n \n \n
\n {loading &&
\n {'Loading...'}
}\n {!loading && !data?.serverLogs?.length && (\n{'No activity so far'}
\n )}\n| \n {title}\n | \n \n \n
|---|
| \n {items && (\n <>\n {items[0] && (\n \n \n )}\n {items[1] && (\n {items[0].label} \n {items[0].value} \n \n \n )}\n \n )}\n {items[1].label} \n {items[1].value} \n | \n
\n \n {R.values(schemas).map(schema => (\n \n setEditingSchema(schema)}\n items={getItems(schema.code, schema.elements)}\n />\n \n ))}\n \n {editingSchema && (\n setEditingSchema(null)}\n open={true}>\n \n saveAccount({\n variables: { accounts: { [editingSchema.code]: it } }\n })\n }\n elements={getElements(editingSchema)}\n validationSchema={getValidationSchema(editingSchema)}\n value={getAccounts(editingSchema)}\n />\n \n )}\n
\n )\n}\n\nexport default Services\n","import { useQuery } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport BigNumber from 'bignumber.js'\nimport gql from 'graphql-tag'\nimport moment from 'moment'\nimport * as R from 'ramda'\nimport React from 'react'\nimport { useHistory } from 'react-router-dom'\n\nimport LogsDowloaderPopover from 'src/components/LogsDownloaderPopper'\nimport Title from 'src/components/Title'\nimport DataTable from 'src/components/tables/DataTable'\nimport { ReactComponent as TxInIcon } from 'src/styling/icons/direction/cash-in.svg'\nimport { ReactComponent as TxOutIcon } from 'src/styling/icons/direction/cash-out.svg'\nimport { ReactComponent as CustomerLinkIcon } from 'src/styling/icons/month arrows/right.svg'\nimport { toUnit, formatCryptoAddress } from 'src/utils/coin'\n\nimport DetailsRow from './DetailsCard'\nimport { mainStyles } from './Transactions.styles'\nimport { getStatus } from './helper'\n\nconst useStyles = makeStyles(mainStyles)\n\nconst NUM_LOG_RESULTS = 1000\n\nconst GET_TRANSACTIONS_CSV = gql`\n query transactions($limit: Int, $from: Date, $until: Date) {\n transactionsCsv(limit: $limit, from: $from, until: $until)\n }\n`\n\nconst GET_TRANSACTIONS = gql`\n query transactions($limit: Int, $from: Date, $until: Date) {\n transactions(limit: $limit, from: $from, until: $until) {\n id\n txClass\n txHash\n toAddress\n commissionPercentage\n expired\n machineName\n operatorCompleted\n sendConfirmed\n dispense\n hasError: error\n deviceId\n fiat\n cashInFee\n fiatCode\n cryptoAtoms\n cryptoCode\n toAddress\n created\n customerName\n customerIdCardData\n customerIdCardPhotoPath\n customerFrontCameraPath\n customerPhone\n discount\n customerId\n isAnonymous\n }\n }\n`\n\nconst Transactions = () => {\n const classes = useStyles()\n const history = useHistory()\n const { data: txResponse, loading } = useQuery(GET_TRANSACTIONS, {\n variables: {\n limit: NUM_LOG_RESULTS\n },\n pollInterval: 10000\n })\n\n const redirect = customerId => {\n return history.push(`/compliance/customer/${customerId}`)\n }\n\n const formatCustomerName = customer => {\n const { firstName, lastName } = customer\n\n return `${R.o(R.toUpper, R.head)(firstName)}. ${lastName}`\n }\n\n const getCustomerDisplayName = tx => {\n if (tx.customerName) return tx.customerName\n if (tx.customerIdCardData) return formatCustomerName(tx.customerIdCardData)\n return tx.customerPhone\n }\n const elements = [\n {\n header: '',\n width: 32,\n size: 'sm',\n view: it => (it.txClass === 'cashOut' ? \n
\n )\n },\n {\n header: 'Cash',\n width: 144,\n textAlign: 'right',\n size: 'sm',\n view: it => `${Number.parseFloat(it.fiat)} ${it.fiatCode}`\n },\n {\n header: 'Crypto',\n width: 150,\n textAlign: 'right',\n size: 'sm',\n view: it =>\n `${toUnit(new BigNumber(it.cryptoAtoms), it.cryptoCode)} ${\n it.cryptoCode\n }`\n },\n {\n header: 'Address',\n view: it => formatCryptoAddress(it.cryptoCode, it.toAddress),\n className: classes.overflowTd,\n size: 'sm',\n width: 140\n },\n {\n header: 'Date (UTC)',\n view: it => moment.utc(it.created).format('YYYY-MM-DD HH:mm:ss'),\n textAlign: 'right',\n size: 'sm',\n width: 195\n },\n {\n header: 'Status',\n view: it => getStatus(it),\n textAlign: 'left',\n size: 'sm',\n width: 80\n }\n ]\n\n return (\n <>\n {getCustomerDisplayName(it)}
\n {!it.isAnonymous && (\n redirect(it.customerId)}>\n
\n )}\n \n
\n \n Transactions \n {txResponse && (\n
\n \n R.path(['transactionsCsv'])(logs)}\n />\n
\n )}\n \n
\n \n
\n \n
\n \n// In which type of transactions will it trigger?\n//
\n//Choose trigger type
\n\n {isRadioGroupActive() && (\n
\n \n )\n}\n\nconst type = currency => ({\n schema: typeSchema,\n options: typeOptions,\n Component: Type,\n props: { currency },\n initialValues: {\n triggerType: '',\n threshold: { threshold: '', thresholdDays: '' }\n }\n})\n\nconst requirementSchema = Yup.object()\n .shape({\n requirement: Yup.object({\n requirement: Yup.string().required(),\n suspensionDays: Yup.number().when('requirement', {\n is: value => value === 'suspend',\n then: Yup.number()\n .nullable()\n .transform(transformNumber),\n otherwise: Yup.number()\n .nullable()\n .transform(() => null)\n })\n }).required()\n })\n .test(({ requirement }, context) => {\n const requirementValidator = requirement =>\n requirement.requirement === 'suspend'\n ? requirement.suspensionDays > 0\n : true\n\n if (requirement && requirementValidator(requirement)) return\n\n return context.createError({\n path: 'requirement',\n message: 'Suspension days must be greater than 0'\n })\n })\n\nconst requirementOptions = [\n { display: 'SMS verification', code: 'sms' },\n { display: 'ID card image', code: 'idCardPhoto' },\n { display: 'ID data', code: 'idCardData' },\n { display: 'Customer camera', code: 'facephoto' },\n { display: 'Sanctions', code: 'sanctions' },\n { display: 'US SSN', code: 'usSsn' },\n // { display: 'Super user', code: 'superuser' },\n { display: 'Suspend', code: 'suspend' },\n { display: 'Block', code: 'block' }\n]\n\nconst Requirement = () => {\n const classes = useStyles()\n const {\n touched,\n errors,\n values,\n handleChange,\n setTouched\n } = useFormikContext()\n\n const hasRequirementError =\n !!errors.requirement &&\n !!touched.requirement?.suspensionDays &&\n (!values.requirement?.suspensionDays ||\n values.requirement?.suspensionDays < 0)\n\n const isSuspend = values?.requirement?.requirement === 'suspend'\n\n const titleClass = {\n [classes.error]:\n (!!errors.requirement && !isSuspend) || (isSuspend && hasRequirementError)\n }\n\n return (\n <>\n \n Threshold\n
\n )}\n\n {isThresholdCurrencyEnabled && (\n <>\n \n {props.currency}\n \n \n )}\n {isTransactionAmountEnabled && (\n <>\n \n transactions\n \n \n )}\n {isThresholdDaysEnabled && (\n <>\n \n in\n \n days \n \n )}\n {isConsecutiveDaysEnabled && (\n <>\n \n consecutive days\n \n \n )}\n
\n Choose a requirement
\n\n// {showCashOut &&
\n// )\n// }\n\nconst RequirementInput = () => {\n const { values } = useFormikContext()\n const classes = useStyles()\n\n const requirement = values?.requirement?.requirement\n const isSuspend = requirement === 'suspend'\n\n const display = getView(requirementOptions, 'display')(requirement)\n\n return (\n Trigger overview so far
\nReject reused addresses
\n\n This option requires a user to scan a different cryptocurrency\n address if they attempt to scan one that had been previously\n used for a transaction in your network\n
\n\n It seems there are no active compliance triggers on your network\n
\n \n\n \n \n
\n )\n}\n\nexport default Commissions\n","import { useQuery, useMutation } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React from 'react'\n\nimport { Table as EditableTable } from 'src/components/editableTable'\nimport Section from 'src/components/layout/Section'\nimport TitleSection from 'src/components/layout/TitleSection'\nimport styles from 'src/pages/AddMachine/styles'\nimport {\n mainFields,\n localeDefaults as defaults,\n LocaleSchema as schema\n} from 'src/pages/Locales/helper'\nimport { toNamespace } from 'src/utils/config'\n\nimport { getConfiguredCoins } from '../helper'\n\nconst useStyles = makeStyles(styles)\n\nconst GET_DATA = gql`\n query getData {\n config\n accounts\n currencies {\n code\n display\n }\n countries {\n code\n display\n }\n cryptoCurrencies {\n code\n display\n }\n languages {\n code\n display\n }\n machines {\n name\n deviceId\n }\n }\n`\n\nconst SAVE_CONFIG = gql`\n mutation Save($config: JSONObject) {\n saveConfig(config: $config)\n }\n`\n\nfunction Locales({ isActive, doContinue }) {\n const classes = useStyles()\n const { data } = useQuery(GET_DATA)\n\n const [saveConfig] = useMutation(SAVE_CONFIG, {\n onCompleted: doContinue\n })\n\n const save = it => {\n const config = toNamespace('locale')(it.locale[0])\n return saveConfig({ variables: { config } })\n }\n\n const cryptoCurrencies = getConfiguredCoins(\n data?.config || {},\n data?.cryptoCurrencies || []\n )\n\n const onChangeCoin = (prev, curr, setValue) => setValue(curr)\n\n return (\n \n \n \n
\n )\n}\n\nexport default Locales\n","import { Box, makeStyles } from '@material-ui/core'\nimport React from 'react'\n\nimport { Label1 } from 'src/components/typography'\nimport { ReactComponent as WarningIcon } from 'src/styling/icons/warning-icon/comet.svg'\n\nconst useStyles = makeStyles({\n message: ({ width }) => ({\n width,\n marginTop: 4,\n marginLeft: 16\n })\n})\n\nconst InfoMessage = ({ children, width = 330, className }) => {\n const classes = useStyles({ width })\n\n return (\n \n
\n )\n}\n\nexport default Twilio\n","import { useQuery, useMutation } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport { Button } from 'src/components/buttons'\nimport { NamespacedTable as EditableTable } from 'src/components/editableTable'\nimport { P, H4 } from 'src/components/typography'\nimport { getElements, WalletSchema } from 'src/pages/Wallet/helper'\nimport { toNamespace, namespaces } from 'src/utils/config'\n\nimport styles from './Shared.styles'\n\nconst useStyles = makeStyles(styles)\nconst GET_INFO = gql`\n query getData {\n config\n accounts\n accountsConfig {\n code\n display\n class\n cryptos\n }\n cryptoCurrencies {\n code\n display\n }\n }\n`\n\nconst SAVE_CONFIG = gql`\n mutation Save($config: JSONObject, $accounts: JSONObject) {\n saveConfig(config: $config)\n saveAccounts(accounts: $accounts)\n }\n`\n\nconst AllSet = ({ data: currentData, doContinue }) => {\n const classes = useStyles()\n\n const { data } = useQuery(GET_INFO)\n const [saveConfig] = useMutation(SAVE_CONFIG, {\n onCompleted: doContinue\n })\n\n const [error, setError] = useState(false)\n\n const coin = currentData?.coin\n\n const accountsConfig = data?.accountsConfig\n const cryptoCurrencies = data?.cryptoCurrencies ?? []\n\n const save = () => {\n if (!WalletSchema.isValidSync(currentData)) return setError(true)\n\n const withCoin = toNamespace(coin, R.omit('coin', currentData))\n const config = toNamespace(namespaces.WALLETS)(withCoin)\n setError(false)\n return saveConfig({ variables: { config } })\n }\n\n return (\n <>\n \n \n \n \n \n\n \n To set up Twilio please read the instructions from our support portal.\n \n
\n Twilio (SMS service)
\n\n Will you setup a two way machine or compliance?\n
\n\n Two-way machines allow your customers not only to buy (cash-in)\n but also sell cryptocurrencies (cash-out).\n
\n\n You’ll need an SMS service for cash-out transactions and for any\n compliance triggers\n
\nEnter credentials
\nAll set
\n\n These are your wallet settings. You can later edit these and add\n additional coins.\n
\nBlockcypher
\n\n If you are enabling cash-out services, create a Blockcypher account.\n
\n\n {selected === 'disable' && (\n addData({ zeroConf: 'all-zero-conf' })}\n className={classes.button}>\n Continue\n \n )}\n {selected === 'enable' && (\n
\n \n )\n}\n\nexport default Blockcypher\n","import { useQuery } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport { Formik, Form, Field } from 'formik'\nimport gql from 'graphql-tag'\nimport React, { useState } from 'react'\nimport * as Yup from 'yup'\n\nimport PromptWhenDirty from 'src/components/PromptWhenDirty'\nimport { Button } from 'src/components/buttons'\nimport { RadioGroup } from 'src/components/inputs/formik'\nimport { H4 } from 'src/components/typography'\n\nimport styles from './Shared.styles'\n\nconst useStyles = makeStyles(styles)\n\nconst GET_CONFIG = gql`\n {\n cryptoCurrencies {\n code\n display\n }\n }\n`\n\nconst schema = Yup.object().shape({\n coin: Yup.string().required()\n})\n\nconst ChooseCoin = ({ addData }) => {\n const classes = useStyles()\n const [error, setError] = useState(false)\n\n const { data } = useQuery(GET_CONFIG)\n const cryptoCurrencies = data?.cryptoCurrencies ?? []\n\n const onSubmit = it => {\n if (!schema.isValidSync(it)) return setError(true)\n\n if (it.coin !== 'BTC') {\n return addData({ coin: it.coin, zeroConf: 'all-zero-conf' })\n }\n\n addData(it)\n }\n\n return (\n <>\n \n Choose your first cryptocurrency\n
\n\n\n
\n )\n}\n\nexport default ChooseExchange\n","import { useQuery } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport { Button } from 'src/components/buttons'\nimport { RadioGroup } from 'src/components/inputs'\nimport { H4 } from 'src/components/typography'\n\nimport styles from './Shared.styles'\nimport { getItems } from './getItems'\n\nconst useStyles = makeStyles(styles)\n\nconst GET_CONFIG = gql`\n {\n accountsConfig {\n code\n display\n class\n cryptos\n }\n }\n`\n\nconst ChooseTicker = ({ data: currentData, addData }) => {\n const classes = useStyles()\n const { data } = useQuery(GET_CONFIG)\n\n const [selected, setSelected] = useState(null)\n const [error, setError] = useState(false)\n\n const accounts = data?.accounts ?? []\n const accountsConfig = data?.accountsConfig ?? []\n\n const coin = currentData.coin\n const tickers = getItems(accountsConfig, accounts, 'ticker', coin)\n\n const submit = () => {\n if (!selected) return setError(true)\n addData({ ticker: selected })\n }\n\n const onSelect = e => {\n setSelected(e.target.value)\n setError(false)\n }\n\n return (\n Choose your exchange
\n\n \n Make sure you set up {schema[selected].name} to enter the\n necessary information below. Please follow the instructions on our\n support page if you haven’t.\n \n
\n Enter exchange information
\n\n
\n )\n}\n\nexport default ChooseTicker\n","import * as Yup from 'yup'\n\nimport {\n TextInput,\n SecretInput,\n Autocomplete\n} from 'src/components/inputs/formik'\n\nconst singleBitgo = code => ({\n code: 'bitgo',\n name: 'BitGo',\n title: 'BitGo (Wallet)',\n elements: [\n {\n code: 'token',\n display: 'API Token',\n component: TextInput,\n face: true,\n long: true\n },\n {\n code: 'environment',\n display: 'Environment',\n component: Autocomplete,\n inputProps: {\n options: [\n { code: 'prod', display: 'prod' },\n { code: 'test', display: 'test' }\n ],\n labelProp: 'display',\n valueProp: 'code'\n },\n face: true\n },\n {\n code: `${code}WalletId`,\n display: `${code} Wallet ID`,\n component: TextInput\n },\n {\n code: `${code}WalletPassphrase`,\n display: `${code} Wallet Passphrase`,\n component: SecretInput\n }\n ],\n validationSchema: Yup.object().shape({\n token: Yup.string()\n .max(100, 'Too long')\n .required(),\n environment: Yup.string()\n .matches(/(prod|test)/)\n .required(),\n [`${code}WalletId`]: Yup.string()\n .max(100, 'Too long')\n .required(),\n [`${code}WalletPassphrase`]: Yup.string()\n .max(100, 'Too long')\n .required()\n })\n})\n\nexport default singleBitgo\n","import { useQuery, useMutation } from '@apollo/react-hooks'\nimport { makeStyles } from '@material-ui/core'\nimport gql from 'graphql-tag'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport { Button, SupportLinkButton } from 'src/components/buttons'\nimport { RadioGroup } from 'src/components/inputs'\nimport { H4, Info3 } from 'src/components/typography'\nimport FormRenderer from 'src/pages/Services/FormRenderer'\nimport schema from 'src/pages/Services/schemas'\nimport bitgo from 'src/pages/Services/schemas/singlebitgo'\nimport { ReactComponent as WarningIcon } from 'src/styling/icons/warning-icon/comet.svg'\n\nimport styles from './Shared.styles'\nimport { getItems } from './getItems'\n\nconst useStyles = makeStyles(styles)\n\nconst GET_CONFIG = gql`\n {\n accounts\n accountsConfig {\n code\n display\n class\n cryptos\n }\n cryptoCurrencies {\n code\n display\n }\n }\n`\n\nconst SAVE_ACCOUNTS = gql`\n mutation Save($accounts: JSONObject) {\n saveAccounts(accounts: $accounts)\n }\n`\n\nconst isConfigurable = it => R.contains(it)(['infura', 'bitgo'])\n\nconst isLocalHosted = it =>\n R.contains(it)([\n 'bitcoind',\n 'geth',\n 'litecoind',\n 'dashd',\n 'zcashd',\n 'bitcoincashd'\n ])\n\nconst ChooseWallet = ({ data: currentData, addData }) => {\n const classes = useStyles()\n const { data } = useQuery(GET_CONFIG)\n const [saveAccounts] = useMutation(SAVE_ACCOUNTS, {\n onCompleted: () => submit()\n })\n\n const [selected, setSelected] = useState(null)\n const [error, setError] = useState(false)\n\n const accounts = data?.accounts ?? []\n const accountsConfig = data?.accountsConfig ?? []\n\n const coin = currentData.coin\n const wallets = getItems(accountsConfig, accounts, 'wallet', coin)\n\n const saveWallet = name => wallet => {\n const accounts = { [name]: wallet }\n return saveAccounts({ variables: { accounts } })\n }\n\n const submit = () => {\n if (!selected) return setError(true)\n addData({ wallet: selected })\n }\n\n const onSelect = e => {\n setSelected(e.target.value)\n setError(false)\n }\n\n return (\n Choose your ticker
\n\n
\n )\n}\n\nexport default ChooseWallet\n","import { makeStyles } from '@material-ui/core'\nimport * as R from 'ramda'\nimport React, { useState } from 'react'\n\nimport Sidebar, { Stepper } from 'src/components/layout/Sidebar'\nimport TitleSection from 'src/components/layout/TitleSection'\nimport styles from 'src/pages/AddMachine/styles'\n\nimport AllSet from './AllSet'\nimport Blockcypher from './Blockcypher'\nimport ChooseCoin from './ChooseCoin'\nimport ChooseExchange from './ChooseExchange'\nimport ChooseTicker from './ChooseTicker'\nimport ChooseWallet from './ChooseWallet'\n\nconst useStyles = makeStyles(styles)\n\nconst steps = [\n {\n label: 'Choose cryptocurrency',\n component: ChooseCoin\n },\n {\n label: 'Choose wallet',\n component: ChooseWallet\n },\n {\n label: 'Choose ticker',\n component: ChooseTicker\n },\n {\n label: 'Exchange',\n component: ChooseExchange\n },\n {\n label: 'Blockcypher',\n component: Blockcypher\n },\n {\n label: 'All set',\n component: AllSet\n }\n]\n\nconst Wallet = ({ doContinue }) => {\n const [step, setStep] = useState(0)\n const [data, setData] = useState({})\n\n const classes = useStyles()\n const mySteps = data?.coin === 'BTC' ? steps : R.remove(4, 1, steps)\n\n const Component = mySteps[step].component\n\n const addData = it => {\n setData(R.merge(data, it))\n setStep(step + 1)\n }\n\n return (\n Choose your wallet
\n\n \n To set up {selected} please read the node wallet instructions from\n our support portal.\n \n
\n \n \n Make sure you set up a BitGo wallet to enter the necessary\n information below. Please follow the instructions on our support\n page if you haven’t.\n \n
\n Enter wallet information
\nEnter wallet information
\n\n
\n )\n}\n\nexport default Wallet\n","import { makeStyles } from '@material-ui/core'\nimport React from 'react'\n\nimport { Button } from 'src/components/buttons'\nimport { H1, P } from 'src/components/typography'\nimport { comet } from 'src/styling/variables'\n\nconst styles = {\n welcome: {\n textAlign: 'center',\n paddingTop: 256\n },\n title: {\n lineHeight: 1,\n fontSize: 48\n },\n getStarted: {\n fontSize: 24,\n fontWeight: 500,\n marginBottom: 54,\n color: comet\n }\n}\n\nconst useStyles = makeStyles(styles)\n\nfunction Welcome({ doContinue }) {\n const classes = useStyles()\n\n return (\n \n
\n \n \n {mySteps.map((it, idx) => (\n \n
\n \n
\n \n
\n )\n}\n\nexport default Welcome\n","import * as R from 'ramda'\nimport React from 'react'\n\nimport { schema as CommissionsSchema } from 'src/pages/Commissions/helper'\nimport { LocaleSchema } from 'src/pages/Locales/helper'\nimport { WalletSchema } from 'src/pages/Wallet/helper'\nimport { fromNamespace, namespaces } from 'src/utils/config'\n\nimport Commissions from './components/Commissions'\nimport Locale from './components/Locales'\n// import Notifications from './components/Notifications'\n// import WizardOperatorInfo from './components/OperatorInfo'\nimport Twilio from './components/Twilio'\nimport Wallet from './components/Wallet/Wallet'\nimport Welcome from './components/Welcome'\n\nconst getConfiguredCoins = (config, crypto) => {\n const wallet = fromNamespace(namespaces.WALLETS, config)\n return R.filter(it =>\n WalletSchema.isValidSync(fromNamespace(it.code, wallet))\n )(crypto)\n}\n\nconst hasValidWallet = (config, crypto) => {\n const wallet = fromNamespace(namespaces.WALLETS, config)\n const coins = R.map(it => fromNamespace(it.code, wallet))(crypto)\n\n const hasValidConfig = R.compose(\n R.any(R.identity),\n R.map(it => WalletSchema.isValidSync(it))\n )(coins)\n\n return hasValidConfig\n}\n\nconst hasValidLocale = config => {\n const locale = fromNamespace(namespaces.LOCALE, config)\n return LocaleSchema.isValidSync(locale)\n}\n\nconst hasValidCommissions = config => {\n const commission = fromNamespace(namespaces.COMMISSIONS, config)\n return CommissionsSchema.isValidSync(commission)\n}\n\nconst getWizardStep = (config, crypto) => {\n if (!config) return 0\n\n const validWallet = hasValidWallet(config, crypto)\n if (!validWallet) return 1\n\n const validLocale = hasValidLocale(config)\n if (!validLocale) return 2\n\n const validCommission = hasValidCommissions(config)\n if (!validCommission) return 3\n\n return 0\n}\n\nconst STEPS = [\n {\n id: 'welcome',\n Component: Welcome\n },\n {\n id: 'wallet',\n Component: Wallet,\n exImage: '/assets/wizard/fullexample.wallet.png',\n subtitle: 'Wallet settings',\n text: `Your wallet settings are the first step for this wizard. \n We'll start by setting up one of cryptocurrencies to get you up and running,\n but you can later set up as many as you want.`\n },\n {\n id: 'locale',\n Component: Locale,\n exImage: '/assets/wizard/fullexample.locale.png',\n subtitle: 'Locales',\n text: `From the Locales panel, you can define default settings\n that will be applied to all machines you add to your network later on.\n These settings may be overridden for specific machines in the Overrides section.`\n },\n {\n id: 'twilio',\n Component: Twilio,\n exImage: '/assets/wizard/fullexample.twilio.png',\n subtitle: 'Twilio (SMS service)',\n text: (\n <>\n Twilio is used for SMS operator notifications, phone number collection\n for compliance, and 1-confirmation redemptions on cash-out transactions.\n Welcome to the Lamassu Admin
\n\n To get you started, we’ve put together a wizard that will\n
\n help set up what you need before pairing your machines.\n
\n You'll need to configure Twilio if you're offering cash-out or any\n compliance options\n \n )\n },\n {\n id: 'commissions',\n Component: Commissions,\n exImage: '/assets/wizard/fullexample.commissions.png',\n subtitle: 'Commissions',\n text: `From the Commissions page, you can define all the commissions of your\n machines. The values set here will be default values of all machines\n you'll later add to your network. Default settings keep you from\n having to enter the same values everytime you add a new machine. Once\n a machine is added, you may override these values per machine and per\n cryptocurrency in the overrides section.`\n }\n // {\n // id: 'notifications',\n // Component: Notifications,\n // exImage: '/assets/wizard/fullexample.notifications.png',\n // subtitle: 'Notifications',\n // text: `Your notification settings will allow customize what notifications you\n // get and where. You can later override all default balance alerts setup\n // here.`\n // },\n // {\n // id: 'operatorInfo',\n // Component: WizardOperatorInfo,\n // exImage: '/assets/wizard/fullexample.operatorinfo.png',\n // subtitle: 'Operator info',\n // text: `Your contact information is important for your customer to be able\n // to contact you in case there’s a problem with one of your machines.\n // In this page, you also be able to set up what you want to share with\n // Coin ATM Radar and add the Terms & Services text that is displayed by your machines.`\n // }\n]\n\nexport { getWizardStep, STEPS, getConfiguredCoins }\n","import { makeStyles, Drawer, Grid } from '@material-ui/core'\nimport classnames from 'classnames'\nimport React, { useState } from 'react'\n\nimport Modal from 'src/components/Modal'\nimport Stepper from 'src/components/Stepper'\nimport { Button, Link } from 'src/components/buttons'\nimport { P, H2, Info2 } from 'src/components/typography'\nimport { spacer } from 'src/styling/variables'\n\nconst useStyles = makeStyles(() => ({\n drawer: {\n borderTop: 'none',\n boxShadow: '0 0 4px 0 rgba(0, 0, 0, 0.08)'\n },\n wrapper: {\n padding: '32px 0',\n flexGrow: 1,\n height: 264\n },\n smallWrapper: {\n height: 84\n },\n title: {\n margin: [[0, spacer * 4, 0, 0]]\n },\n subtitle: {\n marginTop: spacer,\n marginBottom: 6,\n lineHeight: 1.25,\n display: 'inline'\n },\n modal: {\n background: 'none',\n boxShadow: 'none'\n }\n}))\n\nfunction Footer({ currentStep, steps, subtitle, text, exImage, open, start }) {\n const classes = useStyles()\n const [fullExample, setFullExample] = useState(false)\n\n const wrapperClassNames = {\n [classes.wrapper]: true,\n [classes.smallWrapper]: !open\n }\n\n return (\n
\n \n \n {subtitle} \n {open && \n \n \n {steps && currentStep && (\n \n \n \n {open && (\n \n \n {\n setFullExample(true)\n }}>\n See full example\n \n \n \n \n \n \n \n \n )}\n
\n Setup Lamassu Admin
\n{text}
}\n\n {!is404 && wizardTested && \n {sidebar && !is404 && wizardTested && (\n \n
\n }\n />\n )}\n\n \n
\n