Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add all components from PF4 @patternfly/react-catalog-view-extension to replace pf 3 react-extensions in console #3309

Merged
merged 1 commit into from Dec 4, 2019
Merged

Add all components from PF4 @patternfly/react-catalog-view-extension to replace pf 3 react-extensions in console #3309

merged 1 commit into from Dec 4, 2019

Conversation

jcaianirh
Copy link
Member

@jcaianirh jcaianirh commented Nov 8, 2019 •
edited

Replace pf3 dependency with PF4 PropertiesSidePanel, VerticalTabs, CatalogItemHeader, CatalogTile, and FilterSidePanel to console using new pf4 extensions. All components from pf3 react extensions are now included in this pr.

VerticalTabs:
Screen Shot 2019-11-08 at 2 14 41 PM
PropertiesSidePanel:
Screen Shot 2019-11-08 at 2 16 22 PM
FilterSidePanel
Screen Shot 2019-11-08 at 2 15 35 PM

Screen Shot 2019-11-19 at 4 30 39 PM

cc: @bmignano @spadgett

@openshift-ci-robot openshift-ci-robot added do-not-merge/work-in-progress Indicates that a PR should not merge because it is a work in progress. component/core Related to console core functionality component/dev-console Related to dev-console component/olm Related to OLM size/L Denotes a PR that changes 100-499 lines, ignoring generated files. labels Nov 8, 2019
@spadgett spadgett added this to the v4.4 milestone Nov 8, 2019
@spadgett
Copy link
Member

spadgett commented Nov 8, 2019

/hold
for 4.4

@openshift-ci-robot openshift-ci-robot added the do-not-merge/hold Indicates that a PR should not merge because someone has issued a /hold command. label Nov 8, 2019
@jcaianirh jcaianirh changed the title [WIP]: POC - Add PF4 PropertiesSidePanel, VerticalTabs, and FilterSidePanel to console … [WIP]: POC - Add PF4 PropertiesSidePanel, VerticalTabs, and FilterSidePanel to console Nov 8, 2019
@spadgett
Copy link
Member

spadgett commented Nov 8, 2019

@rhamilto fyi

@spadgett
Copy link
Member

/cc @rhamilto

@jcaianirh jcaianirh changed the title [WIP]: POC - Add PF4 PropertiesSidePanel, VerticalTabs, and FilterSidePanel to console [WIP]: POC - Add all components from PF4 @patternfly/react-catalog-view-extension to replace pf 3 react-extensions to console Nov 19, 2019
@jcaianirh jcaianirh changed the title [WIP]: POC - Add all components from PF4 @patternfly/react-catalog-view-extension to replace pf 3 react-extensions to console Add all components from PF4 @patternfly/react-catalog-view-extension to replace pf 3 react-extensions to console Nov 19, 2019
@openshift-ci-robot openshift-ci-robot removed the do-not-merge/work-in-progress Indicates that a PR should not merge because it is a work in progress. label Nov 19, 2019
@jcaianirh jcaianirh changed the title Add all components from PF4 @patternfly/react-catalog-view-extension to replace pf 3 react-extensions to console Add all components from PF4 @patternfly/react-catalog-view-extension to replace pf 3 react-extensions in console Nov 19, 2019
@jcaianirh
Copy link
Member Author

/test e2e-gcp-console

@rebeccaalpert
Copy link
Contributor 

displays subscription creation form for selected Operator expand_less | 3m0s
-- | --
Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.     at Timeout._onTimeout (/go/src/github.com/openshift/console/frontend/node_modules/jasmine/node_modules/jasmine-core/lib/jasmine-core/jasmine.js:4281:23)     at ontimeout (timers.js:427:11)     at tryOnTimeout (timers.js:289:5)     at listOnTimeout (timers.js:252:5)     at Timer.processTimers (timers.js:212:10)

/retest

@rebeccaalpert
Copy link
Contributor

Same error. Investigating.

@spadgett
Copy link
Member

Same error. Investigating.

It's a known flake :(

