Refactor deprecated antd Dropdown menus #6898

hotzenklotz · 2023-03-03T15:33:26Z

Antd 4.2x introduced deprecation warnings for <Menu>components within <Dropdown> elements. This PR replaces the React <Menu> components with heir object equivalents.

Most changes/files are rather straight forward conversions. Only the annotations context menu is more involved since is is created from a million different function, components, etc. Hopefully the strict typing of all menu items prevents any new bugs.

I tested all menus and clicked on all items but I might have missed some by mistake...

URL of deployed dev instance (used for testing):

https://___.webknossos.xyz

Steps to test:

Test that all the menu still show (or at least the most important menus)
Consider performance. I tested with an annotation with 1700+ trees and the Trees tab remained smooth. Here is the NML file
detection_no_size_threshold.nml.zip
Randomly sample some menu entries for testing

Issues:

Contributes to Upgrade antd to v5 #6861
fixes Inconsistent call order of hooks in context menu #6814

(Please delete unneeded items, merge only when none are left open)

Updated changelog
Updated migration guide if applicable
Updated documentation if applicable
Adapted wk-connect if datastore API changes
Adapted wk-libs python client if relevant API parts change
Removed dev-only changes like prints and application.conf edits
Considered common edge cases
Needs datastore update after deployment

…bar-menu * 'master' of github.com:scalableminds/webknossos: Fix exploring datasets via http (without s) (#6863)

…bar-menu * 'master' of github.com:scalableminds/webknossos: Fix style of connectome tab by restricting directory tree style (#6864) Remove legacy datasets tab and use new compact route (#6834) Fix basicauth for exploring remote http datasets (#6866)

…bar-menu * 'master' of github.com:scalableminds/webknossos: Add functions to get and set segment colors to the frontend API (#6853) Ensure that segments are added to segment list when using quick select... (#6867)

…d-v4.24 * 'master' of github.com:scalableminds/webknossos: Update deprecated antd <Menu> (#6860)

…d-v4.24 * 'master' of github.com:scalableminds/webknossos: Implement http range requests for HttpsSeekableByteChannel (#6869) new GH action for adding issues to project board Fix links in Changelog (#6881) adds dedicated explore method for zarr datasets with a datasource-properties.json (#6879) Release 23.03.0 (#6880) Fix superUser being wrongly marked as organization owners (#6876) Followups for OME-TIFF export (#6874) Fix reload-precomputed-mesh functionality (#6875) Adds OME-TIFF export (#6838) Add evolutions 99,100 to migration guide (#6871) Add link to imprint and privacy to help menu (#6870) Annotation Locking Mechanism (#6819)

…pdown-menu * 'master' of github.com:scalableminds/webknossos: Upgrade Antd to v4.24 (#6865) Support n5 end-chunks with chunksize differing from metadata chunksize (#6890)

hotzenklotz · 2023-03-03T16:58:48Z

frontend/javascripts/dashboard/folders/folder_tree.tsx

@@ -186,7 +186,7 @@ export function FolderTreeSidebar({
        />
      </div>
      <Dropdown
-        overlay={createMenu}
+        menu={createMenu()}
        placement="bottom"
        // The overlay is generated lazily. By default, this would make the overlay


Mh, the menu prop no longer supports passing a function. Since the menu is not really a React component, it might not constantly re-rendered. Not sure how we want to handle this. (This issues is present in a few of our Dropdowns.)
Also the autoDestroy prop is also not mentioned in the docs anymore. There is a reference to destroyPopupOnHide though, which sounds similar: https://4x.ant.design/components/dropdown/#API

…pdown-menu * 'master' of github.com:scalableminds/webknossos: Avoid SQL error when fetching view config for zero-layer dataset (#6912) Fix date formatting for VX reports (#6908) Fix rare crash when viewing shared annotation (#6892) Slim down view mode dropdown by using icons (#6900) Logging on password reset/change (#6901) When merging volume tracings, also merge segment lists (#6882) avoid spinner when switching tabs in dashboard (#6894)

frontend/javascripts/oxalis/view/context_menu.tsx

philippotto

awesome! didn't test yet, but have already left some small comments.

CHANGELOG.unreleased.md

frontend/javascripts/oxalis/view/action-bar/tracing_actions_view.tsx

frontend/javascripts/oxalis/view/right-border-tabs/tree_hierarchy_view.tsx

frontend/javascripts/oxalis/view/context_menu.tsx

philippotto · 2023-03-15T15:51:54Z

First round of testing:

right clicking a dataset in the dashboard and hitting escape (or clicking somewhere else) crashes the dashboard
right clicking a skeleton node shows a position icon which is different from the icon used in the position box. I think, using the same icon would be better
right clicking a position in a dataset, doesn't show a position icon for me (however, there's an icon in code, I think)

philippotto · 2023-03-16T10:51:14Z

One other problem:

the MenuItemWithMappingActivationConfirmation component doesn't seem to work anymore (it doesn't do anything regardless of the selected mapping).

Steps to reproduce:

visit https://dropdownmenu.webknossos.xyz/datasets/sample_organization/l4dense_motta_et_al_dev_v2/view#2878,4480,1792,0,1.3
select meshfile_v3 in the segments tab
rightclick a segment in the viewport and click "load mesh (precomputed)"
now, a modal should ask you to switch to the correct mapping (instead, nothing happens)
select agglomerate mapping 80 manually in the left sidebar
try "load mesh (precomputed)" again --> it should load a mesh but nothing happens

philippotto · 2023-03-16T13:09:05Z

I also just tested performance and everything seemed fine 👍 (for the record, I tested with 80k trees).

…pdown-menu * 'master' of github.com:scalableminds/webknossos: Fix download button for annotations when tiff export is disabled (#6931) Update PULL_REQUEST_TEMPLATE.md Prepare multi modality support (#6748) Improvements for terms-of-services modal (#6930) Fix creating task types with preferred mode (#6928) Fix styling for login pages for dark mode users (#6916) Added members to admin team page (#6915) Release 23.03.1 (#6917) Redesign Welcome UI (#6904) Fix race condition which could disable saving (#6914)

…pdown-menu * 'master' of github.com:scalableminds/webknossos: Update screenshots (#6934) Support rendering negative floats (#6895) Fix loading of webworkers in dev mode (#6933) Restore cache buster for webworkers (#6932) Introduce data vault as storage backend abstraction (#6899)

hotzenklotz · 2023-03-22T10:22:33Z

@philippotto I think I fixed the issues that you detected and applied your PR feedback. Please have a look at my last few commits.

I likely also fixed issue #6814 in the process.

philippotto

Splendid clean up! See only my one comment about commented code before merging.

frontend/javascripts/oxalis/view/context_menu.tsx

…pdown-menu * 'master' of github.com:scalableminds/webknossos: Add email notifications for processing jobs (#6918) Send Cache-Control: no-cache for most routes (#6937)

…come-toast * 'master' of github.com:scalableminds/webknossos: Log all details on deleting annotation layer (#6950) fix typo Rename demo instance to wkorg instance (#6941) Add LOD mesh support for frontend (#6909) Fix layout of view mode switcher and move it (#6949) VaultPath no longer extends nio.Path (#6942) Release 23.04.0 (#6945) Use new zip.js version to allow zip64 uploads (#6939) Implement viewing sharded neuroglancer precomputed datasets (#6920) Reject dataset uploads if organization storage quota is exceeded (#6893) Refactor deprecated antd Dropdown menus (#6898)

…wings * 'master' of github.com:scalableminds/webknossos: updates docs for docker installation (#6963) Fix misc stuff when viewing tasks/annotations of another user (#6957) Remove segment from list and add undo/redo for segments (#6944) Log all details on deleting annotation layer (#6950) fix typo Rename demo instance to wkorg instance (#6941) Add LOD mesh support for frontend (#6909) Fix layout of view mode switcher and move it (#6949) VaultPath no longer extends nio.Path (#6942) Release 23.04.0 (#6945) Use new zip.js version to allow zip64 uploads (#6939) Implement viewing sharded neuroglancer precomputed datasets (#6920) Reject dataset uploads if organization storage quota is exceeded (#6893) Refactor deprecated antd Dropdown menus (#6898)

hotzenklotz added 25 commits February 20, 2023 10:19

fix navbar Menu deprecatation warning (WIP)

6072fcd

restored more navbar items (WIP)

d1c9353

more navbar fixes

eb629d8

refactor FolderTree menu

29dff48

remove data-group-id attributes

c987ebf

updated changelog

026c6de

makes changes compatible with antd v4.23.x

1f2d96c

Merge branch 'master' of github.com:scalableminds/webknossos into nav…

218c4d2

…bar-menu * 'master' of github.com:scalableminds/webknossos: Fix exploring datasets via http (without s) (#6863)

fix linter

3077818

applied PR feedback

1f8844e

more PR feedback

6b9a901

upgrade antd to v4.24.8

87a5382

updated changelog

434377d

Merge branch 'master' of github.com:scalableminds/webknossos into ant…

0bc7d59

…d-v4.24 * 'master' of github.com:scalableminds/webknossos: Update deprecated antd <Menu> (#6860)

apply PR feedback

8b776ec

upgrade antd to v 4.28.x

80af2d4

refactor all occurances of <Dropdown menu>

87d154b

changed more dropdown menus (WIP)

00285bc

more menu conversions (WIP)

ba1803e

more menu crazyiness (WIP)

8f40925

upgrade antd to v 4.28.x

21e539d

restored context menu (WIP)

d38ea55

hotzenklotz added the frontend label Mar 3, 2023

hotzenklotz added 2 commits March 3, 2023 17:22

restore layout menu

0c4ac9e

Merge branch 'master' of github.com:scalableminds/webknossos into dro…

bfe3fef

…pdown-menu * 'master' of github.com:scalableminds/webknossos: Upgrade Antd to v4.24 (#6865) Support n5 end-chunks with chunksize differing from metadata chunksize (#6890)

hotzenklotz commented Mar 3, 2023

View reviewed changes

updated changelog

964fbb4

restore context menu position styling

d95cc01

hotzenklotz self-assigned this Mar 13, 2023

hotzenklotz commented Mar 13, 2023

View reviewed changes

frontend/javascripts/oxalis/view/context_menu.tsx Show resolved Hide resolved

hotzenklotz commented Mar 13, 2023

View reviewed changes

frontend/javascripts/oxalis/view/context_menu.tsx Show resolved Hide resolved

hotzenklotz commented Mar 13, 2023

View reviewed changes

frontend/javascripts/oxalis/view/context_menu.tsx Outdated Show resolved Hide resolved

hotzenklotz requested a review from philippotto March 13, 2023 14:07

hotzenklotz marked this pull request as ready for review March 13, 2023 14:07

fix typechecking

2dc8aa1

philippotto reviewed Mar 15, 2023

View reviewed changes

hotzenklotz added 6 commits March 20, 2023 15:59

applied PR feedback

0e3827b

fix menu crash in dashboard

757f0f3

reactivated mapping warnings

e2e51ed

fix rules of hooks error in context menu

d289ba0

philippotto approved these changes Mar 22, 2023

View reviewed changes

frontend/javascripts/oxalis/view/context_menu.tsx Outdated Show resolved Hide resolved

hotzenklotz added 2 commits March 23, 2023 13:36

Merge branch 'master' of github.com:scalableminds/webknossos into dro…

e5686f2

…pdown-menu * 'master' of github.com:scalableminds/webknossos: Add email notifications for processing jobs (#6918) Send Cache-Control: no-cache for most routes (#6937)

applied PR feedback

5ea2eb9

hotzenklotz enabled auto-merge (squash) March 23, 2023 12:39

hotzenklotz merged commit 8c79390 into master Mar 23, 2023

hotzenklotz deleted the dropdown-menu branch March 23, 2023 13:36

hotzenklotz mentioned this pull request Jul 10, 2023

Upgrade antd to v5 #6861

Closed

12 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Refactor deprecated antd Dropdown menus #6898

Refactor deprecated antd Dropdown menus #6898

hotzenklotz commented Mar 3, 2023 •

edited

hotzenklotz Mar 3, 2023

philippotto left a comment

philippotto commented Mar 15, 2023 •

edited by hotzenklotz

philippotto commented Mar 16, 2023 •

edited by hotzenklotz

philippotto commented Mar 16, 2023

hotzenklotz commented Mar 22, 2023

philippotto left a comment

Refactor deprecated antd Dropdown menus #6898

Refactor deprecated antd Dropdown menus #6898

Conversation

hotzenklotz commented Mar 3, 2023 • edited

URL of deployed dev instance (used for testing):

Steps to test:

Issues:

hotzenklotz Mar 3, 2023

Choose a reason for hiding this comment

philippotto left a comment

Choose a reason for hiding this comment

philippotto commented Mar 15, 2023 • edited by hotzenklotz

philippotto commented Mar 16, 2023 • edited by hotzenklotz

philippotto commented Mar 16, 2023

hotzenklotz commented Mar 22, 2023

philippotto left a comment

Choose a reason for hiding this comment

hotzenklotz commented Mar 3, 2023 •

edited

philippotto commented Mar 15, 2023 •

edited by hotzenklotz

philippotto commented Mar 16, 2023 •

edited by hotzenklotz