Currency Converter
\n \n \n \n
\n);\n\nexport default backdrop;","import React, {Component} from 'react';\nimport {Modal} from 'react-bootstrap';\n\nimport CoinId from './CoinId.json';\n\n\nclass TopCap extends Component {\n \ncomponentDidMount(){\n this._isMounted = true;\n\n //this.getSlug();\n \n }\n\ncomponentDidUpdate(prevProps, prevState) {\n \n //if(prevProps.coinName!==this.props.coinName){\n\n //this.getSlug();\n //}\n}\n\n\n \ncomponentWillUnmount(){\n this._isMounted = false;\n}\n\n\nconstructor(props,context){\n super(props)\n this.state = {\n loading:true,\n top:10\n \n }\n\n }\n\n changeCount=(event)=>{\n let count = event.target.value;\n this.setState({\n top:count\n },()=>console.log())\n }\n \n render(){\n\n // let chart=this.showChart()\n \n return( \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n\n \n )\n }\n\n}\n\nexport default TopCap;","import React, {Component} from 'react';\nimport {Modal} from 'react-bootstrap';\nimport TechnicalAnalysis,{ THEMES, INTERVALS} from 'react-tradingview-technical-analysis';\n\nclass GaugeModal extends Component {\n \ncomponentDidMount(){\n this._isMounted = true;\n\n \n }\n \ncomponentWillUnmount(){\n this._isMounted = false;\n}\n\n\nconstructor(props,context){\n super(props)\n this.state = {\n\n loading:true,\n \n }\n\n }\n \n render(){\n\n // let chart=this.showChart()\n let body= ''\n if(this._isMounted){\n body = \n \n \n \n \n \n \n \n \n \n \n\n \n )\n }\n\n}\nexport default GaugeModal;","import React, {Component} from 'react';\nimport {Modal} from 'react-bootstrap';\nimport CoinId from './CoinId.json';\n\n\nvar cryptocurrencies = require('cryptocurrencies');\nvar numeral = require('numeral');\n\nclass CapModal extends Component {\n \ncomponentDidMount(){\n this._isMounted = true;\n this.getMarketCap();\n \n }\n\ncomponentDidUpdate(prevProps, prevState) {\n \n if(prevProps.coinName!==this.props.coinName){\n\n this.getMarketCap();\n }\n}\n\nasync getMarketCap(){\n /* this.setState({loading:true});\n let y = await cryptocurrencies[this.props.coinName]*/\n let ID = CoinId.filter(coin => coin.name === this.props.coinName)\n let y = ID[0].ID\n //fetch('https://api.coingecko.com/api/v3/simple/price?ids='+y.replace(/\\s+/g, '-').toLowerCase()+'&vs_currencies=usd&include_market_cap=true&include_24hr_change=ture&include_last_updated_at=ture')\n\n if(y !== undefined){\n fetch('https://api.coingecko.com/api/v3/simple/price?ids='+y+'&vs_currencies=usd&include_market_cap=true&include_24hr_change=ture&include_last_updated_at=ture')\n .then(res => res.json())\n .then((data) => {\n if (this._isMounted && data[y]!== undefined){\n this.setState({marketCap: data[y].usd_market_cap,loading:false},()=>console.log())}\n })\n .catch( setTimeout(()=>this.setState({loading:false}),500))}\n else{\n setTimeout(()=>this.setState({loading:false}),500) \n };\n }\n\n \ncomponentWillUnmount(){\n this._isMounted = false;\n}\n\n\nconstructor(props,context){\n super(props)\n this.state = {\n\n hide:this.props.onHide,\n loading:true,\n marketCap:null,\n coinChart:[],\n \n }\n\n }\n \n render(){\n\n let news = ''\n if(this.state.loading){\n news = \n \n \n \n \n \n \n \n\n {news}\n \n \n \n \n\n \n )\n }\n\n}\n\nexport default CapModal;","import React, {Component} from 'react';\nimport {Modal} from 'react-bootstrap';\nimport Loading from './Loading';\nimport CoinId from './CoinId.json';\nvar numeral = require('numeral');\nvar cryptocurrencies = require('cryptocurrencies');\n\n \nclass EventModal extends Component {\n \ncomponentDidMount(){\n this._isMounted = true;\n this.getLogo();\n this.getNews(); \n \n }\n \ncomponentWillUnmount(){\n this._isMounted = false;\n}\n\nasync getLogo(){\n //let x = cryptocurrencies[this.props.coinName]\n //let x = CoinId.filter(coin => coin.name === this.props.coinName)\n let ID = CoinId.filter(coin => coin.name === this.props.coinName)\n let x = ID[0].ID\n\n if(x !== undefined)\n fetch('https://api.coingecko.com/api/v3/coins/'+x+'?tickers=false&market_data=false&community_data=false&developer_data=false&sparkline=false')\n .then(res => res.json())\n .then((data) => {\n if (this._isMounted && data !== undefined){\n this.setState({logo: data.image.small })}\n })\n .catch(console.log)\n}\n\n\ngetNews = ()=>{\n\n let ID = CoinId.filter(coin => coin.name === this.props.coinName)\n let x = ID[0].ID\n \n var request = require(\"request\"); \n if(x !== undefined){\n var options = { method: 'GET',\n url: 'https://cors-anywhere.herokuapp.com/https://developers.coinmarketcal.com/v1/events',\n\n //url: 'https://thingproxy.freeboard.io/fetch/https://developers.coinmarketcal.com/v1/events',\n qs: { max: '10', coins: x},\n headers: \n { Accept: 'application/json',\n 'Accept-Encoding': 'deflate, gzip',\n 'x-api-key': 'xjR9ooNffv1X72pJdilty4PdJnlAhTY5LAewxuY4' } };\n \n request(options, function (error, response, body) {\n if (error) throw new Error(error);\n \n if(JSON.parse(body).body !== undefined){\n this.setState({news:JSON.parse(body).body,loading:false})\n }\n }.bind(this));\n } \n setTimeout(()=>this.setState({loading:false}),1000)\n\n}\n\n\nconstructor(props,context){\n super(props)\n this.state = {\n\n summaryModalShow: false,\n hide:this.props.onHide,\n loading:true,\n news:null,\n logo:[],\n \n \n }\n\n }\n\n\n\n render(){\n let m = cryptocurrencies[this.props.coinName]\n let news = ''\n if(this.state.loading){\n news = \n }\n \n return( \n \n \n \n \n \n \n \n \n \n {news}\n \n \n \n \n\n \n )\n }\n\n}\n\nexport default EventModal;","import React, { Component } from 'react';\nimport AnimatedNumber from 'react-animated-number';\nimport Pundi from './Pundi.png';\nimport CoinId from './CoinId.json';\nimport CapModal from './CapModal';\nimport EventModal from './EventModal';\n\n\nvar numeral = require('numeral');\nvar cryptocurrencies = require('cryptocurrencies');\n\n\nclass TradeCard extends Component {\n constructor(props) {\n super(props);\n\t\tthis.state = {\n loading: false,\t\n capOpen:false,\n eventOpen:false,\n\n price:0,\n prevPrice:null,\n logoLarge:null,\n website:null,\n twitter:null,\n\n entry:0,\n target:0,\n asset:0,\n \n profit:0,\n percent:0,\n coinvalue:[]\n };\n // this.add=this.add.bind(this);\n }\n componentDidMount() {\n this._isMounted = true;\n this.getLogo();\n this.getWebSocket();\n \n }\n\n componentDidUpdate(prevProps, prevState) {\n\n if(prevProps.tradePrice!==this.props.tradePrice){\n \n this.getWebSocket();\n \n }\n\n \n if(prevProps.trade!==this.props.trade){\n this.setState({\n price:0\n },()=> this.getWebSocket());\n this.getLogo();\n \n \n }\n \n }\n\n \n\n componentWillUnmount() {\n\t\tthis._isMounted = false;\n\t}\n \n \n getWebSocket(){\n \n let message = this.props.tradePrice\n if(message.PRICE !== undefined && message.FROMSYMBOL === this.props.trade){\n this.setState({prevPrice:this.state.price,price:message.PRICE},()=> console.log())\n this.setState({coinvalue:[this.props.trade,this.state.price * this.state.asset]},()=>this.props.getValue(this.state.coinvalue))\n }\n \n }\n\n \n async getLogo(){\n\n let ID = CoinId.filter(coin => coin.name === this.props.trade)\n let x = ID[0].ID\n let amount = ID[0].amount\n let target = ID[0].target\n \n\n if(x !== undefined)\n fetch('https://api.coingecko.com/api/v3/coins/'+x+'?localization=false&tickers=false&market_data=false&community_data=false&developer_data=false&sparkline=false')\n .then(res => res.json())\n .then((data) => {\n if (this._isMounted && data !== undefined){\n\n this.setState({logo: data.image.small,logoLarge: data.image.large,website: data.links.homepage[0], \n twitter: data.links.twitter_screen_name, \n asset:amount,\n target:target},()=>(console.log()))}\n })\n .catch(console.log)\n }\n \n\n\n round(value){\n if (value){\n if(this.props.trade[2] === 'USDT' ){\n return numeral(this.state.price).format('0,0.0000');\n }\n else{\n return numeral(this.state.price).format('0,0.00000000');\n }\n }\n return 0;\n }\n\n assetChange = (event) => {\n let ID = CoinId.filter(coin => coin.name === this.props.trade)\n let amount = ID[0].amount\n\n let asset = event.target.value;\n\n if(asset !== ''){\n this.setState({asset:asset},()=>console.log())\n }\n else{\n this.setState({asset:amount},()=>console.log()) \n }\n }\n\n entryChange = (event) => {\n let entry = event.target.value;\n this.setState({entry:entry},()=>console.log())\n }\n\n targetChange = (event) => {\n let ID = CoinId.filter(coin => coin.name === this.props.trade)\n let targeted = ID[0].target\n\n let target = event.target.value;\n if(target !== ''){\n this.setState({target:target},()=>console.log())\n }\n else{\n this.setState({target:targeted},()=>console.log()) \n\n }\n }\n\n\n \n render() {\n\n let logo = Pundi;\n\n if(this.state.logo !== null){\n logo = this.state.logoLarge;\n \n }\n else{\n logo = Pundi;\n }\n \n let capClose = () => this.setState({capOpen:false})\n let capOpen = () => this.setState({capOpen:true})\n let eventClose = () => this.setState({eventOpen:false})\n let eventOpen = () => this.setState({eventOpen:true})\n\n let link = 'https://www.binance.com/en/trade/'+ this.props.trade +'_USDT'\n \n let num=;\n }\n\n //let x = this.state.Coin.sort((a, b) => a.localeCompare(b))\n let option = ''; \n let buttonText = 'Next'\n\n if(this.state.setRangeFrom == 0){\n buttonText = 'Next'\n }\n else{\n buttonText = 'Previous'\n }\n\n \n\n\n\n return (\n \n \n \n \n ,\n document.getElementById('root')\n);\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: https://bit.ly/CRA-PWA\nserviceWorker.unregister();\n"],"sourceRoot":""}
Top Market Cap
\n \n \n
\n \n \n
Gauge
\n \n \n {body}\n
\n \n \n \n \n
\n }\n if(this.state.marketCap !== undefined && !this.state.loading && this.props.coinName !== undefined){\n news = \n \n \n
\n
\n }\n \n else if(!this.state.loading){\n news = \n \n 
\n \n
\n \n \n Market Cap: ${numeral(this.state.marketCap).format('0,0.00')}\n \n
\n }\n \n return( \n \n \n \n
\n {this.props.name}\n \n \n \n \n
\n Market Cap: Unknown\n Market Cap
\n \n \n
\n }\n if(this.state.news !== null && !this.state.loading){\n \n news = this.state.news.map((news,index)=>(\n \n \n
\n 
\n
\n ))}\n \n else if(this.state.news == null && !this.state.loading){\n news = \n 
\n
\n {news.coins[0].fullname}\n \n \n {news.title.en}\n \n
\n {news.date_event.slice(0,10)}\n \n \n
No Upcoming News\n News for the Next 7 Days
\n Price: this.setState({ modalOpen:true})} style={{\n transition: '0.1s ease-out',\n fontSize: 15,\n cursor:'pointer',\n transitionProperty:\n 'background-color, color, opacity'\n \n }}frameStyle={perc => (\n perc === 100 ? {} : {color: fontColor}\n )}\n duration={1500}\n formatValue={n=>this.round(n)}>Price: {this.state.price}
;\n \n \n let fontColor = 'rgb(245, 237, 237)';\n if(this.state.prevPrice < this.state.price){\n fontColor = 'rgb(98, 175, 34)';\n }\n else if(this.state.prevPrice > this.state.price){\n fontColor = 'rgba(230, 26, 60)';\n }\n else{\n fontColor = 'rgb(154, 236, 87)';\n }\n \n \n //P&L: {numeral((this.state.asset * this.state.price) - (this.state.asset * this.state.entry)).format('0,0.00')}
\n\n \n let body = ''\n \n body = \n \n \n\n
\n \n \n \n return (\n \n \n
\n\n \n\n\n \n \n 
\n \n \n \n
\n \n \n \n {this.props.trade}\n \n
\n {num}\n \n Holdings: {this.state.asset}
\nTarget: {this.state.target}
\nEntry: {this.state.entry}
\nAmount: ${numeral(this.state.asset * this.state.entry).format('0,00')}
\n\n\n \n\n \n
\n\n ${numeral(this.state.asset * this.state.price).format('0,0.00')}
\nP {numeral((this.state.asset * this.state.price) * 49).format('0,0')}
\n\nTarget: ${numeral(this.state.asset * this.state.target).format('0,0.00')}
\n\n
\n \n
\n \n \n this.props.removeTrade(this.props.trade)} class=\"fas fa-power-off\">\n
\n \n \n \n\n \n this.setState({ capOpen:true})}>\n {this.state.capOpen&&
\n\n \n this.setState({ eventOpen:true})}>\n {this.state.eventOpen&&
\n \n \n
\n \n \n \n\t\t\t\t\n\t\t\t\t\t\t\n \n
\n\n Asset
\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t\t\n \n
\n\n Entry
\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t\t\n \n
\n Target
\n\t\t\t\n\n {body} \n\n
\n \n );\n }\n}\n\nexport default TradeCard;","import React, {Component} from 'react';\nimport './App.css';\nimport 'bootstrap/dist/css/bootstrap.min.css';\nimport Navbar from './Components/Navbar';\nimport SideDrawer from './Components/SideDrawer';\nimport StatusDrawer from './Components/StatusDrawer';\nimport Backdrop from './Components/Backdrop';\nimport TopCap from './Components/TopCap';\nimport CoinId from './Components/CoinId.json';\nimport GaugeModal from './Components/GaugeModal';\nimport TradeCard from './Components/TradeCard';\nimport TradingViewWidget, { Themes } from 'react-tradingview-widget';\nimport uniswap from './Components/uniswap.jpg';\nimport bitcoin from './Components/bitcoin.jpg';\nimport ethereum from './Components/ethereum.jpg';\n\nvar numeral = require('numeral');\n\nvar apiKey = \"5803fce6d1381ec32e0aa6c633ad25d8d3c147216436c15644d7fd912eb7f79e\"\nvar ccStreamer = new WebSocket('wss://streamer.cryptocompare.com/v2?api_key=' + apiKey);\n\n\nclass App extends Component {\n constructor(props) {\n super(props);\n\t\tthis.state = {\n CurrencyType: 'USDT',\n TimeFrame: 'histoday',\n currentPrice:[],\n setNumber:1,\n // Coin:['ZRX','BAT','BTC','BCH','BSV','ADA','LTC','LINK'],\n \n prevCoin:['CSPR','GTC','FUNX','OP','ICP','FLOW','BICO','ICX','ENS','ETH'],\n prevCurrency: 'USDT',\n added:[],\n sideDrawerOpen:false,\n statusDrawerOpen:false,\n //API:'156c5da04db8726ab5fd90a2a789e4fe78cf40307f8ac2038ae9c17532ae0624',\n apiKey:1,\n message:[],\n setRangeFrom:0,\n setRangeTo:16,\n\n open:false,\n topOpen:false,\n red:[],\n green:[],\n blue:[],\n\n chartDisplay:[],\n chartDisplay_USD:[],\n\n newsOpen:false,\n news:[],\n loading:false,\n gaugeCoin:'',\n studies:[\"BB@tv-basicstudies\"],\n\n ETH_Sentiment:[],\n BTC_Sentiment:[],\n Defi_Cap:[0],\n trade:[],\n prevTrade:[],\n tradePrice:[],\n findCoin:'',\n\n //price\n Coin:['CSPR','GTC','FUNX','OP','ICP','FLOW','BICO','ICX','ENS','ETH'],\n CSPR:[],\n GTC:[],\n FX:[],\n OP:[],\n ICP:[],\n FLOW:[],\n BICO:[],\n ICX:[],\n ENS:[],\n ETH:[],\n\n totalValue:0,\n\n \n\n gaugeModalOpen:false\n };\n this.getValue=this.getValue.bind(this);\n }\n\n\n\n getValue(value){\n //console.log(value)\n if(value.length !== 0){\n\n if(value[0] === 'ETH'){\n this.setState({ETH:value[1]},()=>console.log())\n\n }\n\n else if(value[0] === 'ENS'){\n this.setState({ENS:value[1]},()=>console.log())\n \n }\n\n else if(value[0] === 'ICX'){\n this.setState({ICX:value[1]},()=>console.log())\n \n }\n\n else if(value[0] === 'BICO'){\n this.setState({BICO:value[1]},()=>console.log())\n \n }\n\n else if(value[0] === 'FLOW'){\n this.setState({FLOW:value[1]},()=>console.log())\n \n }\n\n else if(value[0] === 'ICP'){\n this.setState({ICP:value[1]},()=>console.log())\n \n }\n\n else if(value[0] === 'OP'){\n this.setState({OP:value[1]},()=>console.log())\n \n }\n\n else if(value[0] === 'FUNX'){\n this.setState({FX:value[1]},()=>console.log())\n \n }\n\n else if(value[0] === 'GTC'){\n this.setState({GTC:value[1]},()=>console.log())\n \n }\n\n else if(value[0] === 'CSPR'){\n this.setState({CSPR:value[1]},()=>console.log())\n \n }\n\n\n\n // Coin:['CSPR','GTC','FUNX','OP','ICP','FLOW','BICO','ICX','ENS','ETH'],\n\n }\n\n this.setState({totalValue:this.state.CSPR + this.state.GTC + this.state.FX + this.state.OP + this.state.ICP + this.state.FLOW + this.state.BICO + this.state.ICX + this.state.ENS + this.state.ETH },()=>console.log())\n }\n\n getPrice(set){\n \nlet prev = this.state.prevCoin;\nlet prevCurrency = this.state.prevCurrency;\nlet x = this.state.Coin;\nlet m = this.state.CurrencyType;\nlet sets = set;\n\nccStreamer.onopen = function onStreamOpen() {\n \n var subRequest = {\n \"action\": \"SubAdd\",\n \"subs\": x.map((coin)=>(\"5~CCCAGG~\"+coin+\"~\"+m))\n };\n \n ccStreamer.send(JSON.stringify(subRequest));\n \n \n \n}\n\nccStreamer.onmessage = evt=> {\n this.setState({\n message:JSON.parse(evt.data)\n },()=>console.log())\n var message = evt.data; \n}\n//if(sets !== undefined && this.state.prevCoin !== this.state.Coin || prevCurrency !== this.state.CurrencyType){\n\nif(sets !== undefined || prevCurrency !== this.state.CurrencyType){\n \n var subRemove = {\n \"action\": \"SubRemove\",\n \"subs\": prev.map((prevCoin)=>(\"5~CCCAGG~\"+prevCoin+\"~\"+prevCurrency))\n \n }; \n ccStreamer.send(JSON.stringify(subRemove)); \n \n var subRequest = {\n \"action\": \"SubAdd\",\n \"subs\": x.map((coin)=>(\"5~CCCAGG~\"+coin+\"~\"+m))\n \n };\n \n ccStreamer.send(JSON.stringify(subRequest)); \n \n \n ccStreamer.onmessage = evt=> {\n this.setState({\n message:JSON.parse(evt.data)\n })\n var hilo = evt.data;\n //console.log(\"Received from Cryptocompare: \" + message);\n \n \n }\n }\n this.setState({prevCoin:x},()=>console.log())\n}\n\n \n getCurrentPrice(){\n let url = 'https://min-api.cryptocompare.com/data/pricemulti?fsyms='+ this.state.Coin +'&tsyms=' + this.state.CurrencyType +'&api_key=c0de896bb4dc62341cd2590ab7cd8a3231e7614493cd395852d41c7cdd9f293d';\n fetch(url)\n .then(res => res.json())\n .then((data) => {\n \n if (this._isMounted){\n this.setState({currentPrice:data},()=>console.log())}\n }).catch(console.log)\n\n }\n \n \n\n \n\n \n\n addCoin = (coin,currency)=>{\n this.setState({added:[...this.state.added,coin+'-'+currency]},()=>console.log())\n \n }\n\n prevTrade = (request,coin,currency,slug)=>{\n this.setState({trade:[...this.state.trade,[request,coin,currency,slug]]},()=>this.enterTrade())\n }\n\n \n\n\n\n\n drawerToggleClickHandler =()=>{\n this.setState((prevState)=>{\n return {sideDrawerOpen: !prevState.sideDrawerOpen, statusDrawerOpen: false};\n });\n };\n\n statusToggleClickHandler =()=>{\n this.setState((prevState)=>{\n return {statusDrawerOpen: !prevState.statusDrawerOpen, sideDrawerOpen: false};\n });\n };\n\n backdropClickHandler =()=>{\n this.setState({sideDrawerOpen:false,statusDrawerOpen:false});\n \n };\n\n clearList=()=>{\n this.setState({added:[]},()=>console.log())\n }\n\n nextSet=()=>{\n if(this.state.setRangeFrom == 0){\n this.setState({setRangeFrom:16,setRangeTo:32},()=>this.getPrice)\n }\n else{\n this.setState({setRangeFrom:0,setRangeTo:16},()=>this.getPrice)\n }\n }\n\n remove=(coinChart)=>{\n const newCharts = this.state.chartDisplay.filter(e => (e !== coinChart))\n this.setState({chartDisplay:newCharts},()=>console.log())\n }\n\n removeUSD=(coinChart)=>{\n const USD_Chart = this.state.chartDisplay_USD.filter(e => (e !== coinChart))\n this.setState({chartDisplay_USD:USD_Chart},()=>console.log())\n }\n \n\n removeTrade=(trade)=>{\n console.log('check',trade)\n const newTrade = this.state.trade.filter(e => (e[0] !== trade[0]))\n this.setState({trade:newTrade},()=>console.log(this.state.trade))\n }\n\n getSlug(currency){\n\n if(currency === 1505){\n currency = 'USD';\n }\n else if(currency === 859){\n currency = 'BTC';\n }\n else if(this.props.currency === 145){\n currency = 'ETH';\n }\n \n //let ID = CoinId.filter(coin => coin.slug === coinID)\n \n return currency;\n\n \n}\n\n\nchangeKey=(event)=>{\n let key = event.target.value\n\n this.setState({apiKey:key},()=>this.changeApi()) \n \n}\n\ngetNews=()=>{\n \n if(this.state.newsOpen){\n fetch('https://api.coingecko.com/api/v3/status_updates??project_type=coin&per_page=60')\n .then(res => res.json())\n .then((data) => {\n if (this._isMounted){\n this.setState({news:data.status_updates,loading:false},()=>(console.log()))}\n\n })\n .catch(console.log)}\n else this.getPrice(this.state.setNumber)\n\n}\n\nnewsOpen=()=>{\n this.setState({loading:true},()=>console.log())\n this.setState((prevState)=>{\n return {newsOpen: !prevState.newsOpen};\n },()=>this.getNews()); \n\n}\n\n\n\ngetSentiment(){\n \n fetch('https://min-api.cryptocompare.com/data/tradingsignals/intotheblock/latest?fsym=BTC&api_key=e1b4be0e5ea0e0c4716ced970599b9191f5b9078a16a15b1e45d335364543c61')\n .then(res => res.json())\n .then((data) => {\n console.log(data)\nthis.setState({BTC_Sentiment:data.Data.largetxsVar},()=>console.log(this.state.BTC_Sentiment))\n })\n .catch(console.log)\n\n fetch('https://min-api.cryptocompare.com/data/tradingsignals/intotheblock/latest?fsym=ETH&api_key=e1b4be0e5ea0e0c4716ced970599b9191f5b9078a16a15b1e45d335364543c61')\n .then(res => res.json())\n .then((data) => {\n console.log(data)\nthis.setState({ETH_Sentiment:data.Data.largetxsVar},()=>console.log(this.state.ETH_Sentiment))\n })\n .catch(console.log)\n\n fetch('https://api.coingecko.com/api/v3/global/decentralized_finance_defi')\n .then(res => res.json())\n .then((data) => {\n if (this._isMounted){\n this.setState({Defi_Cap:data.data.defi_market_cap},()=>(console.log(data)))}\n\n })\n .catch(console.log)\n \n}\n\n\nfindingCoin = (event) => {\n let find= event.target.value;\n this.setState({findCoin:find},()=>console.log())\n}\n\n\n render(){\n\n let BTC_greed = 'cross';\n let ETH_greed = 'cross';\n let BTC_score = 0;\n let ETH_score = 0;\n if(this.state.BTC_Sentiment.sentiment === 'bearish'){\n BTC_greed = 'check'\n BTC_score = '53%';\n }\n else if(!this.state.BTC_Sentiment.sentiment === 'bearish'){\n BTC_score = '48%';\n }\n\n if(this.state.ETH_Sentiment.sentiment === 'bearish'){\n ETH_greed = 'check'\n ETH_score = '62%';\n }\n else if(!this.state.ETH_Sentiment.sentiment === 'bearish'){\n ETH_score = '42%';\n }\n\n let gaugeClose = () => this.setState({gaugeModalOpen:false})\n let gaugeOpen = () => this.setState({gaugeModalOpen:true})\n\n let loading = ''\n if(this.state.loading){\n loading = \n
}\n /*\n
\n
*/\n let backdrop;\n\n let topClose = () => this.setState({topOpen:false})\n let topOpen = () => this.setState({topOpen:true})\n\n if(this.state.sideDrawerOpen){\n \n backdrop=\n Search\n
\n \n \n \n \n\n \n \n
\n );\n}\n\ncomponentDidMount() {\n this._isMounted = true;\n this.getPrice();\n this.getSentiment();\n \n\n \n \n}\n\ncomponentDidUpdate(prevProps, prevState) {\n if(prevState.chartDisplay !== this.state.chartDisplay){\n \n }\n\n if(prevState.trade!== this.state.trade){\n \n }\n\n if(prevState.trade.length!== this.state.trade.length){\n \n }\n}\n\ncomponentWillUnmount() {\nthis._isMounted = false;\n}\n\n}\n\n\nexport default App;\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' },\n })\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready\n .then(registration => {\n registration.unregister();\n })\n .catch(error => {\n console.error(error.message);\n });\n }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\n\nReactDOM.render(\n \n \n
\n \n \n \n {backdrop}\n\n \n\n\n \n \n\n {this.state.topOpen&&
\n \n
\n\n\n\n
\n \n \n
\n\n\n 
\n
\nBITCOIN Greed Index
\n{BTC_score}
\n\n
\n\n\n 
\n
\nETHEREUM Greed Index
\n{ETH_score}
\n\n
\n\n\n 
\n
\nDEFI Market Cap
\n \n${this.state.Defi_Cap.slice(0,2)}.{this.state.Defi_Cap.slice(2,3)}b
\n\n \n
\n\n \n
\n \n\n \n
\nTotal Value: ${numeral(this.state.totalValue).format('0,0.00')} or P{numeral(this.state.totalValue * 54).format('0,0.00')}
\n\n\n{this.state.chartDisplay_USD.map((chart,index)=>(\n \n }\n\n
\n \n \n \n {this.state.newsOpen &&\n \n
))}\n\n\n{this.state.chartDisplay.map((chart,index)=>(\n \n ))}\n\n{this.state.gaugeModalOpen &&\n \n
\n\n\n\n \n \n
\n \n this.setState({ gaugeModalOpen:true,gaugeCoin:chart[4]})}>\n \n \n\n
\n\n this.removeUSD(chart)}> {chart[4]} - {this.getSlug(chart[1])}
\n \n\n \n
\n\n\n \n \n
\n \n this.setState({ gaugeModalOpen:true,gaugeCoin:chart[4]})}>\n \n \n\n
\n\n this.removeUSD(chart)}> {chart[4]} - {this.getSlug('BTC')}
\n \n\n\n {this.state.news.map((news,index)=>(\n
}\n\n\n\n \n \n
))}\n\n \n 
\n
\n \n \n {news.description}
\n