viamobi-component/src/core/components/BtnMenu.js

A React component that viamobi

import React, { useEffect } from 'react';
import { Button, ButtonGroup } from 'react-bootstrap';

const btnMenu = ({ btnActive, setBtnActive, activeProcess, t }) => {
  const isActive = option => {
    const isIDActive = activeProcess.findIndex(e => e === option);
    return isIDActive >= 0;
  };

  useEffect(() => {
    switch (activeProcess[0]) {
      case 'ID':
        setBtnActive(1);
        break;
      case 'PD':
        setBtnActive(2);
        break;
      default:
        setBtnActive(3);
        break;
    }
  }, []);

  return (
    <div>
      <ButtonGroup className="mb-1">
        {isActive('ID') && (
          <Button
            onClick={() => setBtnActive(1)}
            className={`btn btn-secondary border ${btnActive === 1 &&
              'bg-success'}`}
          >
            {t('options.complice')}
          </Button>
        )}
        {isActive('PD') && (
          <Button
            onClick={() => setBtnActive(2)}
            className={`btn btn-secondary border ${btnActive === 2 &&
              'bg-success'}`}
          >
            {t('options.deposit')}
          </Button>
        )}

        {isActive('OF') && (
          <Button
            onClick={() => setBtnActive(3)}
            className={`btn btn-secondary border ${btnActive === 3 &&
              'bg-success'}`}
          >
            {t('options.other')}
          </Button>
        )}
      </ButtonGroup>
    </div>
  );
};

export default btnMenu;