Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • 03:56
    olliechick commented #1704
  • Aug 10 03:01
    z-lionel opened #1765
  • Aug 09 18:57
    taw1313 commented #1740
  • Aug 09 06:41
    conorgould commented #1181
  • Aug 09 04:02
    yusufvalid opened #1764
  • Aug 08 21:05
    An6r commented #1763
  • Aug 08 18:52
    DavidRochelTR commented #1625
  • Aug 08 14:00
    shunyue1320 commented #1632
  • Aug 08 07:31
    khRasikh commented #1739
  • Aug 05 18:54
    quantuminformation commented #1763
  • Aug 05 15:25
    nicolasletoublon commented #595
  • Aug 04 19:50
    dceddia commented #1632
  • Aug 04 06:53
    enslit closed #1709
  • Aug 02 10:03
    gormonn commented #1746
  • Jul 31 13:00
    rhlmalik17 commented #1569
  • Jul 28 19:35
    luka00001 commented #1363
  • Jul 28 09:45
    nostalgiaz commented #1625
  • Jul 27 12:52
    32naman commented #1647
  • Jul 24 18:54
    mastrobardo commented #767
  • Jul 24 18:52
    mastrobardo commented #767
Jordan
@jpollard-cs
@edgesoft did you get things sorted out?
Mathias Nilsson
@edgesoft
@jpollard-cs I went with @bvaughn suggestion and made another solution other than tampering with the Grid
Thanks for this incredible lib! When using onMouseEnter and onMouseLeave inside Grid it is not consistent. It might have to do with the absolute positioning but I'm not sure. Have anyone had this problem with Grid?
Mathias Nilsson
@edgesoft
It might have to do with React as well but not sure on how to address this.
@bvaughn Haven't seen any issues on it either
Mathias Nilsson
@edgesoft
Also, hover state seems to be gone when scrolling.
Mathias Nilsson
@edgesoft
@bvaughn Switching to position: fixed did some work but still mouse leave does not work correctly
Mathias Nilsson
@edgesoft
fixed didn't work in safari.....
Mathias Nilsson
@edgesoft
@bvaughn Sorry to bother you. It was an invisible svg that made mouse leave inconsistent.
John Mitchell
@jlmitch5

I'm looking at react-virtualized's InfiniteLoader and have a few questions to see if it might be a good fit for a pane that displays standard out (both cached and streaming in over websockets). A single job's standard out can be tons of GBs.

  1. Would it be possible to pause loading of new entries in the virtualized component until the user stops scrolling in the pane? In the example on the gh pages site, all entries are loaded from the point at which scrolling starts.
  2. The example shows a flush data cache button. Would it be possible to instead keep some sort of arbitrary window-size of cache (i.e. "3x the size of the virtualized pane" or something)?
  3. Would it be possible to use some sort of anchor scroll tool to manipulate scroll behavior inside the virtualized pane or would that wreak havoc? I'm thinking for things like "follow new lines of standard out as they stream in over the socket", "keep the pane from jumping around when the user filters the view". Also if anyone has any recommendations for a good tool that does this, I'd be interested in checking it out! Current iteration of this is an angular 1.x app and uses angular's $anchorScroll service

Thanks!

Jordan
@jpollard-cs
@jlmitch5 for #3 I believe there's a way to scroll to index in List/Grid so you could simply scroll to the last index each time a new row loads
Not sure about #1 or #2.. I think I might recall something about being able to override the cache and roll your own implementation but not 100% sure on that
Actually re #1 there may be a way to tell when you're scrolling and use that to decide to load more rows or not (you'll want to probably have a renderer for rows that haven't loaded in this case or your scrollbar will be disproportionate to the size of the data) but would be helpful if we knew what you were using with infinite scroller
Or infinite loader or whatever
Jordan
@jpollard-cs
List? Table? Grid? Etc..
John Mitchell
@jlmitch5

Thanks for the response Jordan!

