SelectControl hackery: Fixing freeform select and allowing group by and non group-by column selectors to take in arbitrary expressions including select-all semantics. (#6722)

Summary: We want to allow grouping by on expressions, including the
ability to select expressions (without group-by). The UI ain't good yet
.. it is not at the feature parity of say adhoc filters/metrics that
come with a nice text-box to edit the SQL. But
this suffices for my usecase for now.

(The UI would have to be redone ... but that would require some refactoring
to merge the AdhocFilter/Metric/Popover stuff such that it can be used
for this use case too.)

Also fixed a bug in the SelectControl freeForm selection.

Allow selecting all columns easily: Added a new Select-All special item
that users can select to make all the options in the selectable show
up.

The ability to group by arbitrary expressions is useful because now two
users don't need to create custom computed-fields for this.

superset/assets/spec/javascripts/explore/components/SelectControl_spec.jsx

@@ -30,6 +30,7 @@ const defaultProps = {
   choices: [['1 year ago', '1 year ago'], ['today', 'today']],
   name: 'row_limit',
   label: 'Row Limit',
+  valueKey: 'value', // shallow isn't passing SelectControl.defaultProps.valueKey through
   onChange: sinon.spy(),
 };
 
@@ -43,6 +44,7 @@ describe('SelectControl', () => {
 
   beforeEach(() => {
     wrapper = shallow(<SelectControl {...defaultProps} />);
+    wrapper.setProps(defaultProps);
   });
 
   it('renders an OnPasteSelect', () => {
@@ -55,6 +57,23 @@ describe('SelectControl', () => {
     expect(defaultProps.onChange.calledWith(50)).toBe(true);
   });
 
+  it('returns all options on select all', () => {
+    const expectedValues = ['one', 'two'];
+    const selectAllProps = {
+      multi: true,
+      allowAll: true,
+      choices: expectedValues,
+      name: 'row_limit',
+      label: 'Row Limit',
+      valueKey: 'value',
+      onChange: sinon.spy(),
+    };
+    wrapper.setProps(selectAllProps);
+    const select = wrapper.find(OnPasteSelect);
+    select.simulate('change', [{ meta: true, value: 'Select All' }]);
+    expect(selectAllProps.onChange.calledWith(expectedValues)).toBe(true);
+  });
+
   it('passes VirtualizedSelect as selectWrap', () => {
     const select = wrapper.find(OnPasteSelect);
     expect(select.props().selectWrap).toBe(VirtualizedSelect);
@@ -82,19 +101,39 @@ describe('SelectControl', () => {
 
   describe('getOptions', () => {
     it('returns the correct options', () => {
+      wrapper.setProps(defaultProps);
       expect(wrapper.instance().getOptions(defaultProps)).toEqual(options);
     });
 
+    it('shows Select-All when enabled', () => {
+      const selectAllProps = {
+        choices: ['one', 'two'],
+        name: 'name',
+        freeForm: true,
+        allowAll: true,
+        multi: true,
+        valueKey: 'value',
+      };
+      wrapper.setProps(selectAllProps);
+      expect(wrapper.instance().getOptions(selectAllProps))
+        .toContainEqual({ label: 'Select All', meta: true, value: 'Select All' });
+    });
+
     it('returns the correct options when freeform is set to true', () => {
-      const freeFormProps = Object.assign(defaultProps, {
+      const freeFormProps = {
         choices: [],
         freeForm: true,
         value: ['one', 'two'],
-      });
+        name: 'row_limit',
+        label: 'Row Limit',
+        valueKey: 'value',
+        onChange: sinon.spy(),
+      };
       const newOptions = [
         { value: 'one', label: 'one' },
         { value: 'two', label: 'two' },
       ];
+      wrapper.setProps(freeFormProps);
       expect(wrapper.instance().getOptions(freeFormProps)).toEqual(newOptions);
     });
   });