import React from 'react';
import SymbolAutocomplete from '../../search/SymbolAutocomplete';
import { loadSecurity } from 'actions/securities';

export const securitySearch = ({ dispatch, id }) => {
  const changeSymbol = (symbol) => {
    dispatch(loadSecurity(id, symbol));
  };

  return (
    <div className="Search WidgetSearch">
      <SymbolAutocomplete placeholder="Search by symbol or security name..." onSelect={(newsymbol) => changeSymbol(newsymbol.value)} />
    </div>
  );
};

export default securitySearch;
