// import React from 'react';
import { connect } from 'react-redux';
import { compose } from 'redux';
import { createStructuredSelector } from 'reselect';
import { withReducer } from '../../app/core/with-reducer';
import { withEpics } from '../../app/core/with-epics';
import { fp as _ } from '../../common/utils/fp';
import { TrackUnavailable } from '../components/track-unavailable';
import reducer /*ACTION*/ from '../reducer';
import * as epics from '../epics';
import { withErrorBoundary } from '../../common/hoc/with-error-boundary';
import { makeMarketSelector } from '../../common/selectors';
import { TRootTrackErrorState } from '../types';
import { TMarket } from '../../common/types';
// import { make___Selector } from '../selectors';

// type TPropsExternal = {};
type TStructured = {
  market: TMarket;
};
// type TConnected = TPropsExternal & TStructured & {};

const mapStateToProps = createStructuredSelector<
  TRootTrackErrorState,
  TStructured
>({
  market: (makeMarketSelector() as unknown) as (
    state: TRootTrackErrorState
  ) => TMarket,
  // prop1: makeSelector(),
  //†prop
});
const mapDispatchToProps = {
  // action1: ACTION.action1,
  //†action
};

// Uncomment to write componentDidMount hook
// const Connected = props => {
//   useEffect(() => {}, []);
//   return <EmptyTrack {...props} />;
// }

export default compose(
  _.hoistStatics(TrackUnavailable),
  withReducer('unavailableTrack', reducer),
  withEpics('unavailableTrack', epics),
  withErrorBoundary('unavailableTrack'),
  connect(
    mapStateToProps,
    mapDispatchToProps
  )
)(TrackUnavailable) as any;
//)(Connected);