Skip to content

Commit 24666f6

Browse files
xidedixxidedix
committed
refactor(Forms): move to InputGroupButtonDropdown where applicable
1 parent 7ad00e6 commit 24666f6

File tree

1 file changed

+56
-60
lines changed

1 file changed

+56
-60
lines changed

‎src/views/Base/Forms/Forms.js

+56-60
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
22
import {
33
Badge,
44
Button,
5-
ButtonDropdown,
65
Card,
76
CardBody,
87
CardFooter,
@@ -20,6 +19,7 @@ import {
2019
Input,
2120
InputGroup,
2221
InputGroupAddon,
22+
InputGroupButtonDropdown,
2323
InputGroupText,
2424
Label,
2525
Row,
@@ -739,21 +739,20 @@ class Forms extends Component {
739739
<FormGroup row>
740740
<Col md="12">
741741
<InputGroup>
742-
<InputGroupAddon addonType="prepend">
743-
<ButtonDropdown isOpen={this.state.first}
744-
toggle={() => { this.setState({ first: !this.state.first }); }}>
745-
<DropdownToggle caret color="primary">
746-
Dropdown
747-
</DropdownToggle>
748-
<DropdownMenu className={this.state.first ? 'show' : ''}>
749-
<DropdownItem>Action</DropdownItem>
750-
<DropdownItem>Another Action</DropdownItem>
751-
<DropdownItem>Something else here</DropdownItem>
752-
<DropdownItem divider />
753-
<DropdownItem>Separated link</DropdownItem>
754-
</DropdownMenu>
755-
</ButtonDropdown>
756-
</InputGroupAddon>
742+
<InputGroupButtonDropdown addonType="prepend"
743+
isOpen={this.state.first}
744+
toggle={() => { this.setState({ first: !this.state.first }); }}>
745+
<DropdownToggle caret color="primary">
746+
Dropdown
747+
</DropdownToggle>
748+
<DropdownMenu className={this.state.first ? 'show' : ''}>
749+
<DropdownItem>Action</DropdownItem>
750+
<DropdownItem>Another Action</DropdownItem>
751+
<DropdownItem>Something else here</DropdownItem>
752+
<DropdownItem divider />
753+
<DropdownItem>Separated link</DropdownItem>
754+
</DropdownMenu>
755+
</InputGroupButtonDropdown>
757756
<Input type="text" id="input1-group3" name="input1-group3" placeholder="Username" />
758757
</InputGroup>
759758
</Col>
@@ -762,57 +761,54 @@ class Forms extends Component {
762761
<Col md="12">
763762
<InputGroup>
764763
<Input type="email" id="input2-group3" name="input2-group3" placeholder="Email" />
765-
<InputGroupAddon addonType="append">
766-
<ButtonDropdown isOpen={this.state.second}
767-
toggle={() => { this.setState({ second: !this.state.second }); }}>
768-
<DropdownToggle caret color="primary">
769-
Dropdown
770-
</DropdownToggle>
771-
<DropdownMenu className={this.state.second ? 'show' : ''}>
772-
<DropdownItem>Action</DropdownItem>
773-
<DropdownItem>Another Action</DropdownItem>
774-
<DropdownItem>Something else here</DropdownItem>
775-
<DropdownItem divider />
776-
<DropdownItem>Separated link</DropdownItem>
777-
</DropdownMenu>
778-
</ButtonDropdown>
779-
</InputGroupAddon>
764+
<InputGroupButtonDropdown addonType="append"
765+
isOpen={this.state.second}
766+
toggle={() => { this.setState({ second: !this.state.second }); }}>
767+
<DropdownToggle caret color="primary">
768+
Dropdown
769+
</DropdownToggle>
770+
<DropdownMenu className={this.state.second ? 'show' : ''}>
771+
<DropdownItem>Action</DropdownItem>
772+
<DropdownItem>Another Action</DropdownItem>
773+
<DropdownItem>Something else here</DropdownItem>
774+
<DropdownItem divider />
775+
<DropdownItem>Separated link</DropdownItem>
776+
</DropdownMenu>
777+
</InputGroupButtonDropdown>
780778
</InputGroup>
781779
</Col>
782780
</FormGroup>
783781
<FormGroup row>
784782
<Col md="12">
785783
<InputGroup>
786-
<InputGroupAddon addonType="prepend">
787-
<ButtonDropdown isOpen={this.state.third}
788-
toggle={() => { this.setState({ third: !this.state.third }); }}>
789-
{/*<Button id="caret" color="primary">Action</Button>*/}
790-
<DropdownToggle caret color="primary">Action</DropdownToggle>
791-
<DropdownMenu className={this.state.third ? 'show' : ''}>
792-
<DropdownItem>Action</DropdownItem>
793-
<DropdownItem>Another Action</DropdownItem>
794-
<DropdownItem>Something else here</DropdownItem>
795-
<DropdownItem divider />
796-
<DropdownItem>Separated link</DropdownItem>
797-
</DropdownMenu>
798-
</ButtonDropdown>
799-
</InputGroupAddon>
784+
<InputGroupButtonDropdown
785+
addonType="prepend"
786+
isOpen={this.state.third}
787+
toggle={() => { this.setState({ third: !this.state.third }); }}>
788+
<DropdownToggle caret color="primary">Action</DropdownToggle>
789+
<DropdownMenu className={this.state.third ? 'show' : ''}>
790+
<DropdownItem>Action</DropdownItem>
791+
<DropdownItem>Another Action</DropdownItem>
792+
<DropdownItem>Something else here</DropdownItem>
793+
<DropdownItem divider />
794+
<DropdownItem>Separated link</DropdownItem>
795+
</DropdownMenu>
796+
</InputGroupButtonDropdown>
800797
<Input type="text" id="input3-group3" name="input3-group3" placeholder=".." />
801-
<InputGroupAddon addonType="append">
802-
<ButtonDropdown isOpen={this.state.fourth}
803-
toggle={() => { this.setState({ fourth: !this.state.fourth }); }}>
804-
<DropdownToggle caret color="primary">
805-
Dropdown
806-
</DropdownToggle>
807-
<DropdownMenu className={this.state.fourth ? 'show' : ''}>
808-
<DropdownItem>Action</DropdownItem>
809-
<DropdownItem>Another Action</DropdownItem>
810-
<DropdownItem>Something else here</DropdownItem>
811-
<DropdownItem divider />
812-
<DropdownItem>Separated link</DropdownItem>
813-
</DropdownMenu>
814-
</ButtonDropdown>
815-
</InputGroupAddon>
798+
<InputGroupButtonDropdown addonType="append"
799+
isOpen={this.state.fourth}
800+
toggle={() => { this.setState({ fourth: !this.state.fourth }); }}>
801+
<DropdownToggle caret color="primary">
802+
Dropdown
803+
</DropdownToggle>
804+
<DropdownMenu className={this.state.fourth ? 'show' : ''}>
805+
<DropdownItem>Action</DropdownItem>
806+
<DropdownItem>Another Action</DropdownItem>
807+
<DropdownItem>Something else here</DropdownItem>
808+
<DropdownItem divider />
809+
<DropdownItem>Separated link</DropdownItem>
810+
</DropdownMenu>
811+
</InputGroupButtonDropdown>
816812
</InputGroup>
817813
</Col>
818814
</FormGroup>

0 commit comments

Comments
 (0)