Esri/crowdsource-manager

Add a Select All and Clear Selection button

chris-fox opened this issue · 24 comments

To automate editing workflows It would be helpful to have select all and clear selection buttons in the Manager App. To me the buttons would logically make sense next to the selection count to the left of the Export to CSV button.

The Select All button should select all the rows, honoring any filters that are applied.
The Clear Selection button would clear any selected rows.

image

@jlindemann, @ScottOppmann

@CTLocalGovTeam Could you please evaluate this as well and let us know if you will have the capacity to implement this in 8.2 release

@aparveen @chris-fox @skrishn

As per our discussion here are the different options for allowing user to select/de-select all the rows.

Option 1 :

  • Add "Select All"checkbox to the left of "Export CSV" button.
  • The checkbox when checked will select all the rows and will clear the selection when unchecked.
    option-3

Option 2 :

  • Add a new icon as shown in the screenshot. It will work as a toggle button.
  • The icon once clicked will select all the rows and will clear the selection when clicked again.
  • To allow user understand the state of the icon, we can change the color and tool tip once the icon is toggled.
    option-2

Option 3 :

  • Add new menus in the settings icon saying "Select All" and "Clear Selection".
    option-1

Please let us know your thoughts on the above options.

@ashishchoure, I like option 2, but not sure how we make that work well with one button. A toggle seems challenging if you also support interactive selection and I would think the clear button would be enabled if there was any selection, whether it was done with the select all button or if it was done by clicking in the table.

So to me it seems like it still needs to be 2 buttons. Select All is always enabled, Clear is enabled when a selection is present.

@chris-fox If we click on the refresh button (to the left of sign in button) , it clears all the selection and edits. In that case do you think we still need another clear selection button? Moreover, I feel having "show selected" under gear icon and select all toggle in different location could confuse the user. Show Selected option would go unnoticed as the gear icon is less intutive. My recommendation is to move both select option under one icon. What do you think?

@skrishn, the refresh icon to clear selection isn't intuitive to me. I agree the show selected under the gear would go unnoticed, i don't like hiding the options under the menu because it adds another click to get to them and makes them harder to discover. I would agree that it makes sense all the selection options belong together, so why not add them all as button next to export. Seems like we have the space, why hide them in a menu?

@chris-fox I agree with you. I like the button option. Just to clarify, Show Selected, Show All and Clear Selection as seperate buttons next to export? In that case are we getting rid of Gear Icon and refresh button? Will the clear button clear only the selection or even the edits made to the records?

Yes, in regards to 3 buttons next to export. Think we can get rid of the gear, but don't know if any other options show under the gear sometimes.

We shouldn't get rid of the refresh, it actually re-queries the layer and loads all records, so it does serve a unique purpose.

I would say if you have pending edits that you haven't saved that clear would discard the edits.

@aparveen @chris-fox @skrishn

Based on the discussion we have come up with the following approach.

  1. Two buttons "Select All" and "Clear All"
  2. "Clear All" button will be disabled until a feature(s) is selected
  3. Clicking on the active "Clear All" button will clear selected features and the button will be disabled

CSM

Issues with the gear icon :

  • The layer name header is tightly bounded with the layer name at center, selection information and other buttons. Introducing multiple buttons at this level may rise to UI issues and less space for the layer title
  • Removing the icon from the header may cause some changes in the 508 related accessibility
  • This might also confuse the existing user who are used to see gear icon and the underneath options
  • Considering all this cases, we think we should keep the gear icon as is (Let us know you opinion)

Note:
As the “Refresh” button does lot of things other than clearing the selection in the table, we propose no changes in "Refresh" button functionality.

Please let us know your thoughts on this approach, if required we can discuss this further

@chris-fox @skrishn

  • The layer name header is tightly bounded with the layer name at center, selection information and other buttons. Introducing multiple buttons at this level may rise to UI issues and less space for the layer title

We need to add two more buttons, Show All and Show Selected if we want to get rid of the gear icon to keep the current functionality. In this case, we can add just one button that can toggle between Show All and Show Selected, Chris, I know you didn't want to use toggle between select all and clear selection before, do you still see the same challenge for Show All/ Show Selected?

  • Removing the icon from the header may cause some changes in the 508 related accessibility

