feat: Sqllab to Explore UX improvements (#11755)

* create boiler modal component

* hello world modal

* setup modal flow

* setup savemodal for components

* flake8

* fix onclick reference

* working create datasource boiler

* saving spot for callback on text input

* working dataset with input box

* working redirect on completion

* get data for owners dropdown

* fix build with pull from master

* fix the filteroption

* 💯

* move state to upper component

* add overwrite state

* hacked overwrite process

* linting

* fix filter

* cleaning up the coe

* Delete preset.code-workspace

* remove unused code

* remove visualize

* update default value

* remove unneeded vars

* checkout package-lock.json

* linting

* get user id

* remove page filter

* setup proper call for updating columns in dataset

* add move to explore flow

* linting

* add param for overriding columns

* linting

* change title

* fix some tings

* cleanup

* linting

* add types in some places

* save toast

* use moment

* add error toast

* create enum for radio states

* initial state for saving query

* add tpying

* addressing concerns

* update propTypes

* add functionality for CTAS explor btn

* handle CTAS state

* fix onclick to reference upper level component

* formatting

* reset state after closing

* add error message when user doesn't pick an already selected dataset

* remove unneeded todo

* remove styling

* move async calls to api directory

* remove console.log

* add user id param

* typing

* littty

* move put to seperate file

* save

* dsf

* fix typing errors

* adding more types

* fix typing erros

* linting

* add basic spec test

* create dataset modal

* add components reference

* Rename SaveDatasetModal_spec.jsx to SaveDatasetModal_spec.tsx

* remove sinon for now

* fix typing errors on modal files

* fix linting

* address comments

* attempt to fix linting

* add props

* fix test

* fix the linting

* yerp

* fix this references

* spaces

* handleOverwriteCancel reference cleanup

* rename bool value for shouldOverwriteDataset

* fix typing for onChange

* you still the best in the world

* fix spec

* align branches

* push

* fix key names

* fix dataset reference

* lowercase

* fix save bug with tiem

* fixed styling

* fix date state after push to explore

* add disabling states

* plz refactor this

* this is working fully now

* do some renaming

* renaming

* remove console.logs

* still refactoring

* remove unneeded code

* remove unneeded variables

* still cleaning

* added interface

* fix typing issues

* cleanup unused code

* fix npm lnit

* fix initial problems

* add props to test

* remove unneeded files

* skip linting

* saving

* this works

* remove old test

* remove old test

* fix linting

* fix broken test

* remove jsx file

* refactoring

* cleanup

* remove comments

* reset user object

* fix functions

* fix this

* reverting CTAS btn flow

* remove onclick

* save frontend work

* allow for database id to be passed as param in body

* use enum

* fix linting

* style alignment

* get rid of .then

* add function to compute default value with tiem

* lit

* remove ts-error

* fix typing
This commit is contained in:
Hugh A. Miles II
2020-12-08 17:29:41 -08:00
committed by GitHub
parent 8164aeafb1
commit cc44a2c01b
7 changed files with 304 additions and 178 deletions

View File

@@ -24,7 +24,6 @@ import sinon from 'sinon';
import fetchMock from 'fetch-mock';
import shortid from 'shortid';
import sqlLabReducer from 'src/SqlLab/reducers/index';
import * as actions from 'src/SqlLab/actions/sqlLab';
import ExploreResultsButton from 'src/SqlLab/components/ExploreResultsButton';
import * as exploreUtils from 'src/explore/exploreUtils';
import Button from 'src/components/Button';
@@ -184,77 +183,5 @@ describe('ExploreResultsButton', () => {
wrapper.instance().buildVizOptions.restore();
fetchMock.reset();
});
it('should build request with correct args', () => {
return new Promise(done => {
wrapper.instance().visualize();
setTimeout(() => {
const calls = fetchMock.calls(visualizeEndpoint);
expect(calls).toHaveLength(1);
const formData = calls[0][1].body;
Object.keys(mockOptions).forEach(key => {
// eslint-disable-next-line no-unused-expressions
expect(formData.get(key)).toBeDefined();
});
done();
});
});
});
it('should export chart and add an info toast', () => {
return new Promise(done => {
const infoToastSpy = sinon.spy();
const datasourceSpy = sinon.stub();
datasourceSpy.callsFake(() => Promise.resolve(visualizationPayload));
wrapper.setProps({
actions: {
addInfoToast: infoToastSpy,
createDatasource: datasourceSpy,
},
});
wrapper.instance().visualize();
setTimeout(() => {
expect(datasourceSpy.callCount).toBe(1);
expect(exploreUtils.exploreChart.callCount).toBe(1);
expect(exploreUtils.exploreChart.getCall(0).args[0].datasource).toBe(
'107__table',
);
expect(infoToastSpy.callCount).toBe(1);
done();
});
});
});
it('should add error toast', () => {
return new Promise(done => {
const dangerToastSpy = sinon.stub(actions, 'addDangerToast');
const datasourceSpy = sinon.stub();
datasourceSpy.callsFake(() => Promise.reject({ error: 'error' }));
wrapper.setProps({
actions: {
createDatasource: datasourceSpy,
addDangerToast: dangerToastSpy,
},
});
wrapper.instance().visualize();
setTimeout(() => {
expect(datasourceSpy.callCount).toBe(1);
expect(exploreUtils.exportChart.callCount).toBe(0);
expect(dangerToastSpy.callCount).toBe(1);
dangerToastSpy.restore();
done();
});
});
});
});
});

View File

@@ -30,11 +30,16 @@ describe('SaveDatasetModal', () => {
userDatasetsOwned: [],
handleSaveDatasetRadioBtnState: () => {},
saveDatasetRadioBtnState: 1,
shouldOverwriteDataset: false,
handleOverwriteCancel: () => {},
handleOverwriteDataset: () => {},
handleOverwriteDatasetOption: () => {},
defaultCreateDatasetValue: 'someDatasets',
shouldOverwriteDataset: false,
userDatasetOptions: [],
disableSaveAndExploreBtn: false,
handleSaveDatasetModalSearch: () => {},
filterAutocompleteOption: () => false,
onChangeAutoComplete: () => {},
};
it('renders a radio group btn', () => {
const wrapper = shallow(<SaveDatasetModal {...mockedProps} />);