Integrate multiselect search users in the
modal add members.
We are using react-select to implement the
multiselect search users. We are using this
library in waiting for Cunningham to implement
the multiselect asynch component.
Some tokens were not available from the hook.
We only had the tokens of the currentTheme available
but actually the theme is an augmentation of the
default theme, so we should use the default theme
tokens as a base and then override them with the
currentTheme tokens.
It is what this commit does.
Integrate the action button dropdown in
the member grid. For the moment it will be
used to update the role of a member.
Manage use cases:
- Does not display when member's role
- Does not display when member is an admin
that wants to update owner role.
Downgrade @openfun/cunningham-react to 2.4.0, because of a
compatibility problem with Jest.
We add this package with this version to the ignore list
in renovate.json, when we will have a new compatible version, we will
remove it from the ignore list.
Downgrade @types/react-dom to 18.2.18.
The lastest version seems to have lot of compatibility
issues with other packages:
- @openfun/cunningham-react
- @tanstack/react-query-devtools
- next
We add this package with this version to the ignore list
in renovate.json, when we will have a new compatible version, we will
remove it from the ignore list.
Instead of interacting with Keycloak, the frontend navigate to the
/authenticate endpoint, which starts the Authorization code flow.
When the flow is done, the backend redirect back to the SPA,
passing a session cookie and a csrf cookie.
Done:
- Query GET user/me to determine if user is authenticated yet
- Remove Keycloak js dependency, as all the OIDC logic is handled by the backend
- Store user's data instead of the JWT token
Downgrade @types/react-dom to 18.2.18.
The lastest version seems to have lot of compatibility
issues with other packages:
- @openfun/cunningham-react
- @tanstack/react-query-devtools
- next
The svg in nextjs was not handled as a react component, it was
not possible to change dynamically the color of the svg by example.
We add the @svgr/webpack, it will handle the svg as react component.
We keep as well the way next.js handle the svg, so we can use both
ways.
To handle the svg in the next way we need to add the
`?url` at the end of the svg import.
We need to add a linter to the i18n package, we are mainly
interested by the jest linting rules so we create
a jest eslint config pluggable our other configs and to the
i18n eslint config.
We install Jest to test our i18n package.
We tests:
- the extraction of the translations on the Desk app fo crowdin
- the formatings of the translations from crowdin to the app
- we check that all the translations are present in the app
We connect the tests to the CI.
We create a package i18n to manage the translations of the project.
It help us to extract the translations from the frontend to
be deployed to crowdin.
It also help us to format the translations from crowdin to
be used by the frontend apps.
Add styled-components to the app-desk, it will help us to create
easily styled components.
We create 2 components, Box and Text, it is 2 generic components
that we help us to style quickly html elements. They use
the power of styled-components and Cunningham's design system.
Create a fetch wrapper for the API calls, it will handle:
- add correct basename on the api request
- add Bearer automatically on the api request
- logout automatically on 401 request
Install playwright, adapt the config file and add a scripts to
run the tests.
e2e testing will monitor all our frontend applications,
so we install it in the frontend folder.
It configures the base of our monorepo.
