Best practice for managing feature selection between Features widget and Editor widget in same application?

[ClangDevGuy]

Hi all,

 I'm building an enterprise application using the ArcGIS Maps SDK for JavaScript (v4.x) that requires both the Features widget (for displaying feature information) and the Editor widget for editing capabilities.

 The Problem: Both widgets have their own selection/interaction behavior, and I'm finding conflicts when trying to use them together. When a user clicks on a feature:

• The Features widget wants to display the popup/info panel
• The Editor widget also responds to selection for editing

This creates a confusing UX where it's unclear which widget "owns" the selection, and switching between viewing and editing modes isn't intuitive.

 What I'm looking for: I'd like to implement a global/unified selection mechanism that:

1. Allows a single feature selection to be shared across both widgets
2. Provides clear mode switching (view vs. edit)
3. Maintains a consistent selection state across the application

I know there is a the Select widget in ExB, but has anyone implemented something similar for JavaScript applications?

Thanks! 

[JeffreyThompson2]

https://community.esri.com/t5/arcgis-javascript-maps-sdk-ideas/optional-off-switch-for-edit-widget/i...

I've built an editing on/off switch before. When editing is turned off, it loops through the editable feature layers and sets their editingEnabled property to false. It does the opposite when editing is turned on.

A related idea would be to create a toggle switch to change what the select function does. All of the reactiveUtils functions return a watchHandle that can be deleted with the .remove() method. So, you can wrap your create editing/identifying events into a function, like this:

const makeEditing = () => {
   const handle = reactiveUtils.on(() => viewElement,
  "arcgisViewClick",
  (event) => {
    doStuff(event)
   }
  return handle
}

Then have your switch delete the old handle and make a new one like this:

if (editingOn) {
   currentHandle.remove()
   currentHandle = makeEditing()
} else {
   currentHandle.remove()
   currentHandle = makeIdentifying()
}