feat: add ctrl + arrow key to jump to first/last cell; fix left/right key navigation with hidden columns #1827

404-html · 2021-10-04T11:53:36Z

New Pull Request Checklist

I am not disclosing a vulnerability.
I am creating this PR in reference to an issue.

Issue Description

This merge request is about following:

Fix for cell selection going to different dimension when navigating horizontally and having some columns hidden;

Adding support for ctrl+left/right keys. With such combination navigation jumps to first/last visible column;

TODOs before merging

Add tests
Add changes to documentation (guides, repository pages, in-code descriptions)
A changelog entry is created automatically using the pull request title (do not manually add a changelog entry)

…keys with modifier (ctrl/meta) key pressed

…e left/right edges

parse-github-assistant · 2021-10-04T11:53:44Z

Thanks for opening this pull request!

❌ Please edit your post and use the provided template when creating a new pull request. This helps everyone to understand your post better and asks for essential information to quicker review the pull request.

mtrezza · 2021-10-04T12:01:10Z

I reworded the PR title slightly so that others reading the changelog have a better idea of the fix

mtrezza · 2021-10-04T12:48:22Z

Please feel free to request a review when this is ready.

404-html · 2021-10-04T13:52:45Z

Hey @mtrezza, thank you for your changes. I believe it's ready to be reviewed, please proceed.

src/dashboard/Data/Browser/DataBrowser.react.js

mtrezza · 2021-10-04T14:38:50Z

Feature tested and works great!

Do you think you could also add the ctrl + arrow feature for jumping to the first / last row in the current column? I found this always to be tedious, currently you have to scroll all the way to the top.

…ys with modifier (ctrl/meta) key pressed

…m/404-html/parse-dashboard into key-navigation-hidden-columns-fix

404-html · 2021-10-05T10:46:03Z

Thanks for testing @mtrezza. I've added support for ctrl+up/down but I'm afraid it still needs some work.
While it works fine with small data sets it's not fully reliable when lazy-loading comes into place - auto scroll is not working. The reason behind this is that with large data sets not all rows are rendered (probably for performance reasons) and code responsible for scrolling to the current row is in BrowserCell component (componentDidUpdate lifecycle method).
So when, let's say, we are trying to jump from first to last (not rendered) row scrolling logic will not execute.
Changing this performance optimization to render all rows just for this feature is not reasonable.

Another thing I tried is to watch for current row change in BrowserTable -> componentWillReceiveProps and when it's first or last - scroll up or down to the bottom. Best way here would be to implement some smart logic which will perform scroll only when needed. Anyway this change was not working reliably and it was quite slow, feels like all rows between were rendered which is not efficient.

