README.md

# Genesys Catalog UI

React application.

# Run with Docker

Pick an image from [Docker image registry](https://gitlab.croptrust.org/genesys-pgr/catalog/genesys-catalog-ui/container_registry).

```bash
docker run -it \
  -e CLIENT_ID=... \
  -e CLIENT_SECRET=... \
  -e CATALOG_API_URL=https://api.catalog.demo.genesys-pgr.org \
 dockerhub.croptrust.org/genesys-pgr/catalog/genesys-catalog-ui:1.9
```

You may need to obtain `CLIENT_ID` and `CLIENT_SECRET` from helpdesk@genesys-pgr.org.

Also inspect the Docker [swarm compose file](docker/review-compose-template.yml) that we use for CI.

# Development

This project uses npm, gulp and webpack to package the React TypeScript application.

Optional params supported:

`CLIENT_SECRET` - ui app secret used for OAuth 2 authentication in java server

`CLIENT_ID` - ui app id used for OAuth 2 authentication in java server

`CATALOG_API_URL` - url to java server

~~`googleClientId` - id of google project, used for OAuth authentication with Google.~~

~~Google api for configure projects: <https://console.developers.google.com>~~

To start a live-reload server and work on the application, run:

```bash
npm run serve
```

This starts the _webpack-dev-server_ on port 3000:

- <http://localhost:3000/webpack-dev-server/>
- <http://localhost:3000/>

Pack the React application for production and test server-side loading (run express server):

```bash
npm run serve:ssr
```

Example of using optional params:

```bash
CLIENT_ID=client-id CLIENT_SECRET=client-secret CATALOG_API_URL=http://localhost:8080 npm run serve
```

## Documentation

We rely on the following libraries to make things work:

- Material UI: <https://material-ui-1dab0.firebaseapp.com/>
- Material Icons: <https://material.io/icons/>
- Immutability helpers: <https://github.com/kolodny/immutability-helper>