@rebeccaalpert
Copy link
Contributor

/retest

rhamilto
rhamilto reviewed Nov 21, 2019
View reviewed changes
frontend/public/components/utils/tile-view-page.jsx
FilterSidePanelCategoryItem,
VerticalTabs,
VerticalTabsTab,
} from '@patternfly/react-catalog-view-extension';
import { FormControl } from 'patternfly-react';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While you're in here, mind migrating<FormControl> to a plain HTML element so we can eliminate this patternfly-react dependency?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can give this a go. @jeff-phillips-18 raised an issue about how the catalog tiles may be better off with more programmatic description heights given how much the content can vary, so there may be some more changes here anyway as I work on that. (I'm looking at what we can do on the extension side first there.)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, @rebeccaalpert. It should be as simple as:

              <input
                className="pf-c-form-control co-catalog-page__input"
                type="text"
                ref={(ref) => (this.filterByKeywordInput = ref)}
                placeholder="Filter by keyword..."
                value={activeFilters.keyword.value}
                onChange={(e) => this.onKeywordChange(e.target.value)}

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have a PR up in Joe's branch for the input; should be in soonish.

@spadgett
Copy link
Member

/hold cancel

@openshift-ci-robot openshift-ci-robot removed the do-not-merge/hold Indicates that a PR should not merge because someone has issued a /hold command. label Nov 22, 2019
@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

15 similar comments
@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

/retest

@jcaianirh
Copy link
Member Author

@spadgett could you approve this pr please?

spadgett
spadgett approved these changes Dec 4, 2019
View reviewed changes
Copy link
Member

@spadgett spadgett left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm, please squash

frontend/packages/operator-lifecycle-manager/src/style.scss Outdated
@@ -275,3 +275,7 @@ $co-affinity-row-margin: 15px;
.key-operator-value__row {
padding-bottom: 15px;
}

.co-catalog-tile {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: alpha

@openshift-ci-robot openshift-ci-robot added the approved Indicates a PR has been approved by an approver from all required OWNERS files. label Dec 4, 2019
@jcaianirh
Add PropertiesSidePanel, verticalTabs, catalogtile, catalogitemheader…
bcc8bb4 
…, and FilterSidePanel to console using new pf4 extensions
spadgett
spadgett approved these changes Dec 4, 2019
View reviewed changes
Copy link
Member

@spadgett spadgett left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

/approve
/lgtm

@openshift-ci-robot openshift-ci-robot added the lgtm Indicates that a PR is ready to be merged. label Dec 4, 2019
@openshift-ci-robot
Copy link
Contributor

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: jcaianirh, spadgett

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

@openshift-merge-robot openshift-merge-robot merged commit 6c0bdc4 into openshift:master Dec 4, 2019
@spadgett spadgett added the area/dependency Issues or PRs related to dependency changes label Dec 4, 2019
@spadgett spadgett added kind/dependency-change Categorizes issue or PR as related to changing dependencies and removed area/dependency Issues or PRs related to dependency changes labels Jul 28, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@rhamilto rhamilto rhamilto left review comments

@rebeccaalpert rebeccaalpert rebeccaalpert left review comments

@redallen redallen redallen left review comments

@spadgett spadgett spadgett approved these changes

@jeff-phillips-18 jeff-phillips-18 Awaiting requested review from jeff-phillips-18

@kyoto kyoto Awaiting requested review from kyoto

Assignees

@spadgett spadgett

Labels
approved Indicates a PR has been approved by an approver from all required OWNERS files. component/core Related to console core functionality component/dev-console Related to dev-console component/olm Related to OLM kind/dependency-change Categorizes issue or PR as related to changing dependencies lgtm Indicates that a PR is ready to be merged. size/L Denotes a PR that changes 100-499 lines, ignoring generated files.
Projects
None yet
Milestone
v4.4
Development

Successfully merging this pull request may close these issues.

None yet
7 participants
@jcaianirh @spadgett @rebeccaalpert @openshift-ci-robot @rhamilto @redallen @openshift-merge-robot