From 24666f668196c609b70accabac1f94f04fec55ae Mon Sep 17 00:00:00 2001
From: xidedix <xidedix@users.noreply.github.com>
Date: Mon, 25 Mar 2019 15:36:01 +0100
Subject: [PATCH] refactor(Forms): move to InputGroupButtonDropdown where
 applicable

---
 src/views/Base/Forms/Forms.js | 116 ++++++++++++++++------------------
 1 file changed, 56 insertions(+), 60 deletions(-)

diff --git a/src/views/Base/Forms/Forms.js b/src/views/Base/Forms/Forms.js
index e8db662..3c9f4fd 100644
--- a/src/views/Base/Forms/Forms.js
+++ b/src/views/Base/Forms/Forms.js
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import {
   Badge,
   Button,
-  ButtonDropdown,
   Card,
   CardBody,
   CardFooter,
@@ -20,6 +19,7 @@ import {
   Input,
   InputGroup,
   InputGroupAddon,
+  InputGroupButtonDropdown,
   InputGroupText,
   Label,
   Row,
@@ -739,21 +739,20 @@ class Forms extends Component {
                   <FormGroup row>
                     <Col md="12">
                       <InputGroup>
-                        <InputGroupAddon addonType="prepend">
-                          <ButtonDropdown isOpen={this.state.first}
-                                          toggle={() => { this.setState({ first: !this.state.first }); }}>
-                            <DropdownToggle caret color="primary">
-                              Dropdown
-                            </DropdownToggle>
-                            <DropdownMenu className={this.state.first ? 'show' : ''}>
-                              <DropdownItem>Action</DropdownItem>
-                              <DropdownItem>Another Action</DropdownItem>
-                              <DropdownItem>Something else here</DropdownItem>
-                              <DropdownItem divider />
-                              <DropdownItem>Separated link</DropdownItem>
-                            </DropdownMenu>
-                          </ButtonDropdown>
-                        </InputGroupAddon>
+                        <InputGroupButtonDropdown addonType="prepend"
+                                                  isOpen={this.state.first}
+                                                  toggle={() => { this.setState({ first: !this.state.first }); }}>
+                          <DropdownToggle caret color="primary">
+                            Dropdown
+                          </DropdownToggle>
+                          <DropdownMenu className={this.state.first ? 'show' : ''}>
+                            <DropdownItem>Action</DropdownItem>
+                            <DropdownItem>Another Action</DropdownItem>
+                            <DropdownItem>Something else here</DropdownItem>
+                            <DropdownItem divider />
+                            <DropdownItem>Separated link</DropdownItem>
+                          </DropdownMenu>
+                        </InputGroupButtonDropdown>
                         <Input type="text" id="input1-group3" name="input1-group3" placeholder="Username" />
                       </InputGroup>
                     </Col>
@@ -762,57 +761,54 @@ class Forms extends Component {
                     <Col md="12">
                       <InputGroup>
                         <Input type="email" id="input2-group3" name="input2-group3" placeholder="Email" />
-                        <InputGroupAddon addonType="append">
-                          <ButtonDropdown isOpen={this.state.second}
-                                          toggle={() => { this.setState({ second: !this.state.second }); }}>
-                            <DropdownToggle caret color="primary">
-                              Dropdown
-                            </DropdownToggle>
-                            <DropdownMenu className={this.state.second ? 'show' : ''}>
-                              <DropdownItem>Action</DropdownItem>
-                              <DropdownItem>Another Action</DropdownItem>
-                              <DropdownItem>Something else here</DropdownItem>
-                              <DropdownItem divider />
-                              <DropdownItem>Separated link</DropdownItem>
-                            </DropdownMenu>
-                          </ButtonDropdown>
-                        </InputGroupAddon>
+                        <InputGroupButtonDropdown addonType="append"
+                                                  isOpen={this.state.second}
+                                                  toggle={() => { this.setState({ second: !this.state.second }); }}>
+                          <DropdownToggle caret color="primary">
+                            Dropdown
+                          </DropdownToggle>
+                          <DropdownMenu className={this.state.second ? 'show' : ''}>
+                            <DropdownItem>Action</DropdownItem>
+                            <DropdownItem>Another Action</DropdownItem>
+                            <DropdownItem>Something else here</DropdownItem>
+                            <DropdownItem divider />
+                            <DropdownItem>Separated link</DropdownItem>
+                          </DropdownMenu>
+                        </InputGroupButtonDropdown>
                       </InputGroup>
                     </Col>
                   </FormGroup>
                   <FormGroup row>
                     <Col md="12">
                       <InputGroup>
-                        <InputGroupAddon addonType="prepend">
-                          <ButtonDropdown isOpen={this.state.third}
-                                          toggle={() => { this.setState({ third: !this.state.third }); }}>
-                            {/*<Button id="caret" color="primary">Action</Button>*/}
-                            <DropdownToggle caret color="primary">Action</DropdownToggle>
-                            <DropdownMenu className={this.state.third ? 'show' : ''}>
-                              <DropdownItem>Action</DropdownItem>
-                              <DropdownItem>Another Action</DropdownItem>
-                              <DropdownItem>Something else here</DropdownItem>
-                              <DropdownItem divider />
-                              <DropdownItem>Separated link</DropdownItem>
-                            </DropdownMenu>
-                          </ButtonDropdown>
-                        </InputGroupAddon>
+                        <InputGroupButtonDropdown
+                          addonType="prepend"
+                          isOpen={this.state.third}
+                          toggle={() => { this.setState({ third: !this.state.third }); }}>
+                          <DropdownToggle caret color="primary">Action</DropdownToggle>
+                          <DropdownMenu className={this.state.third ? 'show' : ''}>
+                            <DropdownItem>Action</DropdownItem>
+                            <DropdownItem>Another Action</DropdownItem>
+                            <DropdownItem>Something else here</DropdownItem>
+                            <DropdownItem divider />
+                            <DropdownItem>Separated link</DropdownItem>
+                          </DropdownMenu>
+                        </InputGroupButtonDropdown>
                         <Input type="text" id="input3-group3" name="input3-group3" placeholder=".." />
-                        <InputGroupAddon addonType="append">
-                          <ButtonDropdown isOpen={this.state.fourth}
-                                          toggle={() => { this.setState({ fourth: !this.state.fourth }); }}>
-                            <DropdownToggle caret color="primary">
-                              Dropdown
-                            </DropdownToggle>
-                            <DropdownMenu className={this.state.fourth ? 'show' : ''}>
-                              <DropdownItem>Action</DropdownItem>
-                              <DropdownItem>Another Action</DropdownItem>
-                              <DropdownItem>Something else here</DropdownItem>
-                              <DropdownItem divider />
-                              <DropdownItem>Separated link</DropdownItem>
-                            </DropdownMenu>
-                          </ButtonDropdown>
-                        </InputGroupAddon>
+                        <InputGroupButtonDropdown  addonType="append"
+                                                   isOpen={this.state.fourth}
+                                                   toggle={() => { this.setState({ fourth: !this.state.fourth }); }}>
+                          <DropdownToggle caret color="primary">
+                            Dropdown
+                          </DropdownToggle>
+                          <DropdownMenu className={this.state.fourth ? 'show' : ''}>
+                            <DropdownItem>Action</DropdownItem>
+                            <DropdownItem>Another Action</DropdownItem>
+                            <DropdownItem>Something else here</DropdownItem>
+                            <DropdownItem divider />
+                            <DropdownItem>Separated link</DropdownItem>
+                          </DropdownMenu>
+                        </InputGroupButtonDropdown>
                       </InputGroup>
                     </Col>
                   </FormGroup>