From af5c5a6feb7dec9a043b905f334eae0761117401 Mon Sep 17 00:00:00 2001 From: Alex Boatwright Date: Thu, 14 Nov 2019 10:24:09 -0800 Subject: [PATCH 1/6] chore: stash --- ui/src/dashboards/components/EditVEO.tsx | 8 ++++- ui/src/timeMachine/actions/index.ts | 14 +++++++++ .../components/view_options/TableOptions.tsx | 12 ++++---- ui/src/timeMachine/reducers/index.ts | 30 ++++++++++++++----- 4 files changed, 50 insertions(+), 14 deletions(-) diff --git a/ui/src/dashboards/components/EditVEO.tsx b/ui/src/dashboards/components/EditVEO.tsx index 1c1e3137c4d..81de01dae2c 100644 --- a/ui/src/dashboards/components/EditVEO.tsx +++ b/ui/src/dashboards/components/EditVEO.tsx @@ -48,7 +48,7 @@ const EditViewVEO: FunctionComponent = ({ useEffect(() => { getViewForTimeMachine(dashboardID, cellID, 'veo') onExecuteQueries(dashboardID) - }, [cellID, dashboardID]) + }, []) const handleClose = () => { router.push(`/orgs/${orgID}/dashboards/${dashboardID}`) @@ -95,6 +95,12 @@ const mstp = (state: AppState): StateProps => { const {activeTimeMachineID} = state.timeMachines const {view} = getActiveTimeMachine(state) + /* + if (view && view.properties && view.properties.fieldOptions && view.properties.fieldOptions[11].visible) { + console.trace() + debugger + } + */ return {view, activeTimeMachineID} } diff --git a/ui/src/timeMachine/actions/index.ts b/ui/src/timeMachine/actions/index.ts index 3eef0c22d0d..b4c1b90e833 100644 --- a/ui/src/timeMachine/actions/index.ts +++ b/ui/src/timeMachine/actions/index.ts @@ -465,6 +465,20 @@ export const setFieldOptions = ( payload: {fieldOptions}, }) +interface UpdateFieldOption { + type: 'UPDATE_FIELD_OPTION' + payload: { + option: FieldOption + } +} + +export const updateFieldOption = ( + option: FieldOption +): SetFieldOptionsAction => ({ + type: 'UPDATE_FIELD_OPTION', + payload: {option}, +}) + interface SetTableOptionsAction { type: 'SET_TABLE_OPTIONS' payload: { diff --git a/ui/src/timeMachine/components/view_options/TableOptions.tsx b/ui/src/timeMachine/components/view_options/TableOptions.tsx index fbc69d8a1d9..cadc26f0025 100644 --- a/ui/src/timeMachine/components/view_options/TableOptions.tsx +++ b/ui/src/timeMachine/components/view_options/TableOptions.tsx @@ -18,6 +18,7 @@ import { setDecimalPlaces, setColors, setFieldOptions, + updateFieldOption, setTableOptions, setTimeFormat, } from 'src/timeMachine/actions' @@ -52,6 +53,7 @@ interface DispatchProps { onSetColors: typeof setColors onSetTimeFormat: typeof setTimeFormat onSetFieldOptions: typeof setFieldOptions + onUpdateFieldOption: typeof updateFieldOption onSetTableOptions: typeof setTableOptions onSetDecimalPlaces: typeof setDecimalPlaces } @@ -154,16 +156,13 @@ export class TableOptions extends Component { dragIndex, hoverIndex ) + debugger this.props.onSetFieldOptions(fieldOptions) } private handleUpdateColumn = (fieldOption: FieldOption) => { - const {internalName} = fieldOption - const fieldOptions = this.props.fieldOptions.map(fopt => - fopt.internalName === internalName ? fieldOption : fopt - ) - - this.props.onSetFieldOptions(fieldOptions) + debugger + this.props.onUpdateFieldOption(fieldOption) } private handleToggleFixFirstColumn = () => { @@ -190,6 +189,7 @@ const mdtp: DispatchProps = { onSetDecimalPlaces: setDecimalPlaces, onSetColors: setColors, onSetFieldOptions: setFieldOptions, + onUpdateFieldOption: updateFieldOption, onSetTableOptions: setTableOptions, onSetTimeFormat: setTimeFormat, } diff --git a/ui/src/timeMachine/reducers/index.ts b/ui/src/timeMachine/reducers/index.ts index 9f1f5650c16..254f914f3ce 100644 --- a/ui/src/timeMachine/reducers/index.ts +++ b/ui/src/timeMachine/reducers/index.ts @@ -148,8 +148,10 @@ export const timeMachinesReducer = ( ): TimeMachinesState => { if (action.type === 'SET_ACTIVE_TIME_MACHINE') { const {activeTimeMachineID, initialState} = action.payload + initialState.view = Object.assign({}, initialState.view) const activeTimeMachine = state.timeMachines[activeTimeMachineID] - const view = initialState.view || activeTimeMachine.view + // const view = initialState.view || activeTimeMachine.view + const view = initialState.view const draftQueries = map(cloneDeep(view.properties.queries), q => ({ ...q, hidden: false, @@ -159,7 +161,7 @@ export const timeMachinesReducer = ( const timeRange = activeTimeMachineID === 'alerting' ? null : activeTimeMachine.timeRange - return { + const out = { ...state, activeTimeMachineID, timeMachines: { @@ -177,6 +179,8 @@ export const timeMachinesReducer = ( }, }, } + + return out } // All other actions act upon whichever single `TimeMachineState` is @@ -811,15 +815,27 @@ export const timeMachineReducer = ( typeof action.payload > const {fieldOptions} = action.payload - const {fieldOptions: prevOptions} = workingView.properties - const properties = { - ...workingView.properties, - fieldOptions: trueFieldOptions(fieldOptions, prevOptions), - } + const properties = {...workingView.properties, fieldOptions} const view = {...state.view, properties} + return {...state, view} } + case 'UPDATE_FIELD_OPTION': { + const props = state.view.properties.fieldOptions.slice(0) + const {option} = action.payload + const idx = props.findIndex(ni => ni.internalName === option.internalName) + if (idx > -1) { + props[idx] = option + } else { + props.push(option) + } + + const _state = Object.assign({}, state) + _state.view.properties.fieldOptions = props + return _state + } + case 'SET_TABLE_OPTIONS': { const workingView = state.view as ExtractWorkingView< typeof action.payload From f9037552eb0c7d076bd08a26ac406897a691e000 Mon Sep 17 00:00:00 2001 From: Alex Boatwright Date: Fri, 15 Nov 2019 14:31:27 -0800 Subject: [PATCH 2/6] feat: stash for sharing --- ui/src/dashboards/actions/views.ts | 2 + ui/src/dashboards/components/EditVEO.tsx | 12 +- .../shared/components/tables/TableGraphs.tsx | 39 +----- ui/src/timeMachine/actions/index.ts | 5 +- .../components/view_options/TableOptions.tsx | 2 - ui/src/timeMachine/reducers/index.ts | 131 ++++++++++-------- ui/webpack.common.ts | 2 +- 7 files changed, 82 insertions(+), 111 deletions(-) diff --git a/ui/src/dashboards/actions/views.ts b/ui/src/dashboards/actions/views.ts index 503b7f4bbf1..d77a0d1fc88 100644 --- a/ui/src/dashboards/actions/views.ts +++ b/ui/src/dashboards/actions/views.ts @@ -16,6 +16,7 @@ import { Action as NotificationAction, } from 'src/shared/actions/notifications' import {setActiveTimeMachine} from 'src/timeMachine/actions' +import {executeQueries} from 'src/timeMachine/actions/queries' // Types import {RemoteDataState, QueryView, GetState} from 'src/types' @@ -117,6 +118,7 @@ export const getViewForTimeMachine = ( } dispatch(setActiveTimeMachine(timeMachineID, {view})) + dispatch(executeQueries(dashboardID)) } catch (e) { dispatch(notify(copy.getViewFailed(e.message))) dispatch(setView(cellID, null, RemoteDataState.Error)) diff --git a/ui/src/dashboards/components/EditVEO.tsx b/ui/src/dashboards/components/EditVEO.tsx index 81de01dae2c..3a9e7855024 100644 --- a/ui/src/dashboards/components/EditVEO.tsx +++ b/ui/src/dashboards/components/EditVEO.tsx @@ -13,7 +13,6 @@ import VEOHeader from 'src/dashboards/components/VEOHeader' import {setName} from 'src/timeMachine/actions' import {saveVEOView} from 'src/dashboards/actions' import {getViewForTimeMachine} from 'src/dashboards/actions/views' -import {executeQueries} from 'src/timeMachine/actions/queries' // Utils import {getActiveTimeMachine} from 'src/timeMachine/selectors' @@ -24,7 +23,6 @@ import {AppState, RemoteDataState, QueryView, TimeMachineID} from 'src/types' interface DispatchProps { onSetName: typeof setName onSaveView: typeof saveVEOView - onExecuteQueries: typeof executeQueries getViewForTimeMachine: typeof getViewForTimeMachine } @@ -38,7 +36,6 @@ type Props = DispatchProps & StateProps & WithRouterProps const EditViewVEO: FunctionComponent = ({ getViewForTimeMachine, activeTimeMachineID, - onExecuteQueries, onSaveView, onSetName, params: {orgID, cellID, dashboardID}, @@ -47,7 +44,6 @@ const EditViewVEO: FunctionComponent = ({ }) => { useEffect(() => { getViewForTimeMachine(dashboardID, cellID, 'veo') - onExecuteQueries(dashboardID) }, []) const handleClose = () => { @@ -95,19 +91,13 @@ const mstp = (state: AppState): StateProps => { const {activeTimeMachineID} = state.timeMachines const {view} = getActiveTimeMachine(state) - /* - if (view && view.properties && view.properties.fieldOptions && view.properties.fieldOptions[11].visible) { - console.trace() - debugger - } - */ + return {view, activeTimeMachineID} } const mdtp: DispatchProps = { onSetName: setName, onSaveView: saveVEOView, - onExecuteQueries: executeQueries, getViewForTimeMachine: getViewForTimeMachine, } diff --git a/ui/src/shared/components/tables/TableGraphs.tsx b/ui/src/shared/components/tables/TableGraphs.tsx index 804a8847e46..59e9508a5c2 100644 --- a/ui/src/shared/components/tables/TableGraphs.tsx +++ b/ui/src/shared/components/tables/TableGraphs.tsx @@ -14,10 +14,9 @@ import {setFieldOptions as setFieldOptionsAction} from 'src/timeMachine/actions' // Utils import {getDeep} from 'src/utils/wrappers' -import {findTableNameHeaders} from 'src/dashboards/utils/tableGraph' // Types -import {TableViewProperties, FieldOption, FluxTable, TimeZone} from 'src/types' +import {TableViewProperties, FluxTable, TimeZone} from 'src/types' interface PassedProps { tables: FluxTable[] @@ -41,25 +40,6 @@ class TableGraphs extends PureComponent { selectedTableName: getDeep(this, 'props.tables[0].name', null), } - public componentDidMount() { - this.updateFieldOptions() - } - - public componentDidUpdate(prevProps: Props, prevState: State) { - const prevHeaders = findTableNameHeaders( - prevProps.tables, - prevState.selectedTableName - ) - const rawHeaders = findTableNameHeaders( - this.props.tables, - this.state.selectedTableName - ) - - if (!_.isEqual(rawHeaders, prevHeaders)) { - this.updateFieldOptions() - } - } - public render() { const {tables, properties, timeZone} = this.props @@ -107,7 +87,6 @@ class TableGraphs extends PureComponent { private handleSelectTable = (selectedTableName: string): void => { this.setState({selectedTableName}) - this.updateFieldOptions() } private get showSidebar(): boolean { @@ -127,22 +106,6 @@ class TableGraphs extends PureComponent { const {tables} = this.props return tables.find(t => t.name === this.nameOfSelectedTable) } - - private updateFieldOptions() { - this.props.setFieldOptions(this.extractFieldOptions()) - } - - private extractFieldOptions(): FieldOption[] { - return this.headers.map(h => ({ - internalName: h, - displayName: h, - visible: true, - })) - } - - private get headers(): string[] { - return getDeep(this.selectedTable, 'data.0', []) - } } const mdtp: DispatchProps = { diff --git a/ui/src/timeMachine/actions/index.ts b/ui/src/timeMachine/actions/index.ts index b4c1b90e833..776e0d4a965 100644 --- a/ui/src/timeMachine/actions/index.ts +++ b/ui/src/timeMachine/actions/index.ts @@ -71,6 +71,7 @@ export type Action = | EditActiveQueryWithBuilderAction | UpdateActiveQueryNameAction | SetFieldOptionsAction + | UpdateFieldOptionAction | SetTableOptionsAction | SetTimeFormatAction | SetXColumnAction @@ -465,7 +466,7 @@ export const setFieldOptions = ( payload: {fieldOptions}, }) -interface UpdateFieldOption { +interface UpdateFieldOptionAction { type: 'UPDATE_FIELD_OPTION' payload: { option: FieldOption @@ -474,7 +475,7 @@ interface UpdateFieldOption { export const updateFieldOption = ( option: FieldOption -): SetFieldOptionsAction => ({ +): UpdateFieldOptionAction => ({ type: 'UPDATE_FIELD_OPTION', payload: {option}, }) diff --git a/ui/src/timeMachine/components/view_options/TableOptions.tsx b/ui/src/timeMachine/components/view_options/TableOptions.tsx index cadc26f0025..a4b3fb8b4b7 100644 --- a/ui/src/timeMachine/components/view_options/TableOptions.tsx +++ b/ui/src/timeMachine/components/view_options/TableOptions.tsx @@ -156,12 +156,10 @@ export class TableOptions extends Component { dragIndex, hoverIndex ) - debugger this.props.onSetFieldOptions(fieldOptions) } private handleUpdateColumn = (fieldOption: FieldOption) => { - debugger this.props.onUpdateFieldOption(fieldOption) } diff --git a/ui/src/timeMachine/reducers/index.ts b/ui/src/timeMachine/reducers/index.ts index 254f914f3ce..cf0fa9911ac 100644 --- a/ui/src/timeMachine/reducers/index.ts +++ b/ui/src/timeMachine/reducers/index.ts @@ -1,8 +1,6 @@ // Libraries import { cloneDeep, - differenceWith, - isEqual, isNumber, get, map, @@ -24,6 +22,7 @@ import { DEFAULT_THRESHOLD_CHECK, DEFAULT_DEADMAN_CHECK, } from 'src/alerting/constants' +import { executeQueries } from 'src/timeMachine/actions/queries' // Types import { @@ -31,6 +30,7 @@ import { Check, DeadmanCheck, StatusRow, + TableViewProperties, TimeRange, ThresholdCheck, View, @@ -142,16 +142,51 @@ export const initialState = (): TimeMachinesState => ({ }, }) +const getTableProperties = (view, files) => { + const csv = files[0] + let pointer = 0, + ni + + // cut off the first 3 lines + for(ni = 0; ni < 3; ni++) { + pointer = csv.indexOf('\r\n', pointer) + 2 + } + + const existing = (view.properties.fieldOptions || []) + .reduce((prev, curr) => { + prev[curr.internalName] = curr + return prev + }, {}) + + csv.slice( + pointer, + csv.indexOf('\r\n', pointer) + ) + .split(',') + .filter((o) => !existing.hasOwnProperty(o)) + .filter((o) => !['result', '', 'table', 'time'].includes(o)) + .forEach((o) => { + existing[o] = { + internalName: o, + displayName: o, + visible: true + } + }) + + const fieldOptions = Object.keys(existing).map((e) => existing[e]) + const properties = { ...view.properties, fieldOptions } + + return properties +} + export const timeMachinesReducer = ( state: TimeMachinesState = initialState(), action: Action ): TimeMachinesState => { if (action.type === 'SET_ACTIVE_TIME_MACHINE') { const {activeTimeMachineID, initialState} = action.payload - initialState.view = Object.assign({}, initialState.view) const activeTimeMachine = state.timeMachines[activeTimeMachineID] - // const view = initialState.view || activeTimeMachine.view - const view = initialState.view + const view = initialState.view || activeTimeMachine.view const draftQueries = map(cloneDeep(view.properties.queries), q => ({ ...q, hidden: false, @@ -161,7 +196,8 @@ export const timeMachinesReducer = ( const timeRange = activeTimeMachineID === 'alerting' ? null : activeTimeMachine.timeRange - const out = { + executeQueries() + return { ...state, activeTimeMachineID, timeMachines: { @@ -179,8 +215,6 @@ export const timeMachinesReducer = ( }, }, } - - return out } // All other actions act upon whichever single `TimeMachineState` is @@ -236,7 +270,8 @@ export const timeMachineReducer = ( case 'SET_VIEW_TYPE': { const {type} = action.payload - const view = convertView(state.view, type) + + const view = convertView(state.view, state.queryResults.files, type) return {...state, view} } @@ -267,6 +302,10 @@ export const timeMachineReducer = ( draftState.queryResults.errorMessage = errorMessage if (files) { + if (state.view.properties.type === 'table') { + const properties = getTableProperties(state.view, files) + draftState.view = { ...state.view, properties } + } draftState.queryResults.files = files draftState.queryResults.isInitialFetch = false } @@ -815,25 +854,36 @@ export const timeMachineReducer = ( typeof action.payload > const {fieldOptions} = action.payload - const properties = {...workingView.properties, fieldOptions} + const properties = { + ...workingView.properties, + fieldOptions, + } const view = {...state.view, properties} - return {...state, view} } case 'UPDATE_FIELD_OPTION': { - const props = state.view.properties.fieldOptions.slice(0) - const {option} = action.payload - const idx = props.findIndex(ni => ni.internalName === option.internalName) - if (idx > -1) { - props[idx] = option - } else { - props.push(option) + const workingView = state.view as ExtractWorkingView< + TableViewProperties + > + const { option } = action.payload + const field = option.internalName + + const properties = {...workingView.properties} + properties.fieldOptions = properties.fieldOptions.slice(0) + + const names = workingView.properties.fieldOptions + .map((o) => o.internalName) + const idx = names.indexOf(field) + + if (idx < 0) { + return state } - const _state = Object.assign({}, state) - _state.view.properties.fieldOptions = props - return _state + properties.fieldOptions[idx] = option + + state.view = { ...state.view, properties } + return {...state} } case 'SET_TABLE_OPTIONS': { @@ -1005,13 +1055,13 @@ const updateCorrectColors = ( const convertView = ( view: QueryView, + files, outType: ViewType ): View => { const newView: any = createView(outType) newView.properties.queries = cloneDeep(view.properties.queries) - if (view.properties.type === 'table' && view.properties.fieldOptions) { - // prevents reselecting the table option from reseting the fieldOptions - newView.properties.fieldOptions = cloneDeep(view.properties.fieldOptions) + if (outType === 'table' && files) { + newView.properties = getTableProperties(newView, files) } newView.name = view.name newView.cellID = view.cellID @@ -1079,36 +1129,3 @@ const resetBuilderState = (draftState: TimeMachineState) => { draftState.queryBuilder = initialQueryBuilderState(newBuilderConfig) } -export const trueFieldOptions = (defaultOptions = [], fieldOptions = []) => { - // get the difference b/w fieldOptions - const diff = differenceWith(fieldOptions, defaultOptions, isEqual) - // create a copy of the defaultOptions to mutate - const options = defaultOptions.slice() - diff.forEach(option => { - const {internalName} = option - // check to see if the defaultOptions have been changed - const matchingIndex = defaultOptions.findIndex( - o => o.internalName === internalName - ) - // if the updated fieldOption exists in the default values - if (matchingIndex > -1) { - const matchingOption = defaultOptions[matchingIndex] - // check to see if the header values are set their initial values - // allows the defaultHeaders to be edited once they've loaded - if (matchingOption.internalName === matchingOption.displayName) { - // if the default option is set to false, set the option value to the default value - if (matchingOption.visible === false) { - options[matchingIndex] = matchingOption - } else { - // reassigns the fieldOption to the aliased one - options[matchingIndex] = option - } - } - } else { - // adds any extra fieldOption that has been aliased, - // even if it no longer exists in the headers - options.push(option) - } - }) - return options -} diff --git a/ui/webpack.common.ts b/ui/webpack.common.ts index 06fb92e7788..ee048d2ff57 100644 --- a/ui/webpack.common.ts +++ b/ui/webpack.common.ts @@ -110,7 +110,7 @@ module.exports = { new ForkTsCheckerWebpackPlugin(), new webpack.ProgressPlugin(), new webpack.DefinePlugin({ - ENABLE_MONACO: JSON.stringify(false) + ENABLE_MONACO: JSON.stringify(true) }), new webpack.EnvironmentPlugin({...process.env, GIT_SHA, API_PREFIX: API_BASE_PATH, STATIC_PREFIX: BASE_PATH}), ], From 80d9f9e2eb02aaad39745de42383ff0cd501313d Mon Sep 17 00:00:00 2001 From: Alex Boatwright Date: Fri, 15 Nov 2019 14:48:08 -0800 Subject: [PATCH 3/6] fix: and now typescript stops yelling --- ui/src/dashboards/actions/views.ts | 11 +---- ui/src/timeMachine/reducers/index.ts | 69 +++++++++++----------------- 2 files changed, 30 insertions(+), 50 deletions(-) diff --git a/ui/src/dashboards/actions/views.ts b/ui/src/dashboards/actions/views.ts index d77a0d1fc88..71af80ee63a 100644 --- a/ui/src/dashboards/actions/views.ts +++ b/ui/src/dashboards/actions/views.ts @@ -11,10 +11,7 @@ import { import * as copy from 'src/shared/copy/notifications' // Actions -import { - notify, - Action as NotificationAction, -} from 'src/shared/actions/notifications' +import {notify} from 'src/shared/actions/notifications' import {setActiveTimeMachine} from 'src/timeMachine/actions' import {executeQueries} from 'src/timeMachine/actions/queries' @@ -22,7 +19,6 @@ import {executeQueries} from 'src/timeMachine/actions/queries' import {RemoteDataState, QueryView, GetState} from 'src/types' import {Dispatch} from 'redux' import {View} from 'src/types' -import {Action as TimeMachineAction} from 'src/timeMachine/actions' import {TimeMachineID} from 'src/types' export type Action = SetViewAction | SetViewsAction | ResetViewsAction @@ -104,10 +100,7 @@ export const getViewForTimeMachine = ( dashboardID: string, cellID: string, timeMachineID: TimeMachineID -) => async ( - dispatch: Dispatch, - getState: GetState -): Promise => { +) => async (dispatch, getState: GetState): Promise => { try { const state = getState() let view = getViewFromState(state, cellID) as QueryView diff --git a/ui/src/timeMachine/reducers/index.ts b/ui/src/timeMachine/reducers/index.ts index cf0fa9911ac..16bd6ad490d 100644 --- a/ui/src/timeMachine/reducers/index.ts +++ b/ui/src/timeMachine/reducers/index.ts @@ -1,11 +1,5 @@ // Libraries -import { - cloneDeep, - isNumber, - get, - map, - omit, -} from 'lodash' +import {cloneDeep, isNumber, get, map, omit} from 'lodash' import {produce} from 'immer' // Utils @@ -22,7 +16,7 @@ import { DEFAULT_THRESHOLD_CHECK, DEFAULT_DEADMAN_CHECK, } from 'src/alerting/constants' -import { executeQueries } from 'src/timeMachine/actions/queries' +import {executeQueries} from 'src/timeMachine/actions/queries' // Types import { @@ -148,33 +142,30 @@ const getTableProperties = (view, files) => { ni // cut off the first 3 lines - for(ni = 0; ni < 3; ni++) { + for (ni = 0; ni < 3; ni++) { pointer = csv.indexOf('\r\n', pointer) + 2 } - const existing = (view.properties.fieldOptions || []) - .reduce((prev, curr) => { - prev[curr.internalName] = curr - return prev - }, {}) - - csv.slice( - pointer, - csv.indexOf('\r\n', pointer) - ) - .split(',') - .filter((o) => !existing.hasOwnProperty(o)) - .filter((o) => !['result', '', 'table', 'time'].includes(o)) - .forEach((o) => { - existing[o] = { - internalName: o, - displayName: o, - visible: true - } - }) - - const fieldOptions = Object.keys(existing).map((e) => existing[e]) - const properties = { ...view.properties, fieldOptions } + const existing = (view.properties.fieldOptions || []).reduce((prev, curr) => { + prev[curr.internalName] = curr + return prev + }, {}) + + csv + .slice(pointer, csv.indexOf('\r\n', pointer)) + .split(',') + .filter(o => !existing.hasOwnProperty(o)) + .filter(o => !['result', '', 'table', 'time'].includes(o)) + .forEach(o => { + existing[o] = { + internalName: o, + displayName: o, + visible: true, + } + }) + + const fieldOptions = Object.keys(existing).map(e => existing[e]) + const properties = {...view.properties, fieldOptions} return properties } @@ -304,7 +295,7 @@ export const timeMachineReducer = ( if (files) { if (state.view.properties.type === 'table') { const properties = getTableProperties(state.view, files) - draftState.view = { ...state.view, properties } + draftState.view = {...state.view, properties} } draftState.queryResults.files = files draftState.queryResults.isInitialFetch = false @@ -863,17 +854,14 @@ export const timeMachineReducer = ( } case 'UPDATE_FIELD_OPTION': { - const workingView = state.view as ExtractWorkingView< - TableViewProperties - > - const { option } = action.payload + const workingView = state.view as ExtractWorkingView + const {option} = action.payload const field = option.internalName const properties = {...workingView.properties} properties.fieldOptions = properties.fieldOptions.slice(0) - const names = workingView.properties.fieldOptions - .map((o) => o.internalName) + const names = workingView.properties.fieldOptions.map(o => o.internalName) const idx = names.indexOf(field) if (idx < 0) { @@ -882,7 +870,7 @@ export const timeMachineReducer = ( properties.fieldOptions[idx] = option - state.view = { ...state.view, properties } + state.view = {...state.view, properties} return {...state} } @@ -1128,4 +1116,3 @@ const resetBuilderState = (draftState: TimeMachineState) => { draftState.queryBuilder = initialQueryBuilderState(newBuilderConfig) } - From d51a5200dbd4387dcff3f5df023df2d778af433e Mon Sep 17 00:00:00 2001 From: Alex Boatwright Date: Fri, 15 Nov 2019 15:27:40 -0800 Subject: [PATCH 4/6] fix: monaco leaked out --- ui/webpack.common.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/webpack.common.ts b/ui/webpack.common.ts index ee048d2ff57..06fb92e7788 100644 --- a/ui/webpack.common.ts +++ b/ui/webpack.common.ts @@ -110,7 +110,7 @@ module.exports = { new ForkTsCheckerWebpackPlugin(), new webpack.ProgressPlugin(), new webpack.DefinePlugin({ - ENABLE_MONACO: JSON.stringify(true) + ENABLE_MONACO: JSON.stringify(false) }), new webpack.EnvironmentPlugin({...process.env, GIT_SHA, API_PREFIX: API_BASE_PATH, STATIC_PREFIX: BASE_PATH}), ], From 9a4f60aefd80ef8ed64c30f308bbe40753a10cc8 Mon Sep 17 00:00:00 2001 From: Alex Boatwright Date: Fri, 15 Nov 2019 15:31:40 -0800 Subject: [PATCH 5/6] fix: just delete the broken test --- ui/src/dashboards/actions/views.test.ts | 4 +- ui/src/timeMachine/reducers/index.test.ts | 91 ----------------------- 2 files changed, 2 insertions(+), 93 deletions(-) delete mode 100644 ui/src/timeMachine/reducers/index.test.ts diff --git a/ui/src/dashboards/actions/views.test.ts b/ui/src/dashboards/actions/views.test.ts index 457b21ee2cc..8238ea28f6c 100644 --- a/ui/src/dashboards/actions/views.test.ts +++ b/ui/src/dashboards/actions/views.test.ts @@ -71,7 +71,7 @@ describe('Dashboards.Actions.getViewForTimeMachine', () => { ) expect(mocked(getView)).toHaveBeenCalledTimes(1) - expect(mockedDispatch).toHaveBeenCalledTimes(2) + expect(mockedDispatch).toHaveBeenCalledTimes(3) const [ setViewDispatchArguments, @@ -103,7 +103,7 @@ describe('Dashboards.Actions.getViewForTimeMachine', () => { ) expect(mocked(getView)).toHaveBeenCalledTimes(0) - expect(mockedDispatch).toHaveBeenCalledTimes(1) + expect(mockedDispatch).toHaveBeenCalledTimes(2) expect(mockedDispatch).toHaveBeenCalledWith({ type: 'SET_ACTIVE_TIME_MACHINE', payload: { diff --git a/ui/src/timeMachine/reducers/index.test.ts b/ui/src/timeMachine/reducers/index.test.ts deleted file mode 100644 index 30812480c15..00000000000 --- a/ui/src/timeMachine/reducers/index.test.ts +++ /dev/null @@ -1,91 +0,0 @@ -// Reducer -import {trueFieldOptions} from 'src/timeMachine/reducers/index' - -describe('trueFieldOptions utility function', () => { - it('should return defaultProps if no fieldOptions are passed: ', () => { - const defaultOptions = [ - { - internalName: 'Applications', - displayName: 'Applications', - visible: true, - }, - ] - const result = trueFieldOptions(defaultOptions, []) - expect(result).toEqual(defaultOptions) - }) - - it("should return the new fieldOptions if the defaultOptions don't exist: ", () => { - const fieldOptions = [ - { - internalName: 'Applications', - displayName: 'Applications', - visible: true, - }, - ] - const result = trueFieldOptions([], fieldOptions) - expect(result).toEqual(fieldOptions) - }) - - it('should return the new aliased fields for fieldOptions with the same internalName: ', () => { - const fieldOptions = [ - { - internalName: 'Applications', - displayName: 'New Alias', - visible: true, - }, - ] - const defaultOptions = [ - { - internalName: 'Applications', - displayName: 'Applications', - visible: true, - }, - ] - const result = trueFieldOptions(defaultOptions, fieldOptions) - expect(result).toEqual(fieldOptions) - }) - - it('should add aliased fieldOptions onto defaultOptions if they no longer exist: ', () => { - const fieldOptions = [ - { - internalName: 'Applications', - displayName: 'New Alias', - visible: true, - }, - ] - const defaultOptions = [ - { - internalName: 'Table', - displayName: 'Table', - visible: true, - }, - ] - const result = trueFieldOptions(defaultOptions, fieldOptions) - expect(result).toEqual([defaultOptions[0], fieldOptions[0]]) - }) - - it(`should add aliased fieldOptions onto defaultOptions if they no longer exist - and use the aliased versions of ones that do exist: `, () => { - const fieldOptions = [ - { - internalName: 'Applications', - displayName: 'New Alias', - visible: true, - }, - ] - const defaultOptions = [ - { - internalName: 'Applications', - displayName: 'Applications', - visible: true, - }, - { - internalName: 'Table', - displayName: 'Table', - visible: true, - }, - ] - const result = trueFieldOptions(defaultOptions, fieldOptions) - expect(result).toEqual([fieldOptions[0], defaultOptions[1]]) - }) -}) From f98cd1bcca1097d5834ed33b14dda8fc65a2db24 Mon Sep 17 00:00:00 2001 From: Alex Boatwright Date: Fri, 15 Nov 2019 15:49:02 -0800 Subject: [PATCH 6/6] fix: readonly my eye --- ui/src/timeMachine/reducers/index.ts | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/ui/src/timeMachine/reducers/index.ts b/ui/src/timeMachine/reducers/index.ts index 16bd6ad490d..69d48c96fcd 100644 --- a/ui/src/timeMachine/reducers/index.ts +++ b/ui/src/timeMachine/reducers/index.ts @@ -16,7 +16,6 @@ import { DEFAULT_THRESHOLD_CHECK, DEFAULT_DEADMAN_CHECK, } from 'src/alerting/constants' -import {executeQueries} from 'src/timeMachine/actions/queries' // Types import { @@ -187,7 +186,6 @@ export const timeMachinesReducer = ( const timeRange = activeTimeMachineID === 'alerting' ? null : activeTimeMachine.timeRange - executeQueries() return { ...state, activeTimeMachineID, @@ -870,8 +868,8 @@ export const timeMachineReducer = ( properties.fieldOptions[idx] = option - state.view = {...state.view, properties} - return {...state} + const view = {...state.view, properties} + return {...state, view} } case 'SET_TABLE_OPTIONS': {