import React from 'react';
import { withRouter } from 'react-router-dom';
import { withSiteId } from 'App/routes';
import { observer } from 'mobx-react-lite'
import { useStore } from "App/mstore";

export default BaseComponent => withRouter(observer((props) => {
  const { history, ...other } = props
  const { projectsStore } = useStore();
  const siteId = projectsStore.siteId

  const push = (location) => {
    if (typeof location === 'string') {
      history.push(withSiteId(location, siteId));
    } else if (typeof location === 'object') {
      history.push({ ...location, pathname: withSiteId(location.pathname, siteId) });
    }
  }

  return <BaseComponent {...other} history={{ ...history, push: push }} />
}))