Commit 03820e9b authored by Phil Hughes's avatar Phil Hughes

fetch both created & assigned

show badges for both

[ci skip]
parent 0b278a93
......@@ -38,6 +38,7 @@ export default {
data() {
return {
showTooltip: false,
showMergeRequestsDropdown: false,
};
},
computed: {
......@@ -67,6 +68,23 @@ export default {
this.showTooltip = this.$refs.branchId.scrollWidth > this.$refs.branchId.offsetWidth;
});
},
showMergeRequestsDropdown() {
if (this.showMergeRequestsDropdown) {
document.addEventListener('click', this.hideMergeRequestDropdown);
} else {
document.removeEventListener('click', this.hideMergeRequestDropdown);
}
},
},
methods: {
hideMergeRequestDropdown(e) {
if (this.$refs.mergeRequestDropdown.contains(e.target)) return;
this.showMergeRequestsDropdown = false;
},
toggleMergeRequestDropdown() {
this.showMergeRequestsDropdown = !this.showMergeRequestsDropdown;
},
},
};
</script>
......@@ -91,12 +109,17 @@ export default {
</div>
</template>
<template v-else>
<div class="context-header ide-context-header dropdown">
<div
class="context-header ide-context-header dropdown"
:class="{
show: showMergeRequestsDropdown
}"
ref="mergeRequestDropdown"
>
<a
href="#"
role="button"
@click.prevent
data-toggle="dropdown"
@click.prevent="toggleMergeRequestDropdown"
>
<div
v-if="currentProject.avatar_url"
......@@ -148,7 +171,10 @@ export default {
name="chevron-down"
/>
</a>
<merge-request-dropdown />
<merge-request-dropdown
v-if="showMergeRequestsDropdown"
@hide="toggleMergeRequestDropdown"
/>
</div>
<div class="multi-file-commit-panel-inner-scroll">
<component
......
<script>
import { mapActions, mapState } from 'vuex';
import { mapGetters, mapState } from 'vuex';
import Tabs from '../../../vue_shared/components/tabs/tabs';
import Tab from '../../../vue_shared/components/tabs/tab.vue';
import List from './list.vue';
import { scopes } from '../../stores/modules/merge_requests/constants';
export default {
components: {
......@@ -11,28 +10,16 @@ export default {
Tab,
List,
},
data() {
return {
activeTabIndex: 0,
};
},
computed: {
...mapState('mergeRequests', ['isLoading', 'mergeRequests']),
...mapGetters('mergeRequests', ['assignedData', 'createdData']),
...mapState(['currentMergeRequestId']),
tabScope() {
return this.activeTabIndex === 0 ? scopes.createdByMe : scopes.assignedToMe;
createdMergeRequestLength() {
return this.createdData.mergeRequests.length;
},
},
mounted() {
this.fetchMergeRequests();
},
methods: {
...mapActions('mergeRequests', ['fetchMergeRequests', 'setScope']),
updateActiveTab(index) {
this.activeTabIndex = index;
this.setScope(this.tabScope);
this.fetchMergeRequests();
hideDropdown() {
this.$emit('hide');
},
},
};
......@@ -40,31 +27,33 @@ export default {
<template>
<div class="dropdown-menu ide-merge-requests-dropdown">
<tabs
stop-propagation
@changed="updateActiveTab"
>
<tab
:title="__('Created by me')"
active
>
<tabs stop-propagation>
<tab active>
<template slot="title">
{{ __('Created by me') }}
<span class="badge badge-pill">
{{ createdMergeRequestLength }}
</span>
</template>
<list
v-if="activeTabIndex === 0"
:is-loading="isLoading"
:items="mergeRequests"
type="created"
:current-id="currentMergeRequestId"
:empty-text="__('You have not created any merge requests')"
@search="fetchMergeRequests"
@hide="hideDropdown"
/>
</tab>
<tab :title="__('Assigned to me')">
<tab>
<template slot="title">
{{ __('Assigned to me') }}
<span class="badge badge-pill">
{{ assignedData.mergeRequests.length }}
</span>
</template>
<list
v-if="activeTabIndex === 1"
:is-loading="isLoading"
:items="mergeRequests"
type="assigned"
:current-id="currentMergeRequestId"
:empty-text="__('You do not have any assigned merge requests')"
@search="fetchMergeRequests"
@hide="hideDropdown"
/>
</tab>
</tabs>
......
<script>
import { mapActions, mapGetters } from 'vuex';
import _ from 'underscore';
import LoadingIcon from '../../../vue_shared/components/loading_icon.vue';
import Item from './item.vue';
......@@ -9,12 +10,8 @@ export default {
Item,
},
props: {
isLoading: {
type: Boolean,
required: true,
},
items: {
type: Array,
type: {
type: String,
required: true,
},
currentId: {
......@@ -32,24 +29,41 @@ export default {
};
},
computed: {
...mapGetters('mergeRequests', ['getData']),
data() {
return this.getData(this.type);
},
isLoading() {
return this.data.isLoading;
},
mergeRequests() {
return this.data.mergeRequests;
},
hasMergeRequests() {
return this.items.length !== 0;
return this.mergeRequests.length !== 0;
},
hasNoSearchResults() {
return this.search !== '' && !this.hasMergeRequests;
},
},
watch: {
isLoading() {
this.focusSearch();
},
mounted() {
this.loadMergeRequests();
},
methods: {
...mapActions('mergeRequests', ['fetchMergeRequests']),
...mapActions(['closeAllFiles']),
loadMergeRequests() {
this.fetchMergeRequests({ type: this.type, search: this.search });
},
viewMergeRequest(item) {
this.$router.push(`/project/${item.projectPathWithNamespace}/merge_requests/${item.iid}`);
return this.closeAllFiles()
.then(() => {
this.$emit('hide');
this.$router.push(`/project/${item.projectPathWithNamespace}/merge_requests/${item.iid}`);
});
},
searchMergeRequests: _.debounce(function debounceSearch() {
this.$emit('search', this.search);
this.loadMergeRequests();
}, 250),
focusSearch() {
if (!this.isLoading) {
......@@ -88,7 +102,7 @@ export default {
<ul class="mb-3">
<template v-if="hasMergeRequests">
<li
v-for="item in items"
v-for="item in mergeRequests"
:key="item.id"
>
<item
......@@ -103,7 +117,7 @@ export default {
class="ide-merge-requests-empty d-flex align-items-center justify-content-center"
>
<template v-if="hasNoSearchResults">
No merge requests found
{{ __('No merge requests found') }}
</template>
<template v-else>
{{ emptyText }}
......
......@@ -17,9 +17,7 @@ export const getMergeRequestData = (
mergeRequestId,
mergeRequest: data,
});
if (!state.currentMergeRequestId) {
commit(types.SET_CURRENT_MERGE_REQUEST, mergeRequestId);
}
commit(types.SET_CURRENT_MERGE_REQUEST, mergeRequestId);
resolve(data);
})
.catch(() => {
......
import { __ } from '../../../../locale';
import Api from '../../../../api';
import flash from '../../../../flash';
import { scopes } from './constants';
import * as types from './mutation_types';
export const requestMergeRequests = ({ commit }) => commit(types.REQUEST_MERGE_REQUESTS);
export const receiveMergeRequestsError = ({ commit }) => {
export const requestMergeRequests = ({ commit }, type) =>
commit(types.REQUEST_MERGE_REQUESTS, type);
export const receiveMergeRequestsError = ({ commit }, type) => {
flash(__('Error loading merge requests.'));
commit(types.RECEIVE_MERGE_REQUESTS_ERROR);
commit(types.RECEIVE_MERGE_REQUESTS_ERROR, type);
};
export const receiveMergeRequestsSuccess = ({ commit }, data) =>
commit(types.RECEIVE_MERGE_REQUESTS_SUCCESS, data);
export const receiveMergeRequestsSuccess = ({ commit }, { type, data }) =>
commit(types.RECEIVE_MERGE_REQUESTS_SUCCESS, { type, data });
export const fetchMergeRequests = ({ dispatch, state: { scope, state } }, search = '') => {
dispatch('requestMergeRequests');
dispatch('resetMergeRequests');
export const fetchMergeRequests = ({ dispatch, state: { state } }, { type, search = '' }) => {
const scope = scopes[type];
dispatch('requestMergeRequests', type);
dispatch('resetMergeRequests', type);
Api.mergeRequests({ scope, state, search })
.then(({ data }) => dispatch('receiveMergeRequestsSuccess', data))
.catch(() => dispatch('receiveMergeRequestsError'));
.then(({ data }) => dispatch('receiveMergeRequestsSuccess', { type, data }))
.catch(() => dispatch('receiveMergeRequestsError', type));
};
export const resetMergeRequests = ({ commit }) => commit(types.RESET_MERGE_REQUESTS);
export const setScope = ({ commit }, scope) => commit(types.SET_SCOPE, scope);
export const resetMergeRequests = ({ commit }, type) => commit(types.RESET_MERGE_REQUESTS, type);
export default () => {};
export const scopes = {
assignedToMe: 'assigned-to-me',
createdByMe: 'created-by-me',
assigned: 'assigned-to-me',
created: 'created-by-me',
};
export const states = {
......
export const getData = state => type => state[type];
export const assignedData = state => state.assigned;
export const createdData = state => state.created;
import state from './state';
import * as actions from './actions';
import * as getters from './getters';
import mutations from './mutations';
export default {
......@@ -7,4 +8,5 @@ export default {
state: state(),
actions,
mutations,
getters,
};
......@@ -3,5 +3,3 @@ export const RECEIVE_MERGE_REQUESTS_ERROR = 'RECEIVE_MERGE_REQUESTS_ERROR';
export const RECEIVE_MERGE_REQUESTS_SUCCESS = 'RECEIVE_MERGE_REQUESTS_SUCCESS';
export const RESET_MERGE_REQUESTS = 'RESET_MERGE_REQUESTS';
export const SET_SCOPE = 'SET_SCOPE';
......@@ -2,15 +2,15 @@
import * as types from './mutation_types';
export default {
[types.REQUEST_MERGE_REQUESTS](state) {
state.isLoading = true;
[types.REQUEST_MERGE_REQUESTS](state, type) {
state[type].isLoading = true;
},
[types.RECEIVE_MERGE_REQUESTS_ERROR](state) {
state.isLoading = false;
[types.RECEIVE_MERGE_REQUESTS_ERROR](state, type) {
state[type].isLoading = false;
},
[types.RECEIVE_MERGE_REQUESTS_SUCCESS](state, data) {
state.isLoading = false;
state.mergeRequests = data.map(mergeRequest => ({
[types.RECEIVE_MERGE_REQUESTS_SUCCESS](state, { type, data }) {
state[type].isLoading = false;
state[type].mergeRequests = data.map(mergeRequest => ({
id: mergeRequest.id,
iid: mergeRequest.iid,
title: mergeRequest.title,
......@@ -20,10 +20,7 @@ export default {
.replace(`/merge_requests/${mergeRequest.iid}`, ''),
}));
},
[types.RESET_MERGE_REQUESTS](state) {
state.mergeRequests = [];
},
[types.SET_SCOPE](state, scope) {
state.scope = scope;
[types.RESET_MERGE_REQUESTS](state, type) {
state[type].mergeRequests = [];
},
};
import { scopes, states } from './constants';
import { states } from './constants';
export default () => ({
isLoading: false,
mergeRequests: [],
scope: scopes.createdByMe,
created: {
isLoading: false,
mergeRequests: [],
},
assigned: {
isLoading: false,
mergeRequests: [],
},
state: states.opened,
});
......@@ -26,6 +26,9 @@ export default {
created() {
this.isTab = true;
},
updated() {
this.$parent.$forceUpdate();
},
};
</script>
......
......@@ -29,8 +29,6 @@ export default {
this.tabs[index].localActive = true;
this.currentIndex = index;
this.$emit('changed', this.currentIndex);
},
},
render(h) {
......
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