https://github.com/city-of-helsinki/pysakoinnin-sahk-asiointi-ui

Pysäköinnin sähköinen asiointi UI
https://github.com/city-of-helsinki/pysakoinnin-sahk-asiointi-ui

Last synced: about 1 month ago
JSON representation

Pysäköinnin sähköinen asiointi UI

• Host: GitHub
• URL: https://github.com/city-of-helsinki/pysakoinnin-sahk-asiointi-ui
• Owner: City-of-Helsinki
• Created: 2022-10-12T11:59:44.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2024-04-12T08:35:41.000Z (9 months ago)
• Last Synced: 2024-04-12T15:32:44.610Z (8 months ago)
• Language: TypeScript
• Size: 3.04 MB
• Stars: 0
• Watchers: 10
• Forks: 1
• Open Issues: 7
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Pysäköinnin asiointi React UI

React UI for Pysäköinnin Asiointi e-services

## Prerequisites

1. Node 18 (`nvm use`)

1. Yarn

## Running locally

### With hot reload

1. If you don't have Yarn installed, you can install it by following [these instructions](https://classic.yarnpkg.com/lang/en/docs/install/#mac-stable)

2. Install dependencies by running the command `yarn install`

3. Run app with default webpack server `yarn start`

4. App runs on `localhost:3000`

### With Docker

1. Install Docker if you don't already have it

    - you can install Docker Desktop from [here](https://www.docker.com)

2. start Docker Desktop in the background

3. run `docker-compose up` in terminal

4. App runs on `localhost:3000`

## Config

### Environment variables

Scripts generates first environment variables to `public/env-config.js` with `scripts/update-runtime-env.ts`, which

contains the

actual used variables when running the app. App is not using CRA's default `process.env` way to refer of variables but

`window._env_` object.

Note that running built application locally you need to generate also `public/env-config.js` file. It can be done with

`yarn update-runtime-env`. By default it's generated for development environment if no `NODE_ENV` is set.

### Adding Azure library variables

This requires the installation and setup

of [Azure CLI and azure-devops tools](https://learn.microsoft.com/en-us/azure/devops/cli/?view=azure-devops)

Running the script `./scripts/update-azure-vars.sh` will add Azure library variables for a given variable group by

passing a .env file

Command for adding Azure vars

`bash ./scripts/update-azure-vars.sh -g  -e `

where `-g` is a four digit Azure variable group ID and `-e` the path to the .env file you want to upload

You can find the variable group ID by running the command

`az pipelines variable-group list --group-name  --query '[0].id'`

where `` is the Azure library name of the variable group in double quotes

e.g. `"pysakoinnin-sahk-asiointi-ui-development"`

this will return the four-digit identifier that you use in the update script.

If a given variable key already exists, the command will instead update the existing value.

## Testing

### yarn test

Runs tests in watch mode.

Scripts generates first environment variables to `public/test-env-config.js` with `scripts/update-runtime-env.ts`, which

contains the

actual used variables when running the app. App is not using CRA's default `process.env` way to refer of variables but

`window._env_` object.

### yarn test-coverage

Runs tests with coverage outputted to console. Results are saved to /coverage Note: command is run with "CI=true".

Remove this to get visually clearer results (with colors!).

### yarn update-runtime-env

Generates variable object used when app is running. Generated object is stored at `public/env-config.js` and available

as `window._env_` object.