[PatternFly] [patternfly-react] Some thoughts and a question :-)

Mon May 15 16:44:39 UTC 2017

On Sat, May 13, 2017 at 7:45 PM, Leslie Hinson <lhinson at redhat.com> wrote:

> Hey Vojtech,
>
> This is awesome, we are definitely interested at taking a look at the work
> done already and seeing if PatternFly can leverage some of that work. We
> will want to do a design and dev review of the components to ensure that
> they adhere to PatternFly standards. There is an open PR that defines what
> that means here: https://github.com/patternfly/patternfly-react/pull/10
>

Just went over ^^ PR and all makes sense.

>
> I'm having a hard time reviewing the components because I don't see any
> test pages demonstrating the look and behavior of the components.
>

Sorry, there are no test pages for oVirt Dashboard UI components.. you'd
have to setup a local oVirt Engine dev. env. in order to see those UI
components action.

> The PatternFly-React project has been using React Storybook to test and
> demo new React UI components. There are some additional details about how
> to use Storybook here: https://github.com/patternfly/patternfly-react/
> blob/master/README.md
>

Thanks, well we could go ahead and submit new component PR(s) to
patternfly-react repo, containing everything necessary to have it approved
(associated .stories.js & .test.js files, maybe screenshots added to PR as
well).

(Side note: I really like the decision to have .stories.js & .test.js
files sitting right next to the component implementation.)

I just wanted to see if you have any plans on doing above components or if
we can go ahead and submit ours. AFAIK our components are based on older PF
styling rules (CSS class names) so we need to improve that if we contribute
them. (It also means for us to migrate to a more recent PF version in oVirt
Dashboard.)

> I'll defer to Patrick regarding including jQuery + D3 + C3 as
> patternfly-react dependencies.
>

> Lastly, I know there will be another PatternFly-React Community meeting in
> the coming weeks that Patrick Riley is coordinating. Some of the topics
> here might be interesting to add to the agenda.
>

OK, I'll be there =) thanks.

>
> Thanks,
> Leslie
>
> On Fri, May 12, 2017 at 2:26 PM, Vojtech Szocs <vszocs at redhat.com> wrote:
>
>> Hi everyone,
>>
>> I've checked out https://github.com/patternfly/patternfly-react/ and
>> looks like I'm late to the party :D
>>
>> I saw the discussion at https://github.com/patternfly/
>> patternfly-react/issues/6 and posted some ideas there. I believe that
>> exposing UI components as vanilla ES6 code is preferable for most projects
>> and such components should be really small & simple (or composite),
>> accepting data and callbacks as needed, with the usual top-down flow.
>> webpack + Babel can be used to transpile <anything_beyond_es6> to vanilla
>> ES6 (for example, if you decide to introduce Flow in your project).
>>
>> There's also a discussion whether or not to use react-bootstrap (supports
>> Bootstrap v3) and if so, whether the wrapper component should extend the
>> existing one or simply work on top of local copy of it. I generally agree
>> with others who say that reusing react-bootstrap will save you time and
>> keep up with upstream changes, maybe consider an approach where you
>> identify the need for extension/customization and open issue (or even PR)
>> on react-bootstrap if that happens.
>>
>> Also, a question - in oVirt Dashboard, we implemented some UI components
>> in React, including [1]:
>>
>> * <RenderInto> to give you control where the given components get
>> rendered, we use this for modals rendered right into HTML <body> element
>>   https://gerrit.ovirt.org/gitweb?p=ovirt-engine-dashboard.
>> git;a=blob;f=src/components/helper/RenderInto.jsx;hb=HEAD
>>
>> * basic <ModalDialog> and <Tooltip> based on jQuery
>>   https://gerrit.ovirt.org/gitweb?p=ovirt-engine-dashboard.
>> git;a=tree;f=src/components/bootstrap;hb=HEAD
>>
>> * PatternFly basics such as <DonutChart>, <SparklineChart> and <HeatMap>
>> using jQuery with D3/C3
>>   https://gerrit.ovirt.org/gitweb?p=ovirt-engine-dashboard.
>> git;a=tree;f=src/components/patternfly;hb=HEAD
>>
>> * PatternFly composites such as <AggregateStatusCard> and
>> <UtilizationTrendCard>
>>   https://gerrit.ovirt.org/gitweb?p=ovirt-engine-dashboard.
>> git;a=tree;f=src/components;hb=HEAD
>>
>> [1] some screenshots at http://www.ovirt.org/documenta
>> tion/admin-guide/chap-System_Dashboard/
>>
>> Question - which ones do you think are worth contributing to
>> patternfly-react at this point? (I saw one issue for Tooltip component, can
>> we go ahead and contribute ours?)
>>
>> Another question - some Bootstrap based components use jQuery (like
>> Tooltip) while some PatternFly specific ones (like HeatMap) have reference
>> impl's in D3/C3. So I guess that adding jQuery + D3 + C3 to
>> patternfly-react dependencies is something you would approve?
>>
>> Thanks & have a great weekend!
>> Vojtech
>> 
>>
>> _______________________________________________
>> PatternFly mailing list
>> PatternFly at redhat.com
>> https://www.redhat.com/mailman/listinfo/patternfly
>>
>>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://listman.redhat.com/archives/patternfly/attachments/20170515/2d620bcf/attachment.htm>