-
Notifications
You must be signed in to change notification settings - Fork 3.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(dashboard): add ability to change order of variable dropdowns #12821
Conversation
678f4a3
to
f98e1c4
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Awesome. I think there's one remaining bug in the reducer code (it was preventing me from loading a dashboard). After that is fixed, LGTM
|
||
// Components | ||
import VariableDropdown from 'src/dashboards/components/variablesControlBar/VariableDropdown' | ||
// import VariableDropdown from 'src/dashboards/components/variablesControlBar/VariableDropdown' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
// import VariableDropdown from 'src/dashboards/components/variablesControlBar/VariableDropdown' |
ui/src/variables/reducers/index.ts
Outdated
@@ -81,13 +82,29 @@ export const variablesReducer = ( | |||
|
|||
case 'SET_VARIABLE_VALUES': { | |||
const {contextID, status, values} = action.payload | |||
const originalOrder = draftState.values[contextID].order |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This line was preventing me from loading a dashboard that had never been loaded before. In this case there are no values in localStorage, so draftState.values[contextID]
doesn't exist, so accessing its order
property is a run time error.
I think we can also simplify the logic that maintains the existing order:
const prevOrder = get(draftState, `values.${contextID}.order`) || []
if (values) {
// Maintain the existing sort order, placing new variables at the
// beginning
const order = Object.keys(values).sort(
(a, b) => prevOrder.indexOf(a) - prevOrder.indexOf(b)
)
draftState.values[contextID] = {
status,
values,
order,
}
} else if (draftState.values[contextID]) {
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
clever! I like it
4211f47
to
acad0ff
Compare
acad0ff
to
85e44b2
Compare
Closes #12512
Closes #12376
This PR allows variables to be moved left and right within the
VariablesControlBar
in a dashboard. The order of the variables on a given dashboard is stored in thevalues
property of the Variables state in local storage.