sormas-foundation / sormas-angular Goto Github PK
View Code? Open in Web Editor NEWAngular Frontend for the SORMAS project
Home Page: https://sormasorg.helmholtz-hzi.de/
License: GNU General Public License v3.0
Angular Frontend for the SORMAS project
Home Page: https://sormasorg.helmholtz-hzi.de/
License: GNU General Public License v3.0
We need a fast way of setting a local environment for the Sormas-Project.
We want to see if using the Sormas-Docker repository can help us with this.
We want to investigate and document how we can use the Sormas-Docker repo to start a local Sormas environment with:
For local development, I fixed this using a local Proxy, but for calling the API when running the solution with docker-compose
we still have this:
We can fix this eighter by proxy-ing the calls from Nginx to the Sormas API - then the CORS check is not done server-side, or fix it by adding the proper CORS headers for the API.
Break down the current design in smaller tasks to be able to start implementing them.
We want to have a generic Modal component that supports:
At this point styling is not the main concern - we will have further tasks to enhance it.
We want the result of this issue to be an example in the Sormas-Angular project with a page containing a button that can toggle the modal component.
We want to have a generic table component that supports:
We can select an open-source component that provides this or build our own.
At this point styling is not the main concern - we will have further tasks to enhance it.
We want the result of this issue to be an example in the Sormas-Angular project with a page containing two tables:
Because in Sormas different countries or settings can affect forms - we want to build those dynamically.
We want to research a prefered way of doing dynamic forms in Sormas Angular.
One way we can do this is to have a JSON file with the form configuration (including validation config) and use a library to apply it.
We want the result of this issue to be an example in the Sormas-Angular project with a page containing a Dynamic form. Changing the configuration file we can see the form elements and validations on the form are changed.
This is an umbrella issue to keep track of some of the non-functional requirements of Sormas Angular
.
Keycloak will be used for environments with Sormas Angular
.
Keep in mind - legacy login (without Keycloak) might still be required
(currently only supported in dev mode)
Needed to adjust dates to the user's timezone.
RTL support is necessary.
Would be nice.
Still need to consider if it is really needed.
Please take a look at https://github.com/hzi-braunschweig/SORMAS-Angular#auth-with-keycloak
We should be able to configure Keyclaok with a new Client for the Angular app:
Client ID: sormas-angular
Client Protocol: openid-connect
Root URL: http://localhost:4200/
Extra scopes to call the Sormas API
The angular client needs to be adjusted to make a sample call to the Sormas API
The new Angular application currently supports login via the Keycloak integration.
Since a lot of Sormas installations don't use Keyclaok, we need to think about a solution of using the Sormas Rest API without Keyclaok.
The Angular application needs to be configured at build time with an environment variable:
We need to update Sormas Rest so it supports a new safe Auth mechanism.
A new endpoint shall be provided for the Angular client to log in a user. This endpoint should validate the user credentials and return:
We want a new language example for an Arabic language and create functionality that for those languages the app is correctly displayed (RTL).
Changing back to a non-Arabic language should display the app LTR.
We currently have the default Unit / Integration testing setup with the Karma (angular default). This also runs the tests in CI.
We want to decide if we use the default Angular E2E test setup (Protractor) or if we setup E2E tests with Cypress, or another solution?
docker-compose
and then run the tests. Keycloak and the BE API are not mocked in those tests.https://material.angular.io/components/ripple/overview#disabling-animation
Adjust theme colors to be the ones from the UX designs.
Adjust defaults Angular Components styles to look like the ones in the UX designs.
This ticket is for the designs of the first set of components - needed for forms:
More info:
https://material.angular.io/guide/theming-your-components
We integrated the Angular App with Keycloak and the Rest API using OIDC (using a test BE).
We currently have a docker-compose
file that is usable but needs some extra settings because the Rest API rejects Basic or Bearer Authentication.
Read more: #4
Update the docker-compose
file so the Sormas-Rest Basic and Bearer auth works.
Would be nice to have two options:
We want to start using a component library for Sormas Angular that provides developers with a fast way of creating UI components.
After our discussions, we decided to go with Angular Material.
Custom theme - this requires UX work first.
There is not an easy way for the community to interact with the project's developers.
Enable GitHub discussions and/or add Gitter to this project as we do for the main project.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.