{"size": 880, "ext": "js", "max_stars_repo_path": "src/components/hoc/withToggle.js", "max_stars_repo_name": "Pecherskiy88/UpPeople", "max_stars_repo_stars_event_min_datetime": "2021-05-13T13:44:03.000Z", "max_stars_repo_stars_event_max_datetime": "2021-05-13T13:44:03.000Z", "max_issues_repo_path": "src/components/hoc/withToggle.js", "max_issues_repo_name": "Pecherskiy88/UpPeople", "max_issues_repo_issues_event_min_datetime": "2021-05-17T08:19:33.000Z", "max_issues_repo_issues_event_max_datetime": "2021-05-19T16:33:10.000Z", "max_forks_repo_path": "src/components/hoc/withToggle.js", "max_forks_repo_name": "Pecherskiy88/UpPeople", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": 2, "max_forks_count": null, "avg_line_length": 21.4634146341, "max_line_length": 61, "alphanum_fraction": 0.4636363636}
// Core
import React, { Component } from "react";
import { Button, Col, Row } from "reactstrap";

const withToggle = WrappedComponent =>
  class withToggle extends Component {
    state = {
      show: false
    };

    toggle = () => {
      this.setState(prevState => ({
        show: !prevState.show
      }));
    };

    render() {
      const { show } = this.state;
      const { text, color } = this.props;
      const colorBtn = show ? "danger" : color;
      return (
        <>
          <Row
            style={{
              marginBottom: "1rem"
            }}
          >
            <Col>
              <Button color={colorBtn} onClick={this.toggle}>
                {text.toUpperCase()}
              </Button>
            </Col>
          </Row>
          {show && <WrappedComponent {...this.props} />}
        </>
      );
    }
  };

export default withToggle;
