Skip to content

Commit e5d84e0

Browse files
xidedixxidedix
committed
Merge branch 'reactbits-fix-circular-dependency'
2 parents 1ab1326 + 0576d18 commit e5d84e0

File tree

6 files changed

+112
-114
lines changed

6 files changed

+112
-114
lines changed

‎CHANGELOG.md

+21
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,26 @@
11
## [CoreUI](https://coreui.io/) for [react](./REACT.md) changelog
22

3+
##### `v2.1.6`
4+
- fix(App): remove redundant react-loadable - thanks @sergeyt
5+
- fix(routes) remove circular dependency - thanks @sergeyt
6+
- refactor(App): change to render in Route
7+
- fix(routes): add Home to routes - breadcrumb issue
8+
- refactor(DefaultHeader): move to ReactRouter `NavLink`
9+
- refactor(Forms): move to `InputGroupButtonDropdown` where applicable
10+
11+
###### dependencies update
12+
- update: `@coreui/coreui` to `^2.1.9`
13+
- update: `@coreui/react` to `~2.1.5`
14+
- update: `chart.js` to `^2.8.0`
15+
- update: `enzyme-adapter-react-16` to `^1.11.2`
16+
- update: `react` to `^16.8.5`
17+
- update: `react-app-polyfill` to `^0.2.2`
18+
- update: `react-dom` to `^16.8.5`
19+
- update: `react-router-config` to `^4.4.0-beta.8`
20+
- update: `react-router-dom` to `~4.3.1`
21+
- update: `react-test-renderer` to `^16.8.5`
22+
- update: `react-scripts` to `^2.1.8`
23+
324
##### `v2.1.5`
425
- fix: iOS 9 Safari sidebar toggle force issue `@coreui/[email protected]`
526

‎package.json

+12-13
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@coreui/coreui-free-react-admin-template",
3-
"version": "2.1.5",
3+
"version": "2.1.6",
44
"description": "CoreUI React Open Source Bootstrap 4 Admin Template",
55
"author": "Łukasz Holeczek",
66
"homepage": "https://coreui.io",
@@ -12,33 +12,32 @@
1212
"url": "[email protected]:coreui/coreui-free-react-admin-template.git"
1313
},
1414
"dependencies": {
15-
"@coreui/coreui": "^2.1.7",
15+
"@coreui/coreui": "^2.1.9",
1616
"@coreui/coreui-plugin-chartjs-custom-tooltips": "^1.2.0",
1717
"@coreui/icons": "0.3.0",
18-
"@coreui/react": "^2.1.5",
18+
"@coreui/react": "~2.1.5",
1919
"bootstrap": "^4.3.1",
20-
"chart.js": "^2.7.3",
20+
"chart.js": "^2.8.0",
2121
"classnames": "^2.2.6",
2222
"core-js": "^2.6.5",
2323
"enzyme": "^3.9.0",
24-
"enzyme-adapter-react-16": "^1.10.0",
24+
"enzyme-adapter-react-16": "^1.11.2",
2525
"flag-icon-css": "^3.3.0",
2626
"font-awesome": "^4.7.0",
2727
"node-sass": "^4.11.0",
2828
"prop-types": "^15.7.2",
29-
"react": "^16.8.4",
30-
"react-app-polyfill": "^0.2.1",
29+
"react": "^16.8.5",
30+
"react-app-polyfill": "^0.2.2",
3131
"react-chartjs-2": "^2.7.4",
32-
"react-dom": "^16.8.4",
33-
"react-loadable": "^5.5.0",
34-
"react-router-config": "^4.4.0-beta.6",
35-
"react-router-dom": "^4.3.1",
36-
"react-test-renderer": "^16.8.4",
32+
"react-dom": "^16.8.5",
33+
"react-router-config": "^4.4.0-beta.8",
34+
"react-router-dom": "~4.3.1",
35+
"react-test-renderer": "^16.8.5",
3736
"reactstrap": "^7.1.0",
3837
"simple-line-icons": "^2.4.1"
3938
},
4039
"devDependencies": {
41-
"react-scripts": "2.1.5"
40+
"react-scripts": "^2.1.8"
4241
},
4342
"scripts": {
4443
"start": "react-scripts start",

‎src/App.js

+14-31
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,33 @@
11
import React, { Component } from 'react';
22
import { HashRouter, Route, Switch } from 'react-router-dom';
33
// import { renderRoutes } from 'react-router-config';
4-
import Loadable from 'react-loadable';
54
import './App.scss';
65

76
const loading = () => <div className="animated fadeIn pt-3 text-center">Loading...</div>;
87

98
// Containers
10-
const DefaultLayout = Loadable({
11-
loader: () => import('./containers/DefaultLayout'),
12-
loading
13-
});
9+
const DefaultLayout = React.lazy(() => import('./containers/DefaultLayout'));
1410

1511
// Pages
16-
const Login = Loadable({
17-
loader: () => import('./views/Pages/Login'),
18-
loading
19-
});
20-
21-
const Register = Loadable({
22-
loader: () => import('./views/Pages/Register'),
23-
loading
24-
});
25-
26-
const Page404 = Loadable({
27-
loader: () => import('./views/Pages/Page404'),
28-
loading
29-
});
30-
31-
const Page500 = Loadable({
32-
loader: () => import('./views/Pages/Page500'),
33-
loading
34-
});
12+
const Login = React.lazy(() => import('./views/Pages/Login'));
13+
const Register = React.lazy(() => import('./views/Pages/Register'));
14+
const Page404 = React.lazy(() => import('./views/Pages/Page404'));
15+
const Page500 = React.lazy(() => import('./views/Pages/Page500'));
3516

3617
class App extends Component {
3718

3819
render() {
3920
return (
4021
<HashRouter>
41-
<Switch>
42-
<Route exact path="/login" name="Login Page" component={Login} />
43-
<Route exact path="/register" name="Register Page" component={Register} />
44-
<Route exact path="/404" name="Page 404" component={Page404} />
45-
<Route exact path="/500" name="Page 500" component={Page500} />
46-
<Route path="/" name="Home" component={DefaultLayout} />
47-
</Switch>
22+
<React.Suspense fallback={loading()}>
23+
<Switch>
24+
<Route exact path="/login" name="Login Page" render={props => <Login {...props}/>} />
25+
<Route exact path="/register" name="Register Page" render={props => <Register {...props}/>} />
26+
<Route exact path="/404" name="Page 404" render={props => <Page404 {...props}/>} />
27+
<Route exact path="/500" name="Page 500" render={props => <Page500 {...props}/>} />
28+
<Route path="/" name="Home" render={props => <DefaultLayout {...props}/>} />
29+
</Switch>
30+
</React.Suspense>
4831
</HashRouter>
4932
);
5033
}

‎src/containers/DefaultLayout/DefaultHeader.js

+8-8
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React, { Component } from 'react';
2-
import { Link } from 'react-router-dom';
3-
import { Badge, DropdownItem, DropdownMenu, DropdownToggle, Nav, NavItem, NavLink } from 'reactstrap';
2+
import { Link, NavLink } from 'react-router-dom';
3+
import { Badge, DropdownItem, DropdownMenu, DropdownToggle, Nav, NavItem } from 'reactstrap';
44
import PropTypes from 'prop-types';
55

66
import { AppAsideToggler, AppHeaderDropdown, AppNavbarBrand, AppSidebarToggler } from '@coreui/react';
@@ -30,24 +30,24 @@ class DefaultHeader extends Component {
3030

3131
<Nav className="d-md-down-none" navbar>
3232
<NavItem className="px-3">
33-
<Link to="/" className="nav-link" >Dashboard</Link>
33+
<NavLink to="/dashboard" className="nav-link" >Dashboard</NavLink>
3434
</NavItem>
3535
<NavItem className="px-3">
36-
<Link to="/users">Users</Link>
36+
<Link to="/users" className="nav-link">Users</Link>
3737
</NavItem>
3838
<NavItem className="px-3">
39-
<NavLink href="#">Settings</NavLink>
39+
<NavLink to="#" className="nav-link">Settings</NavLink>
4040
</NavItem>
4141
</Nav>
4242
<Nav className="ml-auto" navbar>
4343
<NavItem className="d-md-down-none">
44-
<NavLink href="#"><i className="icon-bell"></i><Badge pill color="danger">5</Badge></NavLink>
44+
<NavLink to="#" className="nav-link"><i className="icon-bell"></i><Badge pill color="danger">5</Badge></NavLink>
4545
</NavItem>
4646
<NavItem className="d-md-down-none">
47-
<NavLink href="#"><i className="icon-list"></i></NavLink>
47+
<NavLink to="#" className="nav-link"><i className="icon-list"></i></NavLink>
4848
</NavItem>
4949
<NavItem className="d-md-down-none">
50-
<NavLink href="#"><i className="icon-location-pin"></i></NavLink>
50+
<NavLink to="#" className="nav-link"><i className="icon-location-pin"></i></NavLink>
5151
</NavItem>
5252
<AppHeaderDropdown direction="down">
5353
<DropdownToggle nav>

‎src/routes.js

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React from 'react';
2-
import DefaultLayout from './containers/DefaultLayout';
32

43
const Breadcrumbs = React.lazy(() => import('./views/Base/Breadcrumbs'));
54
const Cards = React.lazy(() => import('./views/Base/Cards'));
@@ -39,7 +38,7 @@ const User = React.lazy(() => import('./views/Users/User'));
3938

4039
// https://github.com/ReactTraining/react-router/tree/master/packages/react-router-config
4140
const routes = [
42-
{ path: '/', exact: true, name: 'Home', component: DefaultLayout },
41+
{ path: '/', exact: true, name: 'Home' },
4342
{ path: '/dashboard', name: 'Dashboard', component: Dashboard },
4443
{ path: '/theme', exact: true, name: 'Theme', component: Colors },
4544
{ path: '/theme/colors', name: 'Colors', component: Colors },

‎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)