## Conflict Manager

### Setup

Make sure your yarn and node versions are up to date.

```bash
cp .env.shadow .env # initialize environment configuration
brew install yarn # make sure you have yarn
yarn install # installs all package.json dependencies
yarn start # starts dev server
```

### Development

#### Adding new dependencies
To add a new dependency:

```
yarn add {dependency}
```

Then, be sure to add/commit the yarn.lock file.

#### Tasks

* `yarn start` runs local development server at localhost:8080
* `yarn test` to run the linter and unit tests
* `yarn lint` to run only the linter
* `yarn test:unit` to run only the unit tests
* `yarn watch` to run unit tests every time a change is saved
* `yarn bundle` bundles all application js into build/bundle.js

Note: to see all available tasks, run `yarn run`.

#### Internationalization

Support for Internationalization is done using [react-intl](https://github.com/yahoo/react-intl)
and you can find an example in [hello-world](/theorchard/docs/blob/master/boilerplates/react-webpack/src/components/example/hello-world.js).

### Working with internationalization

We define all messages in folder `i18n` using message descriptors: https://github.com/yahoo/react-intl/wiki/Components#message-descriptor.
A message descriptor's description property is optional.

We wrap our map of message descriptors with `defineMessages` so our babel plugin `babel-plugin-react-intl` can find them. We use `babel-plugin-react-intl` aggregate
all of our application's i18n text so it can be exported for translation.

`defineMessages` returns the object it is called with unmodified i.e.: object => object


```
import { defineMessages } from 'react-intl';
export default defineMessages({
    header: {
        defaultMessage: 'YouTube Rights Conflicts',
        id: 'conflict-manager.header'
    }
});
```

Run the build to create the components and generate the list of strings:
```
$ yarn webpack
```

Prepare and export the strings to POEditor:
```
$ export POEDITOR_PROJECT_ID=<project_id>
$ export API_KEY=<api_key>
$ yarn i18n:export
```

Download the latest version of all the strings:
```
$ export POEDITOR_PROJECT_ID=<project_id>
$ export API_KEY=<api_key>
$ yarn i18n:import
```

All the above:
```
$ yarn i18n
```

To create the localized bundles (bundles that have both the right locale code)
and translation messages:

```
$ yarn build
```

If you wish to add support for a new locale, add in `/locale/` the following
folder structure: `<locale>/LC_MESSAGES/` and create in it a `messages.json` file.
 Note: the `<locale>` has to match the value in POEditor.

So if you wish to add French (`fr`), it will look like this:

```
$ cat react-webpack/locale/fr/LC_MESSAGES/message.json
{}
```