dropdown.js

import React from 'react';
import { REST_URL } from './constants';
import Select from './Select.js';

class Dropdowns extends React.Component{

    constructor(props){
        super(props);
        this.state = {
            price : [],
            block : [],
            options : [],
            id : "",
            label : ""
        };

    }

    componentDidMount(){
            let url= REST_URL + "/info"
            var prices;
            var blocks;
            var options;
            let currentComponent = this;
             fetch(url)
             .then(
             function(response) {
                 if (response.status !== 200) {
                 console.log('Looks like there was a problem. Status Code: ' +
                     response.status);
                     return;
                     }
                     response.json().then(function(data) {
                         prices = data.price;
                         blocks = data.block;
                         options = createOptions(prices, "symbol");
                         console.log(options)
                         currentComponent.setState({
                            price : prices,
                            block : blocks,
                            options : options, //I need an array of just symbols.
                            id : "symbol",
                            label : "Symbols"
                        });
                     });
                     }
                 )
                     .catch(function(err) {
                         console.log('Fetch Error :-S', err);
                     });


          function createOptions(info, id){
                var info_array = [];
                let text;
                for(let i = 0 ; i < info.length ; i++){
                    if(id == "first"){text = info[i].first}
                    if(id == "symbol"){text = info[i].symbol;}
                    if(id == "unit"){text = info[i].unit;}
                    if(id == "exchange"){text = info[i].exchange;}
                    if(id == "interval"){text = info[i].interval;}
                    if(!info_array.includes(text)){
                        info_array.push(text);
                    }
                }
                info_array.sort();
                return info_array;
            };
                
            }
    

    render() {
        return (
            <div>
             <Select price = {this.state.price} block = {this.state.block} options = {[this.state.options]} id = "symbol" label = "Symbols" />
            </div>
        )
    }
}

export default Dropdowns;