Skip to content

Development with *components repos

Martin Hradil edited this page Sep 3, 2020 · 5 revisions

We currently have 2 repositories for our components:

Both are in the process of being merged into the main ui-repository (tracking issue #6716), but until then, these are the development instructions.


Development

You can use yarn link (docs) to be able to work on a checked-out version of the code, instead of the one installed via yarn.

cd ~/ui-components
yarn
yarn run build
yarn link

cd ~/react-ui-components
yarn
yarn run build
yarn link

cd ~/manageiq-ui-classic
yarn
yarn link @manageiq/ui-components
yarn link @manageiq/react-ui-components

# undo
cd ~/manageiq-ui-classic
yarn unlink @manageiq/ui-components
yarn unlink @manageiq/react-ui-components
yarn install -f

Making changes

After any code change in any of the component repositories, you must run yarn run build in that repository.
In ui-classic, have bin/webpack --watch running, or run bin/webpack whenever yarn run build completes.

Troubleshooting

Make sure each components repo has up-to-date node_modules and yarn didn't fail.
You may need to rm -rf node_modules and yarn again after any Node.js version update.

Caution: don't rm -rf node_modules in ui-classic while having a component repository linked in. If you don't unlink first, that rm may remove your checked out repository.

webpack --watch may not pick up on yarn run build finishing sometimes, when that happens, touch app/javascript/packs/globals.js in ui-classic will trigger it.

ls -l node_modules/@manageiq in ui-classic should tell you whether you're actually using the links, or folders (and therefore npm versions)

Releases

After any change is merged in a component repository, it does NOT get picked up automatically by the ui.

A new version of the corresponding npm package has to be released first, and then you need to update UI package.json with the new version. (Technically on master, yarn upgrade should pick it up as long as we're using ~ in package.json, but just yarn won't, so do the PR if you care about others seeing the change.)

In react-ui-components, that npm release happens automatically once a PR is merged.
In ui-components, the process is manual, described here with history and scripts here.

Backports

We do not use release branches in react-ui-components, so backporting changes means just upgrading to the new release and making sure there are no incompatible changes since the last release that was used in the branch. If you need to backport individual changes to older manageiq releases, see the top issue - move the component to ui-classic, then do the backport in there.

ui-components does use release branches that match 1:1 with the UI, and uses versioned releases for releases from each branch (described at the bottom of the README).

Typically, the process is:

  • developer creates master PR
  • somebody assigns ivanchuk/yes or jansa/yes?
  • merger merges the PR
  • merger does a master npm release + corresponding ui-classic & ui-service PRs
  • Satoe backports the PR
  • merger does a branch npm release + corresponding ui-classic & ui-service PRs for that branch

Scripts exists to create the ui-classic & ui-service PRs given branch name and released version: jansa, master, depend on release-log to list merges since the last release.

Clone this wiki locally