Commit 93e2eb5b authored by Paul Slaughter's avatar Paul Slaughter

Merge branch 'jl-sticky-label-toggle' into 'master'

Make "show labels" toggle persist with localStorage

See merge request gitlab-org/gitlab!34728
parents f3625de4 74393bf0
......@@ -63,8 +63,8 @@ const fetchEpics = ({ endpoints }) => {
export default {
...actionsCE,
toggleShowLabels({ commit }) {
commit(types.TOGGLE_LABELS);
setShowLabels({ commit }, val) {
commit(types.SET_SHOW_LABELS, val);
},
setActiveListId({ commit }, listId) {
......
......@@ -11,9 +11,9 @@ export const REQUEST_REMOVE_BOARD = 'REQUEST_REMOVE_BOARD';
export const RECEIVE_REMOVE_BOARD_SUCCESS = 'RECEIVE_REMOVE_BOARD_SUCCESS';
export const RECEIVE_REMOVE_BOARD_ERROR = 'RECEIVE_REMOVE_BOARD_ERROR';
export const TOGGLE_PROMOTION_STATE = 'TOGGLE_PROMOTION_STATE';
export const TOGGLE_LABELS = 'TOGGLE_LABELS';
export const TOGGLE_EPICS_SWIMLANES = 'TOGGLE_EPICS_SWIMLANES';
export const RECEIVE_SWIMLANES_SUCCESS = 'RECEIVE_SWIMLANES_SUCCESS';
export const RECEIVE_SWIMLANES_FAILURE = 'RECEIVE_SWIMLANES_FAILURE';
export const RECEIVE_EPICS_SUCCESS = 'RECEIVE_EPICS_SUCCESS';
export const SET_ACTIVE_LIST_ID = 'SET_ACTIVE_LIST_ID';
export const SET_SHOW_LABELS = 'SET_SHOW_LABELS';
......@@ -8,8 +8,8 @@ const notImplemented = () => {
export default {
...mutationsCE,
[mutationTypes.TOGGLE_LABELS]: state => {
state.isShowingLabels = !state.isShowingLabels;
[mutationTypes.SET_SHOW_LABELS]: (state, val) => {
state.isShowingLabels = val;
},
[mutationTypes.SET_ACTIVE_LIST_ID]: (state, id) => {
state.activeListId = id;
......
......@@ -3,12 +3,14 @@ import { mapState, mapGetters, mapActions } from 'vuex';
import { GlToggle } from '@gitlab/ui';
import Tracking from '~/tracking';
import store from '~/boards/stores';
import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
export default () =>
new Vue({
el: document.getElementById('js-board-labels-toggle'),
components: {
GlToggle,
LocalStorageSync,
},
store,
computed: {
......@@ -16,19 +18,24 @@ export default () =>
...mapGetters(['getLabelToggleState']),
},
methods: {
...mapActions(['toggleShowLabels']),
...mapActions(['setShowLabels']),
onToggle() {
this.toggleShowLabels();
onToggle(val) {
this.setShowLabels(val);
Tracking.event(document.body.dataset.page, 'toggle', {
label: 'show_labels',
property: this.getLabelToggleState,
});
},
onStorageUpdate(val) {
this.setShowLabels(JSON.parse(val));
},
},
template: `
<div class="board-labels-toggle-wrapper d-flex align-items-center prepend-left-10">
<local-storage-sync storage-key="gl-show-board-labels" :value="JSON.stringify(isShowingLabels)" @input="onStorageUpdate" />
<gl-toggle
:value="isShowingLabels"
label="Show labels"
......
---
title: Update the "show labels" toggle on boards to persist using localStorage
merge_request: 34728
author:
type: changed
......@@ -13,13 +13,20 @@ const expectNotImplemented = action => {
});
};
describe('toggleShowLabels', () => {
it('should commit mutation TOGGLE_LABELS', done => {
describe('setShowLabels', () => {
it('should commit mutation SET_SHOW_LABELS', done => {
const state = {
isShowingLabels: true,
};
testAction(actions.toggleShowLabels, null, state, [{ type: types.TOGGLE_LABELS }], [], done);
testAction(
actions.setShowLabels,
false,
state,
[{ type: types.SET_SHOW_LABELS, payload: false }],
[],
done,
);
});
});
......
......@@ -8,26 +8,16 @@ const expectNotImplemented = action => {
});
};
describe('TOGGLE_LABELS', () => {
it('toggles isShowingLabels from true to false', () => {
describe('SET_SHOW_LABELS', () => {
it('updates isShowingLabels', () => {
const state = {
isShowingLabels: true,
};
mutations.TOGGLE_LABELS(state);
mutations.SET_SHOW_LABELS(state, false);
expect(state.isShowingLabels).toBe(false);
});
it('toggles isShowingLabels from false to true', () => {
const state = {
isShowingLabels: false,
};
mutations.TOGGLE_LABELS(state);
expect(state.isShowingLabels).toBe(true);
});
});
describe('SET_ACTIVE_LIST_ID', () => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment