Skip to content

Commit

Permalink
Merge v3.5 release (react-boilerplate#1929)
Browse files Browse the repository at this point in the history
* Docs Update: sass.md | New webpack version -loader suffix (react-boilerplate#1484)

* New webpack version -loader suffix

New webpack version no longer allowed to omit the '-loader' suffix when using loaders.

* Webpack 2 migration module.loaders => module.rules

* Fix Loaders/Rules

* chore(docs): fix link to redux-saga docs

Fix a broken link to redux-saga docs.

* feat(webpack): Support OpenType fonts with .otf file extension (react-boilerplate#1471)

* chore(docs): improve testing documentation

* [doc] improve code snippet syntax in unit-testing doc

linted code snippet and removed uneeded import

* [doc] add overview of reducer test in unit testing doc

add the completed reducer test file as overview in unit testing documentation

* [doc] improve component testing doc

linted code snippets, added complete test file as refernce and link to next doc page.

* chore(setup): remove LGTM config files (react-boilerplate#1317)

* chore(setup): remove LGTM

* Add collaborating guidelines

* Add @KarandikarMihir

* Remove .react.js extensions (react-boilerplate#1469)

* Remove .react.js extensions

* Restore file names in the title comments

* Remove hyphens

* chore(deps): update deps roll-up Jan-21-2017 (react-boilerplate#1501)

* fix(tests): Replace sinon restore (react-boilerplate#1512)

* Remove sinon.restore()

* Lock down sinon version

* chore(all): move to an organisation on GitHub

* Make webpack build less verbose (react-boilerplate#1510)

* removed route names from app/routes (react-boilerplate#1509)

* removed route names from app/routes

* removed name prop from internals/templates/routes

* removed name from internals/gens/route/route.hbs and routeWithReducer.hbs

* fix(eslint): Enable rule react/no-array-index-key (react-boilerplate#1521)

* enable rule react/no-array-index-key

* fix test of List component

* fix(dependencies.js): clean up console clutter for install scripts (react-boilerplate#1532)

Ref react-boilerplate#1506

* Fix typo i18n.md (react-boilerplate#1541)

* chore(deps): update deps roll-up Jan-28-2017 (react-boilerplate#1531)

* chore(deps): update deps roll-up Jan-28-2017

* Update package.json

* Set [email protected]

* Using optimised version of the banner (react-boilerplate#1560)

Taken from react-boilerplate#907

* test(build:clean script): remove test:clean from build:clean - fixes coveralls reporting? (react-boilerplate#1563)

* Update docs (README.md, Gotchas.md) (react-boilerplate#1534)

* Update README.md

* Update gotchas.md

* Add links to gotchas

* Update docs

* Remove redundant sentence

* Move reinstall steps to gotchas.md

* Update README.md

* Minor corrections

* Add jest cache clean to gotchas.md

* Fix team of devs link (react-boilerplate#1566)

* chore(deps): update deps roll-up Feb-04-2017 (react-boilerplate#1561)

* Add iOS home screen icon (react-boilerplate#1585)

* fix manifest icons (react-boilerplate#1568)

* manifest(fix) (react-boilerplate#1594)

* Change dev source map style (react-boilerplate#1559)

* (fix) ProgressBar state error (react-boilerplate#1553)

* Bind listener to the current instance of component

* Bring up coverage

* Reassign listener with newly bound listener

* Minor changes

* Separated dev and prod middlewares (react-boilerplate#1556)

* Update FAQ with Styles getting overridden (react-boilerplate#1592)

* Improve <List> tests (react-boilerplate#1134)

* Fix imported styles (react-boilerplate#1599)

* Migrate webpack loaders

* Add comment to CSS loader
This should help clarify and reduce common problems

* Split css rules into two

* Updated docs

* First draft of new styling docs

* Fix Sass heading

* Fix links and wording

* Add LESS and other improvements

* Post test fixes

* Updated headings and added more info section

* fix: Intl polyfill for language generator (react-boilerplate#1611)

* fix: Intl polyfill for language generator
* fix: appveyor chrome issue by adding suggested --ignore-checksums

* Fix broken link in documentation. Fixes react-boilerplate#1638. (react-boilerplate#1643)

* refactor(react-router-scroll): Import only useScroll (react-boilerplate#1609)

* chore(package.json): sort ESLint config (react-boilerplate#1660)

This PR will sort the ESLint configuration alphabetically in `package.json`.

* Fix iOS home screen icons (react-boilerplate#1604)



* Use absolute paths

* AppVeyor install chrome ignoring checksums

* Add Stateless Functions to Container Generator (react-boilerplate#1494)

* Add Stateless Functions to Container Generator

* Fix linting test for generators

* Tightened up generator type names

- Also made component and container use similar order and language

* Fix odd node5 issue

* and disable eslint for the var

* Fix missing reference (react-boilerplate#1725)

* Moving Contrib documentation to the right place (react-boilerplate#1721)

* refactor(react-router): Import only necessary components (react-boilerplate#1608)

Instead of importing the entire library, cherry-pick the components we use.
This is [supported and encouraged](https://github.com/ReactTraining/react-router/blob/master/docs/guides/MinimizingBundleSize.md) by react-router.

Reduced the size of the main bundle by 9 KB (709 KB -> 700 KB).

* Fixing links for the contributing.md (react-boilerplate#1738)

* a grammatical item (react-boilerplate#1740)

* Remove state update in componentWillUpdate (react-boilerplate#1769)

* syntatical improvements to progress bar (react-boilerplate#1633)

* syntatical improvements to progress bar

* declare propTypes and defaultProps on the class instead of using the static keyword

* Improve the setup to recognize our own repo before clearing it. (react-boilerplate#1720)

* Add intelligence to the setup to recognize our own repo, before nuking it. (react-boilerplate#760, react-boilerplate#1719)

* Cleaning up console messages upon setup

* Adding a prompt for deciding whether to clear the repo or not. Fixed: react-boilerplate#760, react-boilerplate#1719

* Fixing the scenario where it was not exiting this file after not removing the repository

* Doing minor changes suggested

* Updating quickstart file location (react-boilerplate#1712)

* Request utils: handle 204 and 205 HTTP response (react-boilerplate#1780)

* feat(core): styled-components v2 update (react-boilerplate#1775)

* feat(core): styled-components v2 update

* fix(deps): lock version for styled plugin

* Fix: Use local instance of shelljs (react-boilerplate#1782)

* Use local instance of shelljs

* Replace var with const

* Switching deprecated babel-preset-latest to babel-preset-env (react-boilerplate#1736)

* adding babel-preset-env package

* replacing deprecated babel-preset-latest with babel-preset-env

to avoid the following npm installation warning:
```
npm WARN deprecated [email protected]:
preset-latest accomplishes the same task as babel-preset-env.
Please install it with 'npm install babel-preset-env --save-dev'.
'{ "presets": ["latest"] }' to '{ "presets": ["env"] }'.
For more info, please check the docs: http://babeljs.io/docs/plugins/preset-env
```

Ref. react-boilerplate#1667

* removing deprecated babel-preset-latest package

* Add missing word (react-boilerplate#1789)

* Migrating from React.PropTypes to PropTypes (react-boilerplate#1787)

* adding prop-types dependency

* migrating from React.PropTypes to PropTypes

* Adding some tests (react-boilerplate#1784)

* tests(FeaturePage): testing shouldComponentUpdate function

* tests(HomePage): testing if username prop is missing

* tests(ProgressBar): testing when route is not changing

* tests: removing global-styles.js from coverage collect

* tests(Toggle): adding tests for empty values prop

* tests(store): adding missing tests

* tests(ProgressBar): adding missing tests

* chore(deps): update deps roll-up Jun-01-2017 (react-boilerplate#1794)

* chore(deps): update deps roll-up Jun-01-2017

* Add react-test-renderer as dev dependency

* Remove `react-addons-test-utils`

* Use new `react-helmet` API

* Get rid of the warning: 'DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see webpack/loader-utils#56 parseQuery() will be replaced with getOptions() in the next major version of loader-utils.'
Get rid of the warning: 'DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see webpack/loader-utils#56 parseQuery() will be replaced with getOptions() in the next major version of loader-utils.'

* Revert line that wasn't meant to be commited

* docs(maintenance): Create dependency update doc (react-boilerplate#1790)

* docs(maintenance): Create dependency update doc

* Update dependency.md

* Update dependency.md

* Update dependency.md

* Update dependency.md

* Add link to react-boilerplate#598

* Update the 'tagged template literals' link to point to its new home at styled-components.com (react-boilerplate#1824)

* feat(core): React Router v4, React-Loadable, asyncInjectors (react-boilerplate#1746)

* Migrate to react router v4.

* Make sure Switch renders after redux state change by passing in redux location, propagate computedMatch to Route, and make not-found matcher non-exact.

* Fix route generator.

* Implicitly pass store into loader from AsyncRoute to simplify custom child route components.

* Fix route prop propagation.

* Regen yarn.lock

* Keep track of route loading in redux state and read in progress bar.

* Replace AsyncRoute with react-loadable

* Add `DefaultLoadingComponentProvider`

* Rename `loader.js` to `Loadable.js`

* Revert 9f44f1b

* small chores

* Add tests

* Update generators

* Exclude component/Loadable from coverage

* Update docs

* Make App a class that extends React.Component to enable hot reloading

* Add a link to RR4 API

* Improve generators

* Fix linting errors

* Update react-loadable

* Update yarn.lock

* Propagate InnerLoadable props to the rendered component, for Route props like match.

* Refactor

* rename withMappedState -> withConnect

* rename name to key

* Use constants

* Make 'daemon' a default mode for `injectReducer`

* Simplify `ejectSaga`

* Improve docs

* clean up

* recommend to use `ConnectedSwitch`

* turn `App` into a function like it was before

* Run CI

* Import `memoryHistory` and `browserHistory` from `react-router-dom` instead of `react-router`

* Remove path from a 'not found' route

* Update deps

* Simplify tests

* Remove modes from `injectReducer`

* Make second argument to be a descriptor in `sagaInjectors`

* Change `constants` to have consistent values

* Remove non-daemon saga descriptors in production in `ejectSaga`

* Save an entire descriptor in the saga registry

* Fix `constants` in templates

* fix(hmr): Replace `preset-hmre` with vanilla webpack HMR (react-boilerplate#1871)

* Replace react-hmre with bare webpack hmr

* Explicitly unmount the main component

* Prevent recomputing reducers for `replaceReducer`

* Add a link to Wepack HMR to the docs

* Remove `overlay=true`

* Accept an array of modules to hot reload

* Add Debugging section in Docs + VS Code instructions (react-boilerplate#1698)

* Add debugging section in README

* Move WebStorm FAQ to debugging section

* Add VS Code to debugging section

* Update VS Code launch config

* Update VS Code config to work in dev branch

* Add VS Code launch.json config

* Update launch.json to be compatible with master

* Update VS Code launch to be compatible with master

* Remove .vscode launch config

* Add notice on source map issue for VS Code.

* move onSubmitForm test into mapDispatchToProps test (react-boilerplate#1644)

* Use camelcase for reducer and saga key to match selector. (react-boilerplate#1888)

* chore(deps): remove unusable deps sinon (react-boilerplate#1882)

* chore(deps): downgrade `sanitize.css` (react-boilerplate#1872)

* chore(templates): turn `App` into a functional component (react-boilerplate#1892)

Fixes react-boilerplate#1884

* fix(generators): use correct selector names in tests and regular selectors should not be nested (react-boilerplate#1873)

* Rename store.js to configureStore.js to Prevent conflict with storeJS… (react-boilerplate#1904)

* Rename store.js to configureStore.js to Prevent conflict with storeJS npm package

* Fix store -> configureStore

* Bump webpack to 3.0.0 and update related deps (react-boilerplate#1823)

* Bump webpack to 3.0.0 and related deps

* Add ModuleConcatenationPlugin to webpack base config

* Check in mysterious change in yarn.lock

* Install latest html-webpack-plugin and resolve incorrect peer dep issue

* Update webpack to 3.5.4

* Bump webpack to 3.5.5

* Move ModuleConcatenationPlugin from base to prod config, add  --display-optimization-bailout flag

* Serve Dlls via add-asset-html-webpack-plugin (react-boilerplate#1849)

* Serve Dlls via add-asset-html-webpack-plugin

* Remove duplicate dll script tags and cheerio dependency

* Remove cheerio refs from docs

* Minor whitespace change

* Remove eslint exception in webpack.dll.babel.js

* chore(deps): Upgrade React to v15.6 (react-boilerplate#1832)

* chore(deps): regenerate `yarn.lock` (react-boilerplate#1931)

* chore(deps): regenerate `yarn.lock`

* Empty commit to restart netlify

* chore(3.5): Update changelog.md
  • Loading branch information
justingreenberg authored Sep 22, 2017
1 parent 27e7398 commit c28e153
Show file tree
Hide file tree
Showing 167 changed files with 6,372 additions and 4,780 deletions.
12 changes: 12 additions & 0 deletions .github/MAINTAINERS.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
# Maintainers
- mxstbr
- oliverturner
- justingreenberg
- gihrig
- sedubois
- chaintng
- samit4me
- amilajack
- Dattaya
- jwinn
- KarandikarMihir
3 changes: 0 additions & 3 deletions .lgtm

This file was deleted.

11 changes: 11 additions & 0 deletions .github/CONTRIBUTING.md → CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -120,3 +120,14 @@ included in the project:

**IMPORTANT**: By submitting a patch, you agree to allow the project
owners to license your work under the terms of the [MIT License](https://github.com/react-boilerplate/react-boilerplate/blob/master/LICENSE.md).

# Collaborating guidelines
You can find the list of all maintainers in [MAINTAINERS.md](./MAINTAINERS.md).

There are few basic rules to ensure high quality of the boilerplate:

- Before merging, a PR requires at least two approvals from the collaborators unless it's an architectural change, a large feature, etc. If it is, then at least 50% of the core team have to agree to merge it, with every team member having a full veto right. (i.e. every single one can block any PR)
- A PR should remain open for at least two days before merging (does not apply for trivial contributions like fixing a typo). This way everyone has enough time to look into it.


You are always welcome to discuss and propose improvements to this guideline.
68 changes: 68 additions & 0 deletions Changelog.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,73 @@
# Changelog

## 3.5 September 2017

## News

So, a few things have changed in the JS ecosystem since the original release of React Boilerplate, and there was a discussion in #1776 around the it's future. TLDR; we had two incompatible PRs — one for server-side rendering, and another for react-router v4. The community decided that we would keep our dependencies up to date (upgrade react-router) and establish a clear mission for React Boilerplate:

**React Boilerplate is a rock-solid foundation for crafting large, high-performance enterprise-grade frontend web applications that have advanced/custom requirements.**
- Static output designed for CDN and edge caches
- Extreme Developer Ergonomics
- Parallelized Tests
- DLL manifest in development for blazing rebuilds
- Scaffolding tools
- Pre-baked i18n support
- Low level tooling that gives developer complete control

We may include SSR in a future version, but for now this is our focus... create-react-app and next.js are doing an awesome job and strongly recommend these projects for most use cases.

### Breaking

- **Upgrade React Router to v4.x.x** (@anuraaga, @Dattaya, et al)
- Use React-Loadable for data lifecycle management
- Refactor `asyncInjectors`: improve code splitting/saga management
- For a complete overview of changes, please see #1746

### Main

- **Upgrade React to v15.6** (@g0ddish)
- **Upgrade Webpack and related dependencies to v3.x.x** (@KarandikarMihir)
- **Upgrade `styled-components` to v2.x.x** (@justingreenberg)
- Replace `babel-preset-hmre` with vanilla Webpack HMR (@Dattaya)
- Serve Dlls via `add-asset-html-webpack-plugin` (@skidding)
- Migrate from `React.PropTypes` to `prop-types` (@dennybiasioll

### Other Updates

- Add Stateless Functions to Container generator (@outdooricon)
- Change development sourcemap style (@samit4me)
- Create new documentation for dependency updates (@gihrig)
- Downgrade `sanitize.css` (@Dattaya)
- Enable rule `react/no-array-index-key` (@carloscuatin)
- Fix `Intl` polyfill in language generator (@tmf)
- Handle 204 and 205 HTTP response (@williamdclt)
- Icon updates and improvements (@samit4me)
- Import only necessary components for RRv4 (@sorin-davidoi)
- Improve `<List>` component tests (@chaintng)
- Improve component tests in demo (@dennybiasiolli)
- Improve setup to recognize repo before clearing git (@Aftabnack)
- Make build output less verbose (@KarandikarMihir)
- Move `onSubmitForm` test into `mapDispatchToProps` test (@tomasfrancisco)
- NPM script and dependency updates, many fixes (@gihrig)
- Remove state update in componentWillUpdate (@mawi12345)
- Remove unused Sinon dependency (@avdeev)
- Remove route names from `app/routes` (@beardedtim)
- Rename `store.js` to `configureStore.js` to prevent conflict (@howardya)
- Separate `dev` and `prod` middleware (@tomazy)
- Sort ESLint config in `package.json` (@bt)
- Support OpenType fonts with `.otf` file extension (@kachkaev)
- Turn `App` into a functional component (@Dattaya)
- Update FAQ for styles getting overridden (@samit4me)
- Update the 'tagged template literals' link (@joncass)
- Use camelcase for reducer and saga key to match selector (@anuraaga)
- Use correct selector names in tests (@Dattaya)
- Use local instance of `shelljs` (@KarandikarMihir)
- Use optimized version of the RBP banner (@tomazy)
- Use relative path for `manifest.json` (@mrharel)

Many fixes to documentation thanks to @Aftabnack, @auchenberg, @danielrob, @gregoralbrecht, @JonathanMerklin, @marciopuga, @NicholasAnthony, @Skaronator, and @vedatmahir

## 3.4 January 2017

### Main
Expand Down
9 changes: 0 additions & 9 deletions MAINTAINERS

This file was deleted.

1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -117,6 +117,7 @@ Now you're ready to rumble!
- [Styling](docs/css): How to work with the CSS tooling
- [Your app](docs/js): Supercharging your app with Routing, Redux, simple
asynchronicity helpers, etc.
- [**Troubleshooting**](docs/general/gotchas.md): Solutions to common problems faced by developers.

## Supporters

Expand Down
65 changes: 25 additions & 40 deletions app/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,39 +12,43 @@ import 'babel-polyfill';
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { applyRouterMiddleware, Router, browserHistory } from 'react-router';
import { syncHistoryWithStore } from 'react-router-redux';
import { ConnectedRouter } from 'react-router-redux';
import FontFaceObserver from 'fontfaceobserver';
import { useScroll } from 'react-router-scroll';
import createHistory from 'history/createBrowserHistory';
import 'sanitize.css/sanitize.css';

// Import root app
import App from 'containers/App';

// Import selector for `syncHistoryWithStore`
import { makeSelectLocationState } from 'containers/App/selectors';

// Import Language Provider
import LanguageProvider from 'containers/LanguageProvider';

// Load the favicon, the manifest.json file and the .htaccess file
/* eslint-disable import/no-webpack-loader-syntax */
import '!file-loader?name=[name].[ext]!./favicon.ico';
import '!file-loader?name=[name].[ext]!./images/favicon.ico';
import '!file-loader?name=[name].[ext]!./images/icon-72x72.png';
import '!file-loader?name=[name].[ext]!./images/icon-96x96.png';
import '!file-loader?name=[name].[ext]!./images/icon-120x120.png';
import '!file-loader?name=[name].[ext]!./images/icon-128x128.png';
import '!file-loader?name=[name].[ext]!./images/icon-144x144.png';
import '!file-loader?name=[name].[ext]!./images/icon-152x152.png';
import '!file-loader?name=[name].[ext]!./images/icon-167x167.png';
import '!file-loader?name=[name].[ext]!./images/icon-180x180.png';
import '!file-loader?name=[name].[ext]!./images/icon-192x192.png';
import '!file-loader?name=[name].[ext]!./images/icon-384x384.png';
import '!file-loader?name=[name].[ext]!./images/icon-512x512.png';
import '!file-loader?name=[name].[ext]!./manifest.json';
import 'file-loader?name=[name].[ext]!./.htaccess'; // eslint-disable-line import/extensions
/* eslint-enable import/no-webpack-loader-syntax */

import configureStore from './store';
import configureStore from './configureStore';

// Import i18n messages
import { translationMessages } from './i18n';

// Import CSS reset and Global Styles
import './global-styles';

// Import routes
import createRoutes from './routes';

// Observe loading of Open Sans (to remove open sans, remove the <link> tag in
// the index.html file and this observer)
const openSansObserver = new FontFaceObserver('Open Sans', {});
Expand All @@ -57,49 +61,30 @@ openSansObserver.load().then(() => {
});

// Create redux store with history
// this uses the singleton browserHistory provided by react-router
// Optionally, this could be changed to leverage a created history
// e.g. `const browserHistory = useRouterHistory(createBrowserHistory)();`
const initialState = {};
const store = configureStore(initialState, browserHistory);

// Sync history and store, as the react-router-redux reducer
// is under the non-default key ("routing"), selectLocationState
// must be provided for resolving how to retrieve the "route" in the state
const history = syncHistoryWithStore(browserHistory, store, {
selectLocationState: makeSelectLocationState(),
});

// Set up the router, wrapping all Routes in the App component
const rootRoute = {
component: App,
childRoutes: createRoutes(store),
};
const history = createHistory();
const store = configureStore(initialState, history);
const MOUNT_NODE = document.getElementById('app');

const render = (messages) => {
ReactDOM.render(
<Provider store={store}>
<LanguageProvider messages={messages}>
<Router
history={history}
routes={rootRoute}
render={
// Scroll to top when going to a new page, imitating default browser
// behaviour
applyRouterMiddleware(useScroll())
}
/>
<ConnectedRouter history={history}>
<App />
</ConnectedRouter>
</LanguageProvider>
</Provider>,
document.getElementById('app')
MOUNT_NODE
);
};

// Hot reloadable translation json files
if (module.hot) {
// Hot reloadable React components and translation json files
// modules.hot.accept does not accept dynamic dependencies,
// have to be constants at compile-time
module.hot.accept('./i18n', () => {
module.hot.accept(['./i18n', 'containers/App'], () => {
ReactDOM.unmountComponentAtNode(MOUNT_NODE);
render(translationMessages);
});
}
Expand Down
5 changes: 3 additions & 2 deletions app/components/Button/index.js
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
/**
*
* Button.react.js
* Button.js
*
* A common button, if you pass it a prop "route" it'll render a link to a react-router route
* otherwise it'll render a link with an onclick
*/

import React, { PropTypes, Children } from 'react';
import React, { Children } from 'react';
import PropTypes from 'prop-types';

import A from './A';
import StyledButton from './StyledButton';
Expand Down
4 changes: 1 addition & 3 deletions app/components/Header/A.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
import styled from 'styled-components';

import NormalA from 'components/A';

const A = styled(NormalA)`
const A = NormalA.extend`
padding: 2em 0;
`;

Expand Down
4 changes: 2 additions & 2 deletions app/components/Header/HeaderLink.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Link } from 'react-router';
import { Link } from 'react-router-dom';
import styled from 'styled-components';

export default styled(Link)`
Expand All @@ -17,7 +17,7 @@ export default styled(Link)`
font-size: 16px;
border: 2px solid #41ADDD;
color: #41ADDD;
&:active {
background: #41ADDD;
color: #FFF;
Expand Down
Binary file modified app/components/Header/banner.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 3 additions & 2 deletions app/components/Img/index.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
/**
*
* Img.react.js
* Img.js
*
* Renders an image, enforcing the usage of the alt="" tag
*/

import React, { PropTypes } from 'react';
import React from 'react';
import PropTypes from 'prop-types';

function Img(props) {
return (
Expand Down
3 changes: 2 additions & 1 deletion app/components/IssueIcon/index.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';

function IssueIcon(props) {
return (
Expand All @@ -13,7 +14,7 @@ function IssueIcon(props) {
}

IssueIcon.propTypes = {
className: React.PropTypes.string,
className: PropTypes.string,
};

export default IssueIcon;
9 changes: 5 additions & 4 deletions app/components/List/index.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';

import Ul from './Ul';
import Wrapper from './Wrapper';
Expand All @@ -9,8 +10,8 @@ function List(props) {

// If we have items, render them
if (props.items) {
content = props.items.map((item, index) => (
<ComponentToRender key={`item-${index}`} item={item} />
content = props.items.map((item) => (
<ComponentToRender key={`item-${item.id}`} item={item} />
));
} else {
// Otherwise render a single component
Expand All @@ -27,8 +28,8 @@ function List(props) {
}

List.propTypes = {
component: React.PropTypes.func.isRequired,
items: React.PropTypes.array,
component: PropTypes.func.isRequired,
items: PropTypes.array,
};

export default List;
21 changes: 13 additions & 8 deletions app/components/List/tests/index.test.js
Original file line number Diff line number Diff line change
@@ -1,25 +1,30 @@
import React from 'react';
import { render } from 'enzyme';
import { shallow } from 'enzyme';

import ListItem from 'components/ListItem';
import List from '../index';

describe('<List />', () => {
it('should render the component if no items are passed', () => {
const renderedComponent = render(
const renderedComponent = shallow(
<List component={ListItem} />
);
expect(renderedComponent.find(ListItem)).toBeDefined();
});

it('should render the items', () => {
it('should pass all items props to rendered component', () => {
const items = [
'Hello',
'World',
{ id: 1, name: 'Hello' },
{ id: 2, name: 'World' },
];
const renderedComponent = render(
<List items={items} component={ListItem} />

const component = ({ item }) => <ListItem>{item.name}</ListItem>; // eslint-disable-line react/prop-types

const renderedComponent = shallow(
<List items={items} component={component} />
);
expect(renderedComponent.find(items)).toBeDefined();
expect(renderedComponent.find(component)).toHaveLength(2);
expect(renderedComponent.find(component).at(0).prop('item')).toBe(items[0]);
expect(renderedComponent.find(component).at(1).prop('item')).toBe(items[1]);
});
});
3 changes: 2 additions & 1 deletion app/components/ListItem/index.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';

import Item from './Item';
import Wrapper from './Wrapper';
Expand All @@ -14,7 +15,7 @@ function ListItem(props) {
}

ListItem.propTypes = {
item: React.PropTypes.any,
item: PropTypes.any,
};

export default ListItem;
3 changes: 2 additions & 1 deletion app/components/LoadingIndicator/Circle.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React, { PropTypes } from 'react';
import React from 'react';
import PropTypes from 'prop-types';
import styled, { keyframes } from 'styled-components';

const circleFadeDelay = keyframes`
Expand Down
Loading

0 comments on commit c28e153

Please sign in to comment.