<commit_before># Migration from ngeo 2.2 to ngeo 2.3

The version 2.3 of ngeo was adapted to prepare your application to to use [webpack](https://webpack.js.org/).
That forced us to redesign our manner to organize the code. The following "how to" will help you to
understand what we have changed, why, and will help you report these changes in your project. This will
be explained in two sections:

 - [One before the switch to ngeo 2.3](#prepare-your-code-for-ngeo-23)
 - [And one to complete the work after the upgrade to ngeo 2.3](#use-ngeo-23)

Note:
You must know that now in ngeo, the code is organized in modules. There is no more `directive` or `service`
folders. Instead we have a folder for each module. A module is a part of the application. For instance, the
`authentication` folder contains the component, the partial and the service related to
authentication. The folder also contains a `module.js` file that can be included in your
application to load directly all what is required for this module to work.


## Prepare your code for ngeo 2.3

Here are the steps to complete before switching to use ngeo 2.3. We encourage you to build and test
your application after each step. You should not see any difference when using your application.

 1. [Remove dependencies on the goog library](#remove-dependencies-on-the-goog-library)
 1. [Use only one goog.provide per file](#one-googprovide-per-file)
 1. [Integrate eslint googshift and activate check](#integrate-eslint-googshift-and-activate-check)
 1. [Transform the code to ES6 modules via googshift](#transform-the-code-via-googshift)

If you have **no custom elements** in you application you may **start directly with the third point**.

### Remove dependencies on the goog library

If in one of your .js file you refer to a `goog` function. You should replace it because we don't
use anymore this library (and we will also stop using google closure to build our code). Excepted for the following
functions: `goog.asserts`, `goog.require` and `goog.provide` (and `goog.module` but you should not have any
in your code for now). We can ignore them because we will provide them with a script, later.

To search occurrences of `goog` functions (without above exceptions) you can use this command (unix):

```
git grep goog <path_to_apps_folder> | grep -v 'require' | grep -v 'provide' | grep -v 'asserts' | grep -v 'google'
```

In a GeoMapFish project, `path_to_apps_folder` is the path to your `static-ngeo` folder.

To know how to replace a `goog` function, it can help to search the same function in `ngeo`
2.1 and compare the line with the same line in ngeo 2.2 or upper. Examples:

 - `goog.getUid` becomes `ol.getUi`.
 - `goog.object.extend` becomes `ol.obj.assign`.
 - ...

Test, then commit your changes.

### Use only one goog.provide per file

Webpack expects only one export per file. If a file contains more than one `goog.provide`, simply remove one.
Ensure that the removed value is not required (by a `goog.require`) in another file. If you find
one, replace the required value by the one still provided.

You must provide only what you declare as provided. So rename your provided class to what you
effectively provides. For instance, if you provide an `an_app_name.module.component`, you must only
have an `an_app_name.module.component` in your file. (you can have an entity assigned to this
component, like `app.module.component.myObjec`, but not a new entity, like `app.module.Service`.)
We will see later what `an_app_name` means, we encourage you to simply name it `app`.

Also the path and the name of the file must match what you provide. In the example above, it is
expected that the path to your file is `<a_folder>/module/component.js`. (We will configure
the `<a_folder>` value later.)

If you have multiple different entities in one file you can:

 - Split your file to have one class (and provide) per file.
 - Or if you don't use this entity out of the file, assign this entity to a variable inside the
   file (typically for a component controller).

It can help to see how `component`, `service`, `factory`, etc. are made in ngeo 2.3.

Note for GeoMapFish:
Your application main controllers (files in static-ngeo/js/<application>.js). Are also concerned.
But as the build expects to find the interface name in the 'goog.provide', you must potentialy rename
your file to match the interface name.
Example: you have a `ngeodesktop` interface, that means that your file must be named `ngeodesktop.js` and the
file must provide `<an_app_name>_ngeodesktop`. You may have to exceptionnaly adapt this line in your
CONST_Makefile: https://github.com/camptocamp/c2cgeoportal/blob/97eb3dcb4d6dda719cba69d7d62ecb7ebbbc72bd/c2cgeoportal/scaffolds/update/CONST_Makefile_tmpl#L911
Where `$(PACKAGE)` is `<an_app_name>` and `$*` is one of your interfaces (like `ngeodesktop`).

Test, then commit your changes.

### Integrate eslint googshift and activate check

To ensure that the code will work with webpack, we use [eslint](https://eslint.org/). You must add the new
configuration for the linter. Create a file: `.eslintrc.yaml` in your js folder (For GeoMapfish, in
`<project>/static-ngeo/apps` and `<project>/static-ngeo/components`). And copy paste this content:

```
plugins:
  - googshift

rules:
  googshift/no-duplicate-requires: error

  googshift/no-missing-requires:
    - error<commit_msg>Minor fixes in doc<commit_after># Migration from ngeo 2.2 to ngeo 2.3

The version 2.3 of ngeo was adapted to prepare your application to to use [webpack](https://webpack.js.org/).
That forced us to redesign our manner to organize the code. The following "how to" will help you to
understand what we have changed, why, and will help you report these changes in your project. This will
be explained in two sections:

 - [One before the switch to ngeo 2.3](#prepare-your-code-for-ngeo-23)
 - [And one to complete the work after the upgrade to ngeo 2.3](#use-ngeo-23)

Note:
You must know that now in ngeo, the code is organized in modules. There is no more `directive` or `service`
folders. Instead we have a folder for each module. A module is a part of the application. For instance, the
`authentication` folder contains the component, the partial and the service related to
authentication. The folder also contains a `module.js` file that can be included in your
application to load directly all what is required for this module to work.


## Prepare your code for ngeo 2.3

Here are the steps to complete before switching to use ngeo 2.3. We encourage you to build and test
your application after each step. You should not see any difference when using your application.

 1. [Remove dependencies on the goog library](#remove-dependencies-on-the-goog-library)
 1. [Use only one goog.provide per file](#one-googprovide-per-file)
 1. [Integrate eslint googshift and activate check](#integrate-eslint-googshift-and-activate-check)
 1. [Transform the code to ES6 modules via googshift](#transform-the-code-via-googshift)

If you have **no custom elements** in you application you may **start directly with the third point**.

### Remove dependencies on the goog library

If in one of your .js file you refer to a `goog` function. You should replace it because we don't
use anymore this library (and we will also stop using google closure to build our code). Excepted for the following
functions: `goog.asserts`, `goog.require` and `goog.provide` (and `goog.module` but you should not have any
in your code for now). We can ignore them because we will provide them with a script, later.

To search occurrences of `goog` functions (without above exceptions) you can use this command (unix):

```
git grep goog <path_to_apps_folder> | grep -v 'require' | grep -v 'provide' | grep -v 'asserts' | grep -v 'google'
```

In a GeoMapFish project, `path_to_apps_folder` is the path to your `static-ngeo` folder.

To know how to replace a `goog` function, it can help to search the same function in `ngeo`
2.1 and compare the line with the same line in ngeo 2.2 or upper. Examples:

 - `goog.getUid` becomes `ol.getUid`.
 - `goog.object.extend` becomes `ol.obj.assign`.
 - ...

Test, then commit your changes.

### Use only one goog.provide per file

Webpack expects only one export per file. If a file contains more than one `goog.provide`, simply remove one.
Ensure that the removed value is not required (by a `goog.require`) in another file. If you find
one, replace the required value by the one still provided.

You must provide only what you declare as provided. So rename your provided class to what you
effectively provides. For instance, if you provide an `an_app_name.module.component`, you must only
have an `an_app_name.module.component` in your file. (you can have an entity assigned to this
component, like `app.module.component.myObjec`, but not a new entity, like `app.module.Service`.)
We will see later what `an_app_name` means, we encourage you to simply name it `app`.

Also the path and the name of the file must match what you provide. In the example above, it is
expected that the path to your file is `<a_folder>/module/component.js`. (We will configure
the `<a_folder>` value later.)

If you have multiple different entities in one file you can:

 - Split your file to have one class (and provide) per file.
 - Or if you don't use this entity out of the file, assign this entity to a variable inside the
   file (typically for a component controller).

It can help to see how `component`, `service`, `factory`, etc. are made in ngeo 2.3.

Note for GeoMapFish:
Your application main controllers (files in `static-ngeo/js/<application>.js`). Are also concerned.
But as the build expects to find the interface name in the 'goog.provide', you must potentialy rename
your file to match the interface name.
Example: you have a `ngeodesktop` interface, that means that your file must be named `ngeodesktop.js` and the
file must provide `<an_app_name>_ngeodesktop`. You may have to exceptionnaly adapt this line in your
CONST_Makefile: https://github.com/camptocamp/c2cgeoportal/blob/97eb3dcb4d6dda719cba69d7d62ecb7ebbbc72bd/c2cgeoportal/scaffolds/update/CONST_Makefile_tmpl#L911
Where `$(PACKAGE)` is `<an_app_name>` and `$*` is one of your interfaces (like `ngeodesktop`).

Test, then commit your changes.

### Integrate eslint googshift and activate check

To ensure that the code will work with webpack, we use [eslint](https://eslint.org/). You must add the new
configuration for the linter. Create a file: `.eslintrc.yaml` in your js folder (For GeoMapfish, in
`<project>/static-ngeo/apps` and `<project>/static-ngeo/components`). And copy paste this content:

```
plugins:
  - googshift

rules:
  googshift/no-duplicate-requires: error

  googshift/no-missing-requires:
    - error
{'fraction_non_alphanumeric': 0.0803339517625232, 'fraction_numerical': 0.00927643784786642, 'mean_word_length': 4.289990186457311, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 19, 'https://': 6, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3090208', 'n_tokens_mistral': 3211, 'n_tokens_neox': 3029, 'n_words': 1546}