@corva/ui NPM | npm.io

@corva/ui

develop:

This repo contains components/utils which are shared for Corva UI apps.

When you need some library changes

Currently, @corva/ui library is owned by the Dev Center team, but is developed by every Corva FE developer. So, if you need to make some update in it - you can do it by yourself. For small updates - just make a PR - and someone from the Dev Center team will review it.

If it's something pretty big - it's better to reach out someone from the Dev Center team first, to tell what you need and get feedback how to better do it. Otherwise - you risk that your huge PR on which you worked a week can be rejected because it can be not consistent with the rest of the lib

Release & deploy of the library

How to bump the version? What should be the branch name? And other more advanced cases, like release/hotfixes. The guideline for all of these cases can be found here (Corva access required)

Stories for every public component

Every public @corva/ui component has a corresponding .stories.js file that describes the component. When you work with public @corva/ui components - please also update it's stories.js file when it's necessary

Build-time variables

Name	Default Value	Required
REACT_APP_API_URL	https://api.qa.corva.ai	No
REACT_APP_DATA_API_URL	https://data.qa.corva.ai	No
REACT_APP_CDN_URL	https://cdn.corva.ai	No

Local development

yarn storybook will launch local storybook server which is convenient to use for components testing when you work on public components. That's a playground for building public components.
yarn start will open ExampleApp.js in your browser. That's a playground for building non-public components (such components will be moved from @corva/ui soon)

Link local `@corva/ui` to your app

Pre-requisite

Make sure you are using @corva/ui with latest updates from development branch
If your app is using getWebpackConfig from @corva/ui instead of @corva/dc-platform-shared, migrate it according to this guide

Steps to link your local DC app**

Run yarn build-dev or yarn build-watch in @corva/ui repo *Note: yarn build will not work for linking*
cd ./dist and run yarn link in @corva/ui dist folder (only first time)
Run yarn link @corva/ui in your local DC app root folder
Add following parameters to the config-overrides.js.It should avoid the issue of multiple React instances and the MUI styling issue

{
  resolve: {
    alias: {
      react: path.resolve('./node_modules/react'),
        '@material-ui'
    :
      resolve('./node_modules/@material-ui'),
    }
  }
}

Run yarn start in your local DC app root folder

*Note: npm link will not install @corva/ui dependencies in your node modules folder.* If you want to debug a change in @corva/ui dependencies, you should use yarn add file:../corva-ui/dist, this will install new dependencies.

Troubleshooting

Failed to compile.`Module not found: Can't resolve '@corva/ui' in ...`

Most likely you need to migrate to @corva/dc-platform-shared for cjs webpack config usage

Error.`Invalid hook call. Hooks can only be called inside of the body of a function component...`

In that case, your bundler might “see” two Reacts — one in application folder and one in your library folder. Assuming myapp and mylib are sibling folders, one possible fix is to run npm link ../myapp/node_modules/react from mylib. This should make the library use the application’s React copy.

Or change the webpack configuration in config-overrides.js file in your app. (Don't commit the changes of this file)

{
    resolve: {
        alias: {
            react: path.resolve('./node_modules/react')
        }
    }
}

Material UI styles are corrupted

Add the following parameter to the config-overrides.js file in your app

{
    resolve: {
        alias: {
            '@material-ui': resolve('./node_modules/@material-ui')
        }
    }
}

CI/CD

Stale workflow

To prevent pull request from piling up and save on resources, there is a stale workflow running in this repository. It will automatically run on schedule to mark PR's that have not received any updates in 14 days as stale, marking them with label and leaving a comment. More importantly, preview environment for stale PRs are removed. To "unstale" the PR, you either need to make any change to it, push new commit or just remove the stale label. If for some reason your PR does need to stay not stale for a long time, you can add never-stale label to it.