eehitus-visual-ui library

This project holds all the global styles required for eehitus-ui.

E-ehitus CSS with styles is included into E-ehitus UI Root component

---

Table of Contents

* Getting started with development
* Prerequisites
* Running locally
* Local development
* Development patterns overview
* Common components
* Form validation
* Translations
* API requests
* Testing
* Debugging with source-maps
* Branching

---

Getting started with development

$3

- Node.js (v18.20.6)
- Yarn (v1.x)

* Recommendation:
* Node version manager
* Node version manager for Windows

$3

* npm i yarn -g - If you don't have yarn installed locally for given node version
* yarn install
* yarn start

$3

yarn start opens http://localhost:3000

You have to look for BrowserRouter definition to find the urls you can navigate to.
Usually can be found at ./src/App.tsx or in the component rendered inside it.

* ./public/config.js contains all the endpoint URL-s for different microservices.
* Default endpoint should end with /v1
* You can specify a certain API to point to your projects API /project_ingress

---

Development patterns overview

---

$3

Sass architecture: the 7-1 pattern

---

$3

* eehitus-ui-extras
* New common business logic components or enums, should be added to this library
* TEDI library - E-Ehitus is moving to use Estonian TEDI library for react.
* New features should be developed using them, if possible.
* ehr-components Old components
* These are old components and you should not create new functionality with them if possible.
* eehitus-visuaal eehitus-ui has usage of global styles
* When making changes there, make sure your change does not have impact to the rest of the UI libraries

---

$3

For library unit testing we use Jest.

E2E Tests are located in this project.

---

$3

If you have developed locally and when you update the library version in eehitus-ui project and start receiving errors,
it's wise to generate local build using yarn cibuild:debug

This generates ./dist folder

Then go into eehitus-ui project
* Remove .cache eehitus-ui/node_modules/.cache
Remove old dist eehitus-ui/node_modules/eehitus-project_name*/dist
Copy your project local debug build dist folder to eehitus-ui/node_modules/eehitus-project_name*
* Start eehitus-ui using yarn start now the error should have source-maps and debugging it, should be easier.

---

$3

For developing we use Git Flow branching pattern

Example branch names
* release/project_name
* fix/TICKET_NR-short-description
* feature/TICKET_NR-short-description
* company_name/feature/TICKET_NR-short-description

We don't recommend creating develop branch.

Good approach is to create a release/ branch and all new development in company_name/feature/ you create a Merge Request against release/*

You create tags on the release/* branch and you have a separate project namespace in rancher where you update eehitus-ui

---

$3

To get new version of the library up.

1. Go to Gitlab
2. Find your project and go to tags page document-ui as example
3. Create a New tag, specify version in semver pattern version-..* add a description of project tag or other description
4. Update your projects eehitus-ui/package.json version and run yarn to generate new yarn.lock file and commit it
5. Create a New tag for eehitus-ui
6. Update the eehitus-ui in rancher project_namespace, you should never update the v1 ingress eehitus-ui. v1 represents master and should always be in stable state.