The purpose of the side menu is to help the user to easily navigate through the main pages of the website without altering the user experience. Indeed, to avoid that it takes to much place on the left, a hide and show system as been developed.
# FR and EN buttons
\ No newline at end of file
## Draft button
The first section of the menu is constituted of internal links to the principal pages of the application. Though, there is one particular link, `Drafts`, that is only displayed when the user has access to articles that haven't been published yet. This is the case when the user belongs to the `ghost-editors` group. To verify that, a request is made to the elasticsearch service in order to get the drafts, if none are return it means the user doesn't have the appropriate rights and so the button is hidden. Please refer to [this]() section of the documentation to understand how the elasticsearch service can return different content depending on the user's groups.
## App version number
The bottom part of the menu includes the version number of the application. This helps us to keep track of what version is deployed on our different environments and to know on what particular version of the app a bug as been found. This version number is set in the `environment.ts` file with the value of the package.json version number. Here is the piece of code we implemented.
```ts
import*as packageJsonfrom'../../package.json';
exportconstenvironment={
version:(<any>packageJson).version
}
```
Then the `environment` variable can be imported anywhere in our application.
## FR and EN buttons
The application is built in two languages: French and English. Both are served by the same Nginx server. The French version is served at the root `data.grandlyon.com/` while the English build is served at `data.grandlyon.com/en/`. The menu includes two buttons at its bottom part, `FR` and `EN` which respectively redirects to data.grandlyon.com and data.grandlyon.com/en. Notice that it also keeps the current path and arguments. For example: `https://data.grandlyon.com/contact?subject=question` would become `https://data.grandlyon.com/en/contact?subject=question`.
