Influxdata
/
influxdb
mirror of https://github.com/influxdata/influxdb.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

WIP pick instead of select tempvars 

Co-authored-by: Delmer Reed <delmer814@gmail.com>
pull/10616/head
ebb-tide 2018-06-28 10:17:09 -07:00
parent b02e26e3ef
commit 0bddeac28f
10 changed files with 57 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
ui/src/dashboards/actions/index.ts
View File

@ -206,12 +206,12 @@ export const editCellQueryStatus: DashboardsActions.EditCellQueryStatusActionCre
},
})
export const templateVariableSelected: DashboardsActions.TemplateVariableSelectedActionCreator = (
export const templateVariablePicked: DashboardsActions.TemplateVariablePickedActionCreator = (
dashboardID: number,
templateID: string,
values
): DashboardsActions.TemplateVariableSelectedAction => ({
type: 'TEMPLATE_VARIABLE_SELECTED',
): DashboardsActions.TemplateVariablePickedAction => ({
type: 'TEMPLATE_VARIABLE_PICKED',
payload: {
dashboardID,
templateID,
@ -659,7 +659,7 @@ const syncDashboardTempVarsFromURLQueryParams = (
): DashboardsActions.SyncDashboardTempVarsFromURLQueryParamsDispatcher => (
dispatch: Dispatch<
| NotificationsActions.PublishNotificationActionCreator
| DashboardsActions.TemplateVariableSelectedAction
| DashboardsActions.TemplateVariablePickedAction
>,
getState: () => DashboardsReducers.Dashboards & AuthReducers.Auth
): void => {
@ -794,12 +794,12 @@ export const getDashboardWithHydratedAndSyncedTempVarsAsync: DashboardsActions.G
}
await bindActionCreators(hydrateTempVarValuesAsync, dispatch)(
+dashboardID,
dashboardID,
source
)
bindActionCreators(syncDashboardFromURLQueryParams, dispatch)(
+dashboardID,
dashboardID,
location
)
}

10
ui/src/dashboards/containers/DashboardPage.tsx
View File

@ -67,7 +67,7 @@ interface DashboardActions {
updateDashboardCell: DashboardsActions.UpdateDashboardCellDispatcher
cloneDashboardCellAsync: DashboardsActions.CloneDashboardCellDispatcher
deleteDashboardCellAsync: DashboardsActions.DeleteDashboardCellDispatcher
templateVariableSelected: DashboardsActions.TemplateVariableSelectedActionCreator
templateVariablePicked: DashboardsActions.TemplateVariablePickedActionCreator
syncURLQueryFromTempVars: DashboardsActions.SyncURLQueryFromTempVarsDispatcher
setZoomedTimeRangeAsync: DashboardsActions.SetZoomedTimeRangeDispatcher
}
@ -320,7 +320,7 @@ class DashboardPage extends Component<Props, State> {
meRole={meRole}
isUsingAuth={isUsingAuth}
onSaveTemplates={this.handleSaveTemplateVariables}
onSelectTemplate={this.handleSelectTemplate}
onPickTemplate={this.handlePickTemplate}
isOpen={showTemplateControlBar}
source={source}
/>
@ -470,7 +470,7 @@ class DashboardPage extends Component<Props, State> {
this.props.deleteDashboardCellAsync(dashboard, cell)
}
private handleSelectTemplate = (
private handlePickTemplate = (
templateID: string
): ((value: TempVarsModels.TemplateValue) => void) => (
value: TempVarsModels.TemplateValue
@ -492,8 +492,8 @@ class DashboardPage extends Component<Props, State> {
updatedQueryParam
)
}
this.props.templateVariableSelected(dashboard.id, templateID, [value])
this.props.putDashboardByID(dashboardID)
this.props.templateVariablePicked(dashboard.id, templateID, [value])
// this.props.putDashboardByID(dashboardID)
}
private handleSaveTemplateVariables = async (

47
ui/src/dashboards/reducers/ui.js
View File

@ -1,5 +1,5 @@
import _ from 'lodash'
import {timeRanges} from 'shared/data/timeRanges'
import {timeRanges} from 'src/shared/data/timeRanges'
import {NULL_HOVER_TIME} from 'src/shared/constants/tableGraph'
import {applyDashboardTempVarOverrides} from 'src/dashboards/utils/tempVars'
@ -141,25 +141,26 @@ const ui = (state = initialState, action) => {
return {...state, cellQueryStatus: {queryID, status}}
}
case 'TEMPLATE_VARIABLE_SELECTED': {
case 'TEMPLATE_VARIABLE_PICKED': {
const {
dashboardID,
templateID,
values: updatedSelectedValues,
} = action.payload
const newDashboards = state.dashboards.map(dashboard => {
if (dashboard.id === dashboardID) {
const newTemplates = dashboard.templates.map(staleTemplate => {
if (staleTemplate.id === templateID) {
const newValues = staleTemplate.values.map(staleValue => {
let selected = false
let picked = false
for (let i = 0; i < updatedSelectedValues.length; i++) {
if (updatedSelectedValues[i].value === staleValue.value) {
selected = true
picked = true
break
}
}
return {...staleValue, selected}
return {...staleValue, picked}
})
return {...staleTemplate, values: newValues}
}
@ -174,7 +175,6 @@ const ui = (state = initialState, action) => {
case 'TEMPLATE_VARIABLES_SELECTED_BY_NAME': {
const {dashboardID, queryParams} = action.payload
const newDashboards = state.dashboards.map(
oldDashboard =>
oldDashboard.id === dashboardID
@ -192,25 +192,34 @@ const ui = (state = initialState, action) => {
if (dashboard.id !== dashboardID) {
return dashboard
}
const templates = dashboard.templates.map(template => {
if (template.id !== templateID || template.type === 'csv') {
if (template.id !== templateID) {
return template
}
const selectedValue = _.get(template, 'values', []).find(
v => v.selected
)
const v = values.map(value => ({
selected: _.get(selectedValue, 'value') === value,
value,
type: TEMPLATE_VARIABLE_TYPES[template.type],
}))
// || template.type === 'csv'
// get this to run for csvs?
const pickedValue = _.get(template, 'values', []).find(v => v.picked)
let val
if (pickedValue) {
val = values.map(value => ({
picked: _.get(pickedValue, 'value') === value,
value,
type: TEMPLATE_VARIABLE_TYPES[template.type],
}))
} else {
const selectedValue = _.get(template, 'values', []).find(
v => v.selected
)
val = values.map(value => ({
picked: _.get(selectedValue, 'value') === value,
value,
type: TEMPLATE_VARIABLE_TYPES[template.type],
}))
}
return {
...template,
values: v,
values: val,
}
})

8
ui/src/dashboards/utils/tempVars.ts
View File

@ -55,21 +55,19 @@ const reconcileTempVarsWithOverrides = (
const {tempVar: name, values} = tempVar
const strippedTempVar = stripTempVar(name)
const overrideValue = tempVarOverrides[strippedTempVar]
if (overrideValue) {
const isValid = isValidTempVarOverride(values, overrideValue)
if (isValid) {
const overriddenValues = values.map(tempVarValue => {
const {value} = tempVarValue
if (value === overrideValue) {
return {...tempVarValue, selected: true}
return {...tempVarValue, picked: true}
}
return {...tempVarValue, selected: false}
return {...tempVarValue, picked: false}
})
return {...tempVar, values: overriddenValues}
}
// or pick selected value.
return tempVar
}

6
ui/src/tempVars/components/TemplateControlBar.tsx
View File

@ -14,7 +14,7 @@ interface Props {
templates: Template[]
isOpen: boolean
source: Source
onSelectTemplate: (id: string) => void
onPickTemplate: (id: string) => void
onSaveTemplates: (templates: Template[]) => void
}
@ -33,7 +33,7 @@ class TemplateControlBar extends Component<Props, State> {
const {
isOpen,
templates,
onSelectTemplate,
onPickTemplate,
meRole,
isUsingAuth,
source,
@ -52,7 +52,7 @@ class TemplateControlBar extends Component<Props, State> {
isUsingAuth={isUsingAuth}
template={template}
source={source}
onSelectTemplate={onSelectTemplate}
onPickTemplate={onPickTemplate}
onCreateTemplate={this.handleCreateTemplate}
onUpdateTemplate={this.handleUpdateTemplate}
onDeleteTemplate={this.handleDeleteTemplate}

6
ui/src/tempVars/components/TemplateControlDropdown.tsx
View File

@ -13,7 +13,7 @@ interface Props {
meRole: string
isUsingAuth: boolean
source: Source
onSelectTemplate: (id: string) => void
onPickTemplate: (id: string) => void
onCreateTemplate: (template: Template) => Promise<void>
onUpdateTemplate: (template: Template) => Promise<void>
onDeleteTemplate: (template: Template) => Promise<void>
@ -38,7 +38,7 @@ class TemplateControlDropdown extends PureComponent<Props, State> {
isUsingAuth,
meRole,
source,
onSelectTemplate,
onPickTemplate,
onCreateTemplate,
} = this.props
const {isEditing} = this.state
@ -64,7 +64,7 @@ class TemplateControlDropdown extends PureComponent<Props, State> {
useAutoComplete={true}
selected={pickedItem.text}
disabled={isUsingAuth && !isUserAuthorized(meRole, EDITOR_ROLE)}
onChoose={onSelectTemplate(template.id)}
onChoose={onPickTemplate(template.id)}
/>
<Authorized requiredRole={EDITOR_ROLE}>
<label className="template-control--label">

10
ui/src/types/actions/dashboards.ts
View File

@ -227,14 +227,14 @@ export interface EditCellQueryStatusAction {
}
}
export type TemplateVariableSelectedActionCreator = (
export type TemplateVariablePickedActionCreator = (
dashboardID: number,
templateID: string,
values: any[]
) => TemplateVariableSelectedAction
) => TemplateVariablePickedAction
export interface TemplateVariableSelectedAction {
type: 'TEMPLATE_VARIABLE_SELECTED'
export interface TemplateVariablePickedAction {
type: 'TEMPLATE_VARIABLE_PICKED'
payload: {
dashboardID: number
templateID: string
@ -369,7 +369,7 @@ export type SyncURLQueryFromQueryParamsObjectActionCreator = (
export type SyncDashboardTempVarsFromURLQueryParamsDispatcher = (
dispatch: Dispatch<
| NotificationsActions.PublishNotificationActionCreator
| TemplateVariableSelectedAction
| TemplateVariablePickedAction
>,
getState: () => DashboardsReducers.Dashboards & DashboardsReducers.Auth
) => void

4
ui/test/dashboards/reducers/ui.test.ts
View File

@ -11,7 +11,7 @@ import {
deleteDashboard,
syncDashboardCell,
deleteDashboardFailed,
templateVariableSelected,
templateVariablePicked,
editTemplateVariableValues,
templateVariablesSelectedByName,
setActiveCell,
@ -117,7 +117,7 @@ describe('DataExplorer.Reducers.UI', () => {
const value = dash.templates[0].values[2].value
const actual = reducer(
state,
templateVariableSelected(dash.id, dash.templates[0].id, [{value}])
templateVariablePicked(dash.id, dash.templates[0].id, [{value}])
)
expect(actual.dashboards[0].templates[0].values[0].selected).toBe(false)

2
ui/test/tempVars/components/TemplateControlBar.test.tsx
View File

@ -14,7 +14,7 @@ const defaultProps = {
templates: [],
meRole: 'EDITOR',
isUsingAuth: true,
onSelectTemplate: () => {},
onPickTemplate: () => {},
onSaveTemplates: () => {},
onCreateTemplateVariable: () => {},
source,

2
ui/test/tempVars/components/TemplateControlDropdown.test.tsx
View File

@ -26,7 +26,7 @@ const defaultProps = {
meRole: 'EDITOR',
isUsingAuth: true,
source,
onSelectTemplate: () => Promise.resolve(),
onPickTemplate: () => Promise.resolve(),
onCreateTemplate: () => Promise.resolve(),
onUpdateTemplate: () => Promise.resolve(),
onDeleteTemplate: () => Promise.resolve(),