Move components from *ui-components

[himdel]

Current state:

ManageIQ/ui-components:

• uses release branches (gaprindashvili, hammer, ivanchuk, master), corresponding to 0.9 (bower), 1.0, 1.1 and 1.2 npm releases
• no automatic releases (I tried)
• typical bugfix means 3-7 PRs now (bugfix, update ui-classic master, update ui-service master, and then 2 PRs per backport), and I can only review the first one, because I'm creating the others (https://github.com/himdel/dotfiles/tree/master/ManageIQ)
• especially in the cases of dialog-user and dialog-editor, there is more logic in ui-classic and ui-service to complement the ui-components part, could be simplified by merging
• originally meant to serve to share angular components between ui-classic and ui-service, but only miq-select and dialog-user are actually used in ui-service
• uses a demo/ folder for examples

ManageIQ/react-ui-components:

• no release branches (the first need to backport something without all the rest came in https://github.com/ManageIQ/react-ui-components/pull/167), thus no way to backport things
• automatic releases
• but a ui-classic PR still needs to happen to update the version (the only reason the PR count isn't the same is that we can't backport)
• ui-classic is the only user of the repo
• uses storybook for examples (and a demo/ folder)

---

New state:

Any ui-components component used exclusively by SUI will be moved to SUI:

• [x] site-switcher: https://github.com/ManageIQ/ui-components/pull/433, https://github.com/ManageIQ/manageiq-ui-service/pull/1615

Any ui-components component used exclusively by ui-classic will be moved to ui-classic:

• [ ] common, styles (possibly doesn't need to exist, boilerplate, styles should live with their components)
• [x] dialog-editor (https://github.com/ManageIQ/ui-components/pull/436 & https://github.com/ManageIQ/manageiq-ui-classic/pull/6954)
• [ ] fonticon-picker (partly https://github.com/ManageIQ/manageiq-ui-classic/pull/6985)
• [ ] gtl (possibly replace by react version (https://github.com/ManageIQ/react-ui-components/pull/151), but likely not relevant for backports)
• [ ] quadicon
• [ ] toolbar - unused (since https://github.com/ManageIQ/manageiq-ui-classic/pull/5997), removed in https://github.com/ManageIQ/ui-components/pull/434, except for 2 components moved to gtl for the paginator
• [ ] tree-selector
• [ ] tree-view

Any react-ui-components used exclusively by ui-classic will be moved to ui-classic:

• [x] amazon-security-form-group - unused, removed in https://github.com/ManageIQ/react-ui-components/pull/170
• [x] dynamic-form - unsued, removed in https://github.com/ManageIQ/react-ui-components/pull/171
• [x] forms - removed in https://github.com/ManageIQ/react-ui-components/pull/179 (+ ManageIQ/manageiq-providers-nuage#210, ManageIQ/manageiq-providers-redfish#107 & ManageIQ/manageiq-providers-lenovo#299) (pending TODO, forms/PfSelect was already copied for tagging, remove once no react-ui-components uses)
• [ ] global-functions - sprintf and __, useless once everything is moved
• [x] helpers - only used by rbac-forms, removed in https://github.com/ManageIQ/react-ui-components/pull/172
• [ ] icon-picker - (unused, but relevant https://github.com/ManageIQ/manageiq-ui-classic/issues/5758 + https://github.com/ManageIQ/manageiq-ui-classic/pull/6985)
• [x] manageiq-validators - only used by rbac-forms, removed in https://github.com/ManageIQ/react-ui-components/pull/173
• [ ] quadicon (without react gtls, only used in AggregateStatusCard, but gtls will need it)
• [x] rbac-forms - unused, removed in https://github.com/ManageIQ/react-ui-components/pull/172
• [x] report-editor - unused, removed in https://github.com/ManageIQ/react-ui-components/pull/174
• [x] table - unused, removed in https://github.com/ManageIQ/react-ui-components/pull/175
• [x] tagging - https://github.com/ManageIQ/manageiq-ui-classic/pull/6691, https://github.com/ManageIQ/react-ui-components/pull/168
• [x] tagging-pf4 - not used at all, removed in https://github.com/ManageIQ/react-ui-components/pull/168
• [x] textual_summary
• [ ] toolbar
• [x] topology - unused, removed in https://github.com/ManageIQ/react-ui-components/pull/176
• [x] vm-snapshot-form - removed in https://github.com/ManageIQ/react-ui-components/pull/179 + https://github.com/ManageIQ/manageiq-ui-classic/pull/7004)
• [ ] wooden-tree - https://github.com/ManageIQ/manageiq-ui-classic/pull/7417

Unfinished react-ui-components work that should be finished at some point:

• Expression editor - https://github.com/ManageIQ/react-ui-components/pull/149 & https://github.com/ManageIQ/react-ui-components/pull/89
• GTL - https://github.com/ManageIQ/react-ui-components/pull/151
• Report editor - removed in https://github.com/ManageIQ/react-ui-components/pull/174

The rest of ui-components:

• [ ] dialog-user - used by ui-classic and SUI, with almost-copies of the API talking code in the respective repos - merge with that, release as a separate package (or replace by new ddf-based dialog player, if relevant by then)
• [ ] miq-select - release as part of the @pf/select (our existing fork of bootstrap-select, the jquery part of miq-select) (or possibly as part of bootstrap-select itself, which I'm now also a maintainer of)

---

Documentation:

We should merge the demo & storybook into one place documenting all our components, and add entires for the existing ui-classic ones.

(Currently not sure whether to go with storybook, we don't use the knobs that much, and it comes at the cost of a third separate webpack configuration (in addition to jest).)

[himdel]

Cc @chessbyte , re gitter :point_up: February 26, 2020 2:06 PM :)

[himdel]

(This is also relevant if we want ivanchuk to support node 12 - https://github.com/ManageIQ/manageiq-ui-classic/pull/6008 needs https://github.com/ManageIQ/react-ui-components/pull/141.)

[himdel]

Packages which depend on @manageiq/react-ui-components and are not ui-classic:

• [x] topological_inventory-ui - not relevant anymore, became sources ui, which doesn't use it

• [x] manageiq-providers-lenovo - ManageIQ/manageiq-providers-lenovo#299

• [x] manageiq-providers-nuage - ManageIQ/manageiq-providers-nuage#210

• [x] manageiq-providers-redfish - ManageIQ/manageiq-providers-redfish#107

• EDIT: new manageqiq-providers-nsxt - https://github.com/ManageIQ/manageiq-providers-nsxt/issues/6

All the providers currently depend on an ancient version (0.9.5 vs 0.11.57), and all are ui-classic UI plugins.

• that will mean converting react final form forms to DDF

The UI already has the ManageIQ.component.addReact mechanism for exposing components to plugins, with the = react 'ComponentName', {props} rails helper, so it will consume those components using this mechanism, instead of directly importing older versions.

[himdel]

Cc @romanblanco

[himdel]

TODO(after): check whether patternfly-react 2.39.15 works now (in production) - see https://github.com/ManageIQ/manageiq-ui-classic/pull/6745

[ZitaNemeckova]

Taking fonticon-picker :)

Edit: leaving i to @skateman :)

[skateman]

Gonna replace the angular version of the iconpicker with the react one in UIC if that's okay. It's assigned to me anyway.

[skateman]

Taking vm-snapshot-form because it uses finalForm explicitly and it blocks me from upgrading to DDF2.

[Fryguy]

cc @kavyanekkalapu