bodyshop/client/src/components/shop-info/shop-info.component.jsx

import {  useSplitTreatments  } from '@splitsoftware/splitio-react';
import {  Button, Card, Tabs  } from 'antd';
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 ShopInfoGeneral from './shop-info.general.component';
import ShopInfoIntakeChecklistComponent from './shop-info.intake.component';
import ShopInfoLaborRates from './shop-info.laborrates.component';
import ShopInfoOrderStatusComponent from './shop-info.orderstatus.component';
import ShopInfoPartsScan from './shop-info.parts-scan';
import ShopInfoRbacComponent from './shop-info.rbac.component';
import ShopInfoResponsibilityCenterComponent from './shop-info.responsibilitycenters.component';
import ShopInfoROStatusComponent from './shop-info.rostatus.component';
import ShopInfoSchedulingComponent from './shop-info.scheduling.component';
import ShopInfoSpeedPrint from './shop-info.speedprint.component';
import {  useLocation, useNavigate  } from 'react-router-dom';
import ShopInfoTaskPresets from './shop-info.task-presets.component';
import queryString from 'query-string';
import InstanceRenderManager from '../../utils/instanceRenderMgr';
import ShopInfoRoGuard from './shop-info.roguard.component';

const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop
});
const mapDispatchToProps = (dispatch) => ({
  //setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoComponent);

export function ShopInfoComponent({ bodyshop, form, saveLoading }) {
  const {
    treatments: { CriticalPartsScanning, Enhanced_Payroll }
  } = useSplitTreatments({
    attributes: {},
    names: ["CriticalPartsScanning", "Enhanced_Payroll"],
    splitKey: bodyshop.imexshopid
  });

  const { t } = useTranslation();
  const history = useNavigate();
  const location = useLocation();
  const search = queryString.parse(location.search);

  const tabItems = [
    {
      key: "general",
      label: t("bodyshop.labels.shopinfo"),
      children: <ShopInfoGeneral form={form} />
    },
    {
      key: "speedprint",
      label: t("bodyshop.labels.speedprint"),
      children: <ShopInfoSpeedPrint form={form} />
    },
    {
      key: "rbac",
      label: t("bodyshop.labels.rbac"),
      children: <ShopInfoRbacComponent form={form} />
    },
    {
      key: "roStatus",
      label: t("bodyshop.labels.jobstatuses"),
      children: <ShopInfoROStatusComponent form={form} />
    },
    {
      key: "scheduling",
      label: t("bodyshop.labels.scheduling"),
      children: <ShopInfoSchedulingComponent form={form} />
    },
    {
      key: "orderStatus",
      label: t("bodyshop.labels.orderstatuses"),
      children: <ShopInfoOrderStatusComponent form={form} />
    },
    {
      key: "responsibilityCenters",
      label: t("bodyshop.labels.responsibilitycenters.title"),
      children: <ShopInfoResponsibilityCenterComponent form={form} />
    },
    ...InstanceRenderManager({
      imex: [
        {
          key: "checklists",
          label: t("bodyshop.labels.checklists"),
          children: <ShopInfoIntakeChecklistComponent form={form} />
        }
      ],
      rome: "USE_IMEX",
      promanager: []
    }),
    {
      key: "laborrates",
      label: t("bodyshop.labels.laborrates"),
      children: <ShopInfoLaborRates form={form} />
    },
    ...(CriticalPartsScanning.treatment === "on"
      ? [
          {
            key: "partsscan",
            label: t("bodyshop.labels.partsscan"),
            children: <ShopInfoPartsScan form={form} />
          }
        ]
      : []),
    ...(Enhanced_Payroll.treatment === "on"
      ? [
          {
            key: "task-presets",
            label: t("bodyshop.labels.task-presets"),
            children: <ShopInfoTaskPresets form={form} />
          }
        ]
      : []),
      ...InstanceRenderManager({
        imex: [
          {
            key: 'roguard',
            label: t('bodyshop.labels.roguard.title'),
            children: <ShopInfoRoGuard form={form} />,
          },
        ],
        rome: 'USE_IMEX',
        promanager: [],
      }),
  ];
  return (
    <Card
      extra={
        <Button type="primary" loading={saveLoading} onClick={() => form.submit()}>
          {t("general.actions.save")}
        </Button>
      }
    >
      <Tabs
        defaultActiveKey={search.subtab}
        onChange={(key) =>
          history({
            search: `?tab=${search.tab}&subtab=${key}`
          })
        }
        items={tabItems}
      />
    </Card>
  );
}