My preference would be to abstract all scrolling logic into single class as having it now split between BrowserTable and BrowserCell (I'm not sure about other places) makes it a bit hard to not overlap.

I should have some time to work on that next week, or we can merge that as it is and raise new issue for ctrl+up/down + lazy loading optimization. Do you have any preference?

mtrezza · 2021-10-05T11:57:20Z

Thanks for the thorough analysis!

I should have some time to work on that next week, or we can merge that as it is and raise new issue for ctrl+up/down + lazy loading optimization. Do you have any preference?

I think this already provides great value as it currently is. The scrolling refinement maybe can be fixed as a patch in a separate PR, so we can already make some developers happy with the added left/right jumping feature. And maybe we get more feedback in the meantime. Normally this would go into an alpha release, but we are still setting up the release process, so I would just stable-release it for now. Would that be fine with you?

404-html · 2021-10-05T12:15:20Z

Yes, thats fine with me. Thank you for asking 🤝

mtrezza

Looks good! Thanks for this improvement to speed up the workflow in Parse Dashboard!

# [3.2.0](3.1.2...3.2.0) (2021-10-05) ### Features * add ctrl + arrow key to jump to first/last cell; fix left/right key navigation with hidden columns ([#1827](#1827)) ([b504c0f](b504c0f))

parseplatformorg · 2021-10-05T12:46:38Z

🎉 This pull request has been released in version 3.2.0

* source: (53 commits) chore(release): 3.2.1 [skip ci] chore(release): 3.2.1-beta.1 [skip ci] ci: fix prerelease labels chore(release): 3.2.1-alpha.1 [skip ci] fix: enabling context menu for read-only cells (parse-community#1844) docs: add info about --dev parameter (parse-community#1842) build: merge beta (parse-community#1841) build: merge alpha (parse-community#1840) docs: fix release changelog filename docs: reword changelog quote docs: fix changelog branch names (parse-community#1837) refactor: simplify reading dashboard config from a json file (parse-community#1828) ci: update release branch names chore(release): 3.2.0 [skip ci] feat: add ctrl + arrow key to jump to first/last cell; fix left/right key navigation with hidden columns (parse-community#1827) refactor: upgrade inquirer from 8.1.2 to 8.1.3 (parse-community#1829) refactor: upgrade otpauth from 7.0.5 to 7.0.6 (parse-community#1830) refactor: replace create-react-class with ES6 classes (parse-community#1818) refactor: replace query-string with URLSearchParams (parse-community#1819) docs: fix typo in refactor changelog entry ... # Conflicts: # package-lock.json

Artur Drozdz added 3 commits October 4, 2021 13:21

Data Browser: skipping invisible column when navigating using keyboard

4bc73d2

Data Browser - navigating to the beggining/end when using left/right …

8c931b2

…keys with modifier (ctrl/meta) key pressed

Data Browser: taking hidden columns into account when establishing th…

a1c6ce4

…e left/right edges

404-html changed the title ~~Left/Right key navigation - hidden columns fix + ctrl key support~~ fix: Left/Right key navigation - hidden columns fix + ctrl key support Oct 4, 2021

mtrezza changed the title ~~fix: Left/Right key navigation - hidden columns fix + ctrl key support~~ fix: left/right key navigation with hidden columns, add ctrl + arrow key to jump to first/last cell Oct 4, 2021

Artur Drozdz and others added 2 commits October 4, 2021 14:02

Data Browser: safety check to prevent from infinite loop

804187a

Merge branch 'master' into key-navigation-hidden-columns-fix

ba7f7f8

Merge branch 'master' into key-navigation-hidden-columns-fix

474b842

mtrezza reviewed Oct 4, 2021

View reviewed changes

src/dashboard/Data/Browser/DataBrowser.react.js Outdated Show resolved Hide resolved

mtrezza reviewed Oct 4, 2021

View reviewed changes

src/dashboard/Data/Browser/DataBrowser.react.js Outdated Show resolved Hide resolved

mtrezza changed the title ~~fix: left/right key navigation with hidden columns, add ctrl + arrow key to jump to first/last cell~~ feat: add ctrl + arrow key to jump to first/last cell; fix left/right key navigation with hidden columns Oct 4, 2021

mtrezza and others added 4 commits October 5, 2021 01:10

Merge branch 'master' into key-navigation-hidden-columns-fix

9dd8f5e

Data Browser: updating comments

1648a53

Data Browser - navigating to the first/last row when using up/down ke…

1826ebb

…ys with modifier (ctrl/meta) key pressed

Merge branch 'key-navigation-hidden-columns-fix' of https://github.co…

f77e487

…m/404-html/parse-dashboard into key-navigation-hidden-columns-fix

Merge branch 'master' into key-navigation-hidden-columns-fix

a5e6332

mtrezza approved these changes Oct 5, 2021

View reviewed changes

mtrezza merged commit b504c0f into parse-community:master Oct 5, 2021

parseplatformorg added the state:released Released as stable version label Oct 5, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: add ctrl + arrow key to jump to first/last cell; fix left/right key navigation with hidden columns #1827

feat: add ctrl + arrow key to jump to first/last cell; fix left/right key navigation with hidden columns #1827

404-html commented Oct 4, 2021 •

edited

Loading

parse-github-assistant bot commented Oct 4, 2021 •

edited

Loading

mtrezza commented Oct 4, 2021

mtrezza commented Oct 4, 2021

404-html commented Oct 4, 2021

mtrezza commented Oct 4, 2021 •

edited

Loading

404-html commented Oct 5, 2021 •

edited

Loading

mtrezza commented Oct 5, 2021 •

edited

Loading

404-html commented Oct 5, 2021

mtrezza left a comment •

edited

Loading

parseplatformorg commented Oct 5, 2021

feat: add ctrl + arrow key to jump to first/last cell; fix left/right key navigation with hidden columns #1827

feat: add ctrl + arrow key to jump to first/last cell; fix left/right key navigation with hidden columns #1827

Conversation

404-html commented Oct 4, 2021 • edited Loading

New Pull Request Checklist

Issue Description

TODOs before merging

parse-github-assistant bot commented Oct 4, 2021 • edited Loading

Thanks for opening this pull request!

mtrezza commented Oct 4, 2021

mtrezza commented Oct 4, 2021

404-html commented Oct 4, 2021

mtrezza commented Oct 4, 2021 • edited Loading

404-html commented Oct 5, 2021 • edited Loading

mtrezza commented Oct 5, 2021 • edited Loading

404-html commented Oct 5, 2021

mtrezza left a comment • edited Loading

Choose a reason for hiding this comment

parseplatformorg commented Oct 5, 2021

404-html commented Oct 4, 2021 •

edited

Loading

parse-github-assistant bot commented Oct 4, 2021 •

edited

Loading

mtrezza commented Oct 4, 2021 •

edited

Loading

404-html commented Oct 5, 2021 •

edited

Loading

mtrezza commented Oct 5, 2021 •

edited

Loading

mtrezza left a comment •

edited

Loading