From d1356cbb30d900c9a5daf6b4af99a1c9ef4a2170 Mon Sep 17 00:00:00 2001 From: Iris Scholten Date: Thu, 1 Nov 2018 16:37:48 -0700 Subject: [PATCH] Update flux editor to use static functions file for suggestions --- .../ToolbarFunction.tsx | 2 +- ui/src/flux/constants/functions.ts | 36 +++++++++---------- ui/src/flux/helpers/suggestions.ts | 16 +++++++++ ui/src/shared/apis/flux/suggestions.ts | 14 -------- .../components/TimeMachine/FluxQueryMaker.tsx | 12 ++----- ui/test/flux/apis/flux.test.ts | 20 ----------- 6 files changed, 37 insertions(+), 63 deletions(-) create mode 100644 ui/src/flux/helpers/suggestions.ts delete mode 100644 ui/src/shared/apis/flux/suggestions.ts delete mode 100644 ui/test/flux/apis/flux.test.ts diff --git a/ui/src/flux/components/flux_functions_toolbar/ToolbarFunction.tsx b/ui/src/flux/components/flux_functions_toolbar/ToolbarFunction.tsx index 7e1544509..928907e87 100644 --- a/ui/src/flux/components/flux_functions_toolbar/ToolbarFunction.tsx +++ b/ui/src/flux/components/flux_functions_toolbar/ToolbarFunction.tsx @@ -51,7 +51,7 @@ class ToolbarFunction extends PureComponent { > {this.tooltip}
- {func.name} {this.helperText} + {func.name}() {this.helperText}
) diff --git a/ui/src/flux/constants/functions.ts b/ui/src/flux/constants/functions.ts index 0eb8bf77e..265879d55 100644 --- a/ui/src/flux/constants/functions.ts +++ b/ui/src/flux/constants/functions.ts @@ -3,7 +3,7 @@ import {FluxToolbarFunction} from 'src/types/flux' export const functions: FluxToolbarFunction[] = [ { - name: 'count()', + name: 'count', args: [ { name: 'columns', @@ -18,7 +18,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'covariance()', + name: 'covariance', args: [ { name: 'columns', @@ -46,7 +46,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'cumulativeSum()', + name: 'cumulativeSum', args: [ { name: 'columns', @@ -62,7 +62,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'derivative()', + name: 'derivative', args: [ { name: 'unit', @@ -95,7 +95,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'difference()', + name: 'difference', args: [ { name: 'nonNegative', @@ -116,7 +116,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'distinct()', + name: 'distinct', args: [ { name: 'column', @@ -130,7 +130,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'drop()', + name: 'drop', args: [ { name: 'columns', @@ -152,7 +152,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'duplicate()', + name: 'duplicate', args: [ { name: 'column', @@ -171,7 +171,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'filter()', + name: 'filter', args: [ { name: 'fn', @@ -187,7 +187,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'first()', + name: 'first', args: [], desc: 'Selects the first non-null record from an input table.', example: 'first()', @@ -195,7 +195,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'from()', + name: 'from', args: [ { name: 'bucket', @@ -215,7 +215,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'fromRows()', + name: 'fromRows', args: [ { name: 'bucket', @@ -235,7 +235,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'group()', + name: 'group', args: [ { name: 'by', @@ -262,7 +262,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'histogram()', + name: 'histogram', args: [ { name: 'column', @@ -303,7 +303,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'histogramQuantile()', + name: 'histogramQuantile', args: [ { name: 'quantile', @@ -344,7 +344,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'integral()', + name: 'integral', args: [ { name: 'unit', @@ -365,7 +365,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'intervals()', + name: 'intervals', args: [ { name: 'every', @@ -404,7 +404,7 @@ export const functions: FluxToolbarFunction[] = [ link: 'http://example.com', }, { - name: 'join()', + name: 'join', args: [ { name: 'tables', diff --git a/ui/src/flux/helpers/suggestions.ts b/ui/src/flux/helpers/suggestions.ts new file mode 100644 index 000000000..762662a6a --- /dev/null +++ b/ui/src/flux/helpers/suggestions.ts @@ -0,0 +1,16 @@ +// Constants +import {functions} from 'src/flux/constants' + +// Types +import {Suggestion} from 'src/types/flux' + +export const getSuggestions = (): Suggestion[] => { + return functions.map(({args, name}) => { + const params = args.reduce((acc, {name: argName, type}) => { + acc[argName] = type + return acc + }, {}) + + return {name, params} + }) +} diff --git a/ui/src/shared/apis/flux/suggestions.ts b/ui/src/shared/apis/flux/suggestions.ts deleted file mode 100644 index 041848b74..000000000 --- a/ui/src/shared/apis/flux/suggestions.ts +++ /dev/null @@ -1,14 +0,0 @@ -import AJAX from 'src/utils/ajax' - -export const getSuggestions = async (url: string) => { - try { - const {data} = await AJAX({ - url, - }) - - return data.funcs - } catch (error) { - console.error('Could not get suggestions', error) - throw error - } -} diff --git a/ui/src/shared/components/TimeMachine/FluxQueryMaker.tsx b/ui/src/shared/components/TimeMachine/FluxQueryMaker.tsx index f45604cbb..5c2f9be4b 100644 --- a/ui/src/shared/components/TimeMachine/FluxQueryMaker.tsx +++ b/ui/src/shared/components/TimeMachine/FluxQueryMaker.tsx @@ -14,12 +14,12 @@ import FluxFunctionsToolbar from 'src/flux/components/flux_functions_toolbar/Flu import {HANDLE_VERTICAL} from 'src/shared/constants' // Utils -import {getSuggestions} from 'src/shared/apis/flux/suggestions' import {getAST} from 'src/shared/apis/flux/ast' import {restartable} from 'src/shared/utils/restartable' import DefaultDebouncer, {Debouncer} from 'src/shared/utils/debouncer' import {TimeMachineContainer} from 'src/shared/utils/TimeMachineContainer' import {parseError} from 'src/flux/helpers/scriptBuilder' +import {getSuggestions} from 'src/flux/helpers/suggestions' // Types import {NotificationAction, Source} from 'src/types' @@ -61,14 +61,13 @@ class FluxQueryMaker extends PureComponent { super(props) this.state = { - suggestions: [], + suggestions: getSuggestions(), draftScriptStatus: {type: 'none', text: ''}, isWizardActive: false, } } public componentDidMount() { - this.fetchSuggestions() this.checkDraftScript() } @@ -216,13 +215,6 @@ class FluxQueryMaker extends PureComponent { this.setState({draftScriptStatus}) } - - private fetchSuggestions = async (): Promise => { - const {links} = this.props - const suggestions = await getSuggestions(links.suggestions) - - this.setState({suggestions}) - } } const ConnectedFluxQueryMaker = (props: PassedProps) => ( diff --git a/ui/test/flux/apis/flux.test.ts b/ui/test/flux/apis/flux.test.ts deleted file mode 100644 index bc3b780f1..000000000 --- a/ui/test/flux/apis/flux.test.ts +++ /dev/null @@ -1,20 +0,0 @@ -import {getSuggestions} from 'src/shared/apis/flux/suggestions' -import AJAX from 'src/utils/ajax' - -jest.mock('src/utils/ajax', () => require('mocks/utils/ajax')) - -describe('Flux.Apis', () => { - afterEach(() => { - jest.clearAllMocks() - }) - - describe('getSuggestions', () => { - it('is called with the expected body', () => { - const url = '/chronograf/v1/suggestions' - getSuggestions(url) - expect(AJAX).toHaveBeenCalledWith({ - url, - }) - }) - }) -})