import dayjs from '../../utils/day';
import React from 'react';
import { useTranslation } from 'react-i18next';
import { connect } from 'react-redux';
import { createStructuredSelector } from 'reselect';
import { selectBodyshop } from '../../redux/user/user.selectors';
import AlertComponent from '../alert/alert.component';
import InstanceRenderManager from '../../utils/instanceRenderMgr';

const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
});

function FeatureWrapper({ bodyshop, featureName, noauth, children, ...restProps }) {
  const { t } = useTranslation();

  if (HasFeatureAccess({ featureName, bodyshop })) return children;

  return (
    noauth || (
      <AlertComponent
        message={t('general.messages.nofeatureaccess', {
          app: InstanceRenderManager({
            imex: '$t(titles.imexonline)',
            rome: '$t(titles.romeonline)',
            promanager: '$t(titles.promanager)',
          }),
        })}
        type="warning"
      />
    )
  );
}

export function HasFeatureAccess({ featureName, bodyshop }) {
  return bodyshop?.features.allAccess || dayjs(bodyshop?.features[featureName]).isAfter(dayjs());
}

export default connect(mapStateToProps, null)(FeatureWrapper);

/* 
dashboard
production-board
scoreboard
csi
tech-console
mobile-imaging
*/