We need to support accessibility for any new development anyway, so I don't think it is a big issue unless it requires high level of effort.

  • This might also confuse the existing user who are used to see gear icon and the underneath options

I am not very worried about this.

To my opinion, we should get rid of the gear button, it will be confusing and less intuitive as you both pointed out before. Please let me know your thoughts.

@aparveen, No, i think it is fine to have a toggle button between show all and show selected, that seems intuitive to me. I agree with all of your other comments as well.

@ashishchoure

  1. Please add only one button to toggle between Show Selected and Show All.
  2. Please ensure that the new changes follow the 508 compliance.
  3. We would like to use standardized icons for these buttons. please reach out if you need any help with the icons.
    Thanks so much.

@aparveen

As per the above discussion, here are the final points related to new changes and functionalities:

  1. Settings icon removed and introduced 3 buttons i.e. "Select All", "Clear All" and "Show All"
  2. When no feature is selected: Clear All and Show all button will be disabled
  3. Show all button is a toggle button (screenshot attached)

Please let us know your views about the mockup and the icons

Show All Show Selected
image image

@ashutoshverma-ct Could you please use these icons instead? Also you will be adding tool tips to these buttons right?
CS Manager Icons.zip
image

@aparveen

Could you please use these icons instead?

Yes will use these icons and update with the mockups

Also you will be adding tooltips to these buttons right?

Yes, tooltips will be added

@ashutoshverma-ct @ashishchoure here is the icon for Show All/Show Selected toggle button to show Show All state. so we would like to use two icons to show the state of the button
show-all-32.zip
image

@ashishchoure seeing an issue with Show Selected button, seems like the functionality got flipped. After the app loaded first time, Show All/ Show Selected button is disabled, because no selection was made, then

  1. If I select any record, this button becomes enabled but showing Show Selected icon in the toolbar (screenshot 1) but in the table view, it is showing all records both selected and non selected records,

image

  1. Now if I click on the button to show all record, correct icon is showing but in the table it only shows selected records, in this case it should show all records.

image

Could you please take a look at this?

@aparveen

This is a toggle button,

  • When you select any features then the button will be enabled. However, you are seeing all the records in the table (Selected/Non-Selected) it means you are already on "Select All" screen and hence the table header will show "Show Selected" button.
  • Basically the button is giving a visual clue that clicking on the button will navigate you to "Show Selected" screen from "Select All" screen.

Here is the previous implementation :

  • When all records are shown in the table, the menu will show "Show Selected"
  • When only selected rows are displayed the table, the menu will show "Show All"

image

And here is the current implementation :
image

Let me know if this makes sense. If required we can discuss this further.

@ashishchoure Our team is good with the workflow, but we are seeing an issue with Selected View.
where after clearing selection in the Show Selected View panel, the table becomes empty. In this scenario after clearing the 'Show Selected' records , we would like to show all the records like previous workflow and also change the state of toggle button to reflect this.

@aparveen

We have implemented the above workflow and we will do a code drop at the earliest.

verified in dev

verified in qa

Added testcase

@chris-fox
I have few suggestions on this enhancement. Let me know what you think about this

  1. Currently, when Select All is clicked ‘Show Selected/Show All’ is enabled and upon clicking it scrolls to the bottom of the table (noticed when feature list is big). It stays enabled even after clearing the selection. I don’t see a use case to have it enabled when ‘Select All’ is clicked. For clarity, I suggest Show Selected/Show All to be enabled only when feature(s) are selected in the table/map and disabled when ‘Show All’ is clicked.

  2. When Search button is clicked the textbox appears on top of selection tools and users have click search button again or clear search to access selection tools. Can we consider the following options, so users can access the selection tools easily and would benefit if they repeat the action with different search text

a. Replacing search button with search textbox (enabled when webmap has search configured). This reduces the number of clicks
b. Upon clicking search button, search box is displayed on the title bar to the left or right of the search button. I guess this approach shouldn’t affect the app with long title as we show ellipsis if its long?!
c. Moving selection tools to the left.

image

Sample app: https://crowdsource.mapsqa.arcgis.com/apps/CrowdsourceManager/index.html?appid=b4274821ed93463a886041d0e9c906de

cc @aparveen

@skrishn, I don't have a strong opinion on issue #1, I don't think it is that bad of an experience currently, so for simplicity I would keep as is.

For issue #2, I like option a.