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.

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

Front-end bug fixes, GraphView tweaks #79

Merged
merged 8 commits into from
May 2, 2020
Merged

Front-end bug fixes, GraphView tweaks #79

merged 8 commits into from
May 2, 2020

Conversation

reelmatt
Copy link
Member

@reelmatt reelmatt commented May 1, 2020

Fixes #59: Updates the Load button in the Modal.Footer to be disabled if the Node has not been executed (i.e. != 'complete') and therefore no data available. The same status message appears whether there is data or not. For cases where there is a large file to load, a react-spinners-css Component now appears instead of the "Loading data..." message.

Fixes #60: Increased the max-width attribute for .modal-dialog which also affects the non-GraphView windows. This is great for the case where there is a large data file to display, but not great for smaller files/other Modal windows. I couldn't easily target a child of the .modal-dialog so I committed as-is.

Part of this fix also includes a clean-up of the computeWidths function to make the row/column names clearer. It also calculates the maxWidth of the Grid which allows to dynamically adjust the size for smaller data files. The default size has been bumped from 480x150 to 600x1000.

The grid style has also been tweaked slightly to shade every other row (and not alternate by columns) and adds a slight border on the edges.

Fixes #74: Adjusts the API call so that the NetworkX representation on the back will always store an edge from outPort -> inPort regardless of whether the user creates the edge in reverse.

@reddigari
Copy link
Collaborator

reddigari commented May 1, 2020

Great fixes!

I would recommend targeting the modal classes specifically using the dialogClassName prop on the Modal component (see here). I think I used it to specifically style the node config form in #78, so it's probably better to not style all modals the same.

Tiny thing --- in my browser the data table extends over the modal width:
Screen Shot 2020-05-01 at 4 50 07 PM

@reelmatt
Copy link
Member Author

reelmatt commented May 1, 2020

Thanks for the recommendation of dialogClassName.

Re: sizing, I tweaked the styles for the Grid so it shouldn't extend past the modal window anymore. It should also be centered, but that seems to be true only for larger data sets (small data is still left-aligned with a bunch of white-space).

@reelmatt reelmatt merged commit 9867670 into master May 2, 2020
@reelmatt reelmatt deleted the dev/mthomas branch May 2, 2020 19:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
3 participants