{"version":3,"file":"static/chunks/455-7f5c400d88be9bdc.js","mappings":"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","sources":["webpack://_N_E/./src/ui/Common/components/Animation/index.tsx","webpack://_N_E/./src/ui/Common/components/ChainDisplay/styles.ts","webpack://_N_E/./src/ui/Icons/components/CardanoIcon.tsx","webpack://_N_E/./src/ui/Icons/components/EthereumIcon.tsx","webpack://_N_E/./src/ui/Icons/components/PolygonIcon.tsx","webpack://_N_E/./src/ui/Common/components/ChainLogo/ChainLogo.tsx","webpack://_N_E/./src/ui/Common/components/ChainDisplay/ChainDisplay.tsx","webpack://_N_E/./src/ui/Common/components/EmptyListMessage/styles.tsx","webpack://_N_E/./src/ui/Common/components/EmptyListMessage/EmptyListMessage.tsx","webpack://_N_E/./src/ui/Wallet/components/Grpahs/utils.ts","webpack://_N_E/./src/ui/Wallet/components/Grpahs/FiatBalance.tsx","webpack://_N_E/./src/ui/Wallet/components/WalletList/styles.tsx","webpack://_N_E/./src/ui/Wallet/components/WalletList/WalletListItem.tsx","webpack://_N_E/./src/ui/Wallet/utils/balance.ts"],"sourcesContent":["import React, { PropsWithChildren } from 'react'\nimport styled, { keyframes } from 'styled-components'\n\n/**************************************************************\n !!! NOTE - Deprecated, use the Framer Motion lib instead\n *************************************************************/\n\n/**************************************************************\n ** This file is a library of animaition util loadComponents **\n *************************************************************/\n\n/* ================== FADE ================== */\n\ntype FadeProps = { direction: 'up' | 'down' | 'left' | 'right' }\n\nconst getKeyframes = (direction: 'translateX' | 'translateY', px: string) =>\n keyframes`\nfrom {\n opacity: 0.0001; \n transform: ${direction}(${px});\n}\nto {\n opacity: 1;\n transform: translateY(0);\n}\n`\n\nconst Component = {\n up: styled.div`\n animation: ${getKeyframes('translateY', '16px')} 0.3s ease-in;\n `,\n down: styled.div`\n animation: ${getKeyframes('translateY', '-16px')} 0.3s ease-in;\n `,\n left: styled.div`\n animation: ${getKeyframes('translateX', '16px')} 0.3s ease-in;\n `,\n right: styled.div`\n animation: ${getKeyframes('translateX', '-16px')} 0.3s ease-in;\n `,\n}\n\n/**\n * Components performs \"fade\" transition on its children on mount.\n */\nexport const Fade: React.FC> = (\n props: FadeProps\n) => {\n const _C = Component[props.direction]\n return <_C {...(props as any)} />\n}\n","import { ChainType } from 'crypto/interface'\nimport styled, { css } from 'styled-components'\n\nexport type StyleVariant = 'grayscale'\n\nexport const ToggledChainName = styled.div<{ chain?: ChainType }>`\n color: ${(p) => p.color};\n text-transform: uppercase;\n letter-spacing: 1px;\n\n ${(p) => {\n if (p.chain === 'cardano') {\n return css`\n color: #fd003d;\n `\n } else if (p.chain === 'ethereum') {\n return css`\n color: #627eea;\n `\n } else if (p.chain === 'polygon') {\n return css`\n color: #4a44c6;\n `\n }\n }}\n`\n\nexport const ChainWrapper = styled.div<{\n toggleName?: boolean\n variant?: StyleVariant\n}>`\n display: flex;\n align-content: center;\n background-color: transparent;\n gap: ${(p) => p.theme.spacing.xss}px;\n align-items: center;\n\n ${(p) => {\n if (p.variant === 'grayscale') {\n return css`\n filter: grayscale() brightness(2.5);\n `\n }\n }}\n\n ${(p) =>\n p.toggleName &&\n css`\n ${ToggledChainName} {\n opacity: 0;\n transition: 0.2s opacity ease-in;\n }\n\n :hover {\n ${ToggledChainName} {\n width: auto;\n opacity: 1;\n }\n }\n `}\n`\n","import React from 'react'\n\nexport const CardanoIcon = (props: React.SVGProps) => (\n \n \n \n)\n","import React from 'react'\n\nexport const EthereumIcon = (props: React.SVGProps) => (\n \n \n \n \n \n \n \n \n \n \n)\n","import React from 'react'\n\nexport const PolygonIcon = (props: React.SVGProps) => (\n \n \n \n)\n","import { ChainType } from 'crypto/interface'\nimport React from 'react'\nimport { CardanoIcon } from 'ui/Icons/components/CardanoIcon'\nimport { EthereumIcon } from 'ui/Icons/components/EthereumIcon'\nimport { PolygonIcon } from 'ui/Icons/components/PolygonIcon'\n\ninterface ChainLogoProps {\n chain: ChainType\n width?: number\n height?: number\n}\n\nexport const ChainLogo: React.VFC = ({\n chain,\n width,\n height,\n}) => {\n switch (chain) {\n case 'cardano':\n return \n case 'ethereum':\n return \n case 'polygon':\n return \n }\n}\n","import { ChainType } from 'crypto/interface'\nimport React from 'react'\nimport * as S from 'ui/Common/components/ChainDisplay/styles'\nimport { ChainLogo } from 'ui/Common/components/ChainLogo'\nimport Text from 'ui/Common/components/Text'\n\nfunction getChainName(chain: ChainType) {\n if (chain == 'cardano') {\n return 'Cardano'\n } else if (chain == 'ethereum') {\n return 'Ethereum'\n } else if (chain == 'polygon') {\n return 'Polygon'\n }\n}\n\ninterface ChainDisplayProps {\n chain: ChainType\n width?: number\n height?: number\n\n /** Toggle chain name on hover */\n toggleName?: boolean\n\n variant?: S.StyleVariant\n}\n\nexport function ChainDisplay(props: ChainDisplayProps) {\n const width = props.width ?? 16\n const height = props.height ?? 16\n\n return (\n \n \n\n \n {getChainName(props.chain)}\n \n \n )\n}\n","import { getFontFromKey } from 'app/styles/typography'\nimport styled from 'styled-components'\n\nexport const DEFAULT_INDICATOR_SIZE = 40\n\nexport const Container = styled.div<{ size?: number }>`\n display: flex;\n align-items: center;\n justify-content: center;\n height: ${(p) => (p.size ?? DEFAULT_INDICATOR_SIZE) * 3}px;\n\n color: ${(p) => p.theme.colors.grey.grey5};\n ${getFontFromKey('paragraph.4')};\n`\n","import React, { PropsWithChildren } from 'react'\nimport * as S from 'ui/Common/components/EmptyListMessage/styles'\n\n// -- Prop types\n// ----------\n\nexport interface EmptyListMessageProps {\n message: React.ReactNode\n size?: number\n}\n\n// -- Component\n// ----------\n\n/** Show standard empty list box with a message inside it */\nconst EmptyListMessage: React.FC> = (\n props\n) => {\n return {props.message}\n}\n\nexport { EmptyListMessage }\n","/**\n * Graph variant colors.\n */\nconst GraphVariants = {\n positive: {\n primary: '#68d04f',\n fadeStart: 'rgba(104, 208, 79, .3)',\n fadeEnd: 'rgba(104, 208, 79, .1)',\n },\n negative: {\n primary: '#fd003d',\n fadeStart: 'rgba(249, 62, 107, .3)',\n fadeEnd: 'rgba(249, 62, 107, .1)',\n },\n inverted: {\n primary: '#fff',\n fadeStart: 'rgba(255, 255, 255, .3)',\n fadeEnd: 'rgba(255, 255, 255, .1)',\n },\n}\n\n/**\n * Normalize an array of (positive!) values to the 0-1 interval.\n */\nexport function normalize(arr: number[]) {\n const max = Math.max(...arr)\n const min = Math.min(...arr)\n\n return arr.map((e) => (e - min) / (max - min))\n}\n\n/**\n * Invert normalized array.\n */\nexport function invert(arr: number[]) {\n return arr.map((e) => 1 - e)\n}\n\n/**\n * Get a color variant for the `FiatBalance` graph.\n */\nexport function getGraphColors(points: number[], inverted?: boolean) {\n const isNegative = points[0] > points[points.length - 1]\n return inverted\n ? GraphVariants.inverted\n : isNegative\n ? GraphVariants.negative\n : GraphVariants.positive\n}\n","import { getGraphColors, invert, normalize } from './utils'\nimport { motion } from 'framer-motion'\nimport React, { useRef } from 'react'\n\nconst GRAPH_MAX_VALUE = 20\nconst GRAPH_WIDTH = 136\n\nconst STEP = GRAPH_WIDTH / 24 // graph shows intraday change\n\n/**\n * Convert an array of y-coordinates to polyline points.\n * y-coordinates represent values for the last 24 hours.\n */\nfunction getPolylinePoints(arr: number[]) {\n let ret = ''\n\n arr.forEach((a, i) => (ret += `${i * STEP},${a} `))\n return ret\n}\n\n/**\n * Pad the array `arr` form the start with zeros until total array length equals `size`.\n */\nfunction padStart(arr: number[], size = 24) {\n if (arr.length === size) return arr\n\n const len = arr.length\n const zeros = new Array(size - len).fill(GRAPH_MAX_VALUE)\n\n return [...zeros, ...arr]\n}\n\n/**\n * The Fiat Balance graph interface.\n */\ntype FiatBalanceProps = {\n /**\n * Set stroke/fill for the graph to white,\n * so it could be displayed on green/red surface.\n */\n inverted?: boolean\n /**\n * Raw (fiat) value of the asset for the last N hours.\n */\n points: number[]\n}\n\n/**\n * Root container for the $FIAT balance mini graph\n * rendered in the asset list.\n *\n * The area graph displays the change of the asset for the past 24 hours.\n */\nfunction FiatBalance(props: FiatBalanceProps) {\n const { inverted, points } = props\n\n const { current: uuid } = useRef(Math.random())\n const colors = getGraphColors(points, inverted)\n\n const scaledPoints =\n /* invert since highest y-value is the lowest on the screen */\n invert(\n /* pad with zeros from the start until total length is 24 */\n padStart(\n /* normalize values to get 0-1 range */\n normalize(points)\n )\n ).map((p) => Math.floor(p * GRAPH_MAX_VALUE))\n\n // compute polyline points string from the scaled (and padded) points\n let polylinePoints = getPolylinePoints(scaledPoints)\n\n // To fill polyline properly we need to \"close\" it\n // from the sides with the `GRAPH_MAX_VALUE`.\n\n // We prepend the starting value and append the last value\n // so the graph doesn't \"sink\" on the edges towards the closing value.\n polylinePoints = `\n ${-2 * STEP},${GRAPH_MAX_VALUE + 1}\n ${-STEP},${scaledPoints[0]}\n\n ${polylinePoints} \n\n ${GRAPH_WIDTH + STEP},${scaledPoints[scaledPoints.length - 1]}\n ${GRAPH_WIDTH + 2 * STEP},${GRAPH_MAX_VALUE + 1}\n `\n\n const polylineTransitionStates = {\n hidden: { pathLength: 0, fill: 'transparent' },\n visible: (i: number) => {\n const delay = 1 + i * 0.5\n return {\n pathLength: 1,\n opacity: 1,\n fill: `url(#area-${uuid})`,\n transition: {\n pathLength: { delay, type: 'spring', duration: 1.5, bounce: 0 },\n fill: { delay: 1, duration: 0.01 },\n },\n }\n },\n }\n\n return (\n \n \n \n \n \n \n \n\n \n \n )\n}\n\nexport default FiatBalance\n","import styled, { keyframes } from 'styled-components'\nimport { LARGE_BREAKPOINT } from 'ui/Common/components/Grid'\nimport { SpinnerIcon } from 'ui/Icons/components/SpinnerIcon'\n\ninterface IsActive {\n isActive?: boolean\n}\n\nexport const Wrapper = styled.div`\n border-radius: 8px;\n display: flex;\n flex-flow: column nowrap;\n ${(p) => p.isActive && 'justify-content: space-between'};\n cursor: pointer;\n color: ${(p) => (p.isActive ? 'white' : p.theme.colors.grey.grey6)};\n transition: height 0.25s ease-in-out, background-color 0.1s, color 0.1s;\n\n height: ${(p) => (p.isActive ? 244 : 86)}px;\n padding: ${(p) => (p.isActive ? '0 48px 36px' : '0 48px')};\n background-color: ${(p) =>\n p.isActive ? 'black' : p.theme.colors.grey.grey5};\n\n margin-top: 4px;\n\n @media (max-width: ${LARGE_BREAKPOINT}px) {\n padding: ${(p) => (p.isActive ? '0 36px 32px' : '0 36px')};\n height: ${(p) => (p.isActive ? 188 : 76)}px;\n }\n\n .graph {\n display: inline;\n text-align: right;\n }\n\n .controls {\n display: none;\n }\n\n :hover {\n background-color: ${(p) =>\n p.isActive ? 'black' : p.theme.colors.grey.grey6};\n color: white;\n\n .graph {\n display: none;\n }\n\n .controls {\n display: initial;\n }\n }\n\n :active {\n background-color: black;\n color: white;\n }\n`\n\nexport const TitleWrapper = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n position: relative;\n height: ${(p) => (p.isActive ? 154 : 86)}px;\n\n > svg {\n position: absolute;\n right: -28px;\n top: calc(50% - 10px);\n transition: opacity 0.25s ease-in-out;\n\n opacity: ${(p) => (p.hasSpinner ? 1 : 0)};\n pointer-events: ${(p) => (p.hasSpinner ? 'initial' : 'none')};\n }\n`\n\nexport const NameSection = styled.div`\n display: flex;\n align-items: center;\n font-size: 14px;\n font-weight: bold;\n line-height: 24px;\n text-transform: uppercase;\n\n > svg {\n transition: transform 0.25s ease-in-out, margin 0.25s ease-in-out;\n\n margin: ${(p) => (p.isActive ? '8px 32px 8px 8px' : '0 24px 0 0')};\n transform: ${(p) => (p.isActive ? 'scale(1.33)' : 'initial')};\n }\n`\n\nexport const BalanceSection = styled.div`\n font-size: 22px;\n font-weight: bold;\n line-height: 28px;\n`\n\nexport const ButtonsWrapper = styled.div`\n display: flex;\n align-items: center;\n justify-content: flex-end;\n\n > * {\n margin-left: 8px;\n }\n`\n\nexport const AssetsWrapper = styled.div`\n margin: -24px 0 auto;\n text-align: right;\n text-transform: uppercase;\n font-size: 12px;\n line-height: 14px;\n`\n","import FiatBalance from '../Grpahs/FiatBalance'\nimport * as S from './styles'\nimport { FontWeight } from 'app/styles/typography'\nimport { Wallet } from 'crypto/interface'\nimport { useRouter } from 'next/router'\nimport { useMemo } from 'react'\nimport { Fade } from 'ui/Common/components/Animation'\nimport { AnimatedSpinnerIcon } from 'ui/Common/components/Animation/AnimatedSpinnerIcon'\nimport { Button, ButtonVariant } from 'ui/Common/components/Button'\nimport WalletLogo from 'ui/Common/components/WalletLogo'\nimport { formatBalanceAmount } from 'ui/Common/util/format/amountFormat'\nimport { calculateWalletFiatBalance } from 'ui/Wallet/utils/balance'\n\ninterface WalletListItemProps {\n wallet: Wallet\n isActive: boolean\n onClick: () => void\n}\n\nexport function WalletListItem({\n wallet,\n isActive,\n onClick,\n}: WalletListItemProps) {\n const router = useRouter()\n const hasSpinner = isActive && wallet.isPending\n\n const fiatBalanceHistory = calculateWalletFiatBalance(wallet)\n\n const walletAssetCount = useMemo(() => {\n return (\n wallet.assets\n // filter only assets with balance >0\n .filter((asset) => asset.unitBalance.gt(0)).length\n )\n }, [wallet])\n\n return (\n \n \n \n \n {wallet.name}\n \n\n \n $\n {formatBalanceAmount(wallet.fiatBalance)}\n \n\n \n \n\n {isActive && (\n <>\n \n \n {walletAssetCount} asset{walletAssetCount > 1 && 's'}\n \n \n\n {\n //TODO: not used currently\n false && (\n
\n {}\n
\n )\n }\n\n
\n \n \n {typeof wallet.id === 'number' && (\n console.log('disconnect')}\n >\n Disconnect\n \n )}\n {wallet.id !== 'eternl' && (\n \n router.push(`/wallet/stats?wallet=${wallet.id}`)\n }\n >\n Stats\n \n )}\n \n \n
\n \n )}\n \n )\n}\n","import { Wallet } from 'crypto/interface'\n\n/**\n * Calculate fiat balance change for the wallet based on\n * the fiat balance change of the assets inside the wallet.\n */\nexport function calculateWalletFiatBalance(wallet: Wallet) {\n // const assetShare = {}\n\n // wallet.assets.forEach(\n // (a) => (assetShare[a.id] = a.fiatBalance / wallet.fiatBalance)\n // )\n\n // ! TODO: finish implementation\n\n return wallet.assets[0]?.fiatBalanceHistory || []\n}\n"],"names":["getKeyframes","direction","px","keyframes","Component","up","styled","down","left","right","Fade","props","_C","ToggledChainName","p","color","chain","css","ChainWrapper","theme","spacing","xss","variant","toggleName","CardanoIcon","svg","width","height","viewBox","xmlns","path","d","fill","fillRule","EthereumIcon","g","fillOpacity","PolygonIcon","ChainLogo","ChainDisplay","S","Text","Container","size","colors","grey","grey5","getFontFromKey","EmptyListMessage","message","GraphVariants","positive","primary","fadeStart","fadeEnd","negative","inverted","GRAPH_MAX_VALUE","GRAPH_WIDTH","STEP","arr","points","current","useRef","Math","random","isNegative","length","getGraphColors","scaledPoints","len","Array","zeros","padStart","max","min","map","e","normalize","floor","polylinePoints","ret","forEach","a","i","getPolylinePoints","polylineTransitionStates","hidden","pathLength","visible","delay","opacity","uuid","transition","type","duration","bounce","motion","initial","animate","defs","linearGradient","id","gradientTransform","stop","offset","stopColor","strokeWidth","stroke","variants","Wrapper","isActive","grey6","LARGE_BREAKPOINT","TitleWrapper","hasSpinner","NameSection","BalanceSection","ButtonsWrapper","AssetsWrapper","WalletListItem","wallet","onClick","router","useRouter","isPending","walletAssetCount","assets","fiatBalanceHistory","calculateWalletFiatBalance","useMemo","filter","asset","unitBalance","gt","WalletLogo","walletId","name","span","style","fontWeight","FontWeight","formatBalanceAmount","fiatBalance","AnimatedSpinnerIcon","div","className","Button","ButtonVariant","console","log","push"],"sourceRoot":""}