I was initially thinking about it as a list of standard out lines...I guess it could also be a grid with three columns (line number, actual text and ocasionally start time)

John Mitchell
@jlmitch5
and that's a good point on the unloaded row rendering. Was planning on doing that as I will know the number of lines at any point in time. Won't be perfect as some lines could be super long (and thus would wrap in the pane causing the hight for that "row" to be larger), but I don't think it'd be a huge deal
John Mitchell
@jlmitch5
Also, just to clarify I haven't actually written any code yet, just looked at the examples and documentation and had some further questions in regards to if the lib fits the usecase.
Brian Vaughn
@bvaughn

Also, hover state seems to be gone when scrolling.

That's because we disable pointer-events when scrolling for perf. Every major windowing lib for the web does the same.

Jared Gholston
@jarbot
Hello all. I'm hoping for some help with InifiniteLoader and nested List. When my collection of List items changes say 100 results to 1 (because of a search filter) the 1 result displays the old data from the original list of 100. I've tried using this https://github.com/bvaughn/react-virtualized/#pure-components and forceUpdateGrid on the list. But the data remains stale. Any thoughts on what I'm doing wrong here?
Jordan
@jpollard-cs
hey Jared that should work AFAIK - could you please provide a code sample
Jordan
@jpollard-cs
hard to tell what the issue is without looking at the code
Jared Gholston
@jarbot
@jpollard-cs here is the class in question https://gist.github.com/jarbot/f2cff2e952444db6bdde30f78e6b1222 the use case is when the user searches and the collection updates
Jordan
@jpollard-cs
@jarbot I usually use methods to set my refs... just double checking because I'm not sure - are you sure this.list is set when you call this.list.forceUpdateGrid?
Jared Gholston
@jarbot
good question i will check. thanks for looking :)
Jordan
@jpollard-cs
yeah also note from the React docs "Although string refs are not deprecated, they are considered legacy, and will likely be deprecated at some point in the future. Callback refs are preferred."
but it does indeed look like your ref is going to be accessible via this.List and not this.list with your current setup
Jared Gholston
@jarbot
@jpollard-cs sorry i've removed ref="List" and this.list is valid
Jordan
@jpollard-cs
but would think you would see an error in the console ;)
oh so the reference was good? or it is now?
Jared Gholston
@jarbot
yeah. sorry caught that as I was posting the sample. the ref is good, but results are the same. it doesn't seem to re-render the rows
it trims the list of rows from 112 down to whatever the search results are... so it renders the correct number of rows, but the row data is wrong
i've validated that the collection is correct at time of render
Jordan
@jpollard-cs
ok let me take a look at the rest
Jared Gholston
@jarbot
weird. _rowRenderer gets called with the correct data. but visually does not update
Jared Gholston
@jarbot
@jpollard-cs I think i figured it out
I had to use my own unique key in the row renderer
the key returned from List is in the format 1-0 and that doesn't change when the list size reduces to say 1 item. the key remains 1-0
so something is keeping it from rendering
Jordan
@jpollard-cs
Did providing a unique key fix the issue?
Jared Gholston
@jarbot
thanks for your help :)
yes!
Jordan
@jpollard-cs
The second value will always be 0 because List is built on Grid
So 0 is the column index I believe
I didn't do much but you're welcome :D
Timothy J Laurent
@timothyjlaurent
Anyone know if there is a good way to get any debug information from plunkr ? I tried porting in my table I reported here some weeks ago and could figure out why it wasn't working. Maybe I should just use create-react-app ??
must be a babel issue but couldn't find any debug errors
Jordan
@jpollard-cs
Someone posted a jsbin a few weeks ago: http://jsbin.com/hukofudule/1/edit?html,js,output
Maybe try plugging your code into that?
Timothy J Laurent
@timothyjlaurent
Thanks for the idea @jpollard-cs -- It looks like the console output for JSbin raises the errors better. I'll give that a shot.