Commit 01c4d41b authored by Andrew Fontaine's avatar Andrew Fontaine

Merge branch '208470_02-package-file-store' into 'master'

Geo Package Files - Fetch Data Correctly

See merge request gitlab-org/gitlab!33522
parents ba2bce61 163cb2b3
......@@ -24,9 +24,9 @@ export default {
},
},
computed: {
...mapState(['isLoading', 'totalReplicableItems']),
...mapState(['isLoading', 'paginationData']),
hasReplicableItems() {
return this.totalReplicableItems > 0;
return this.paginationData.total > 0;
},
},
created() {
......
......@@ -10,10 +10,10 @@ export default {
GeoReplicableItem,
},
computed: {
...mapState(['replicableItems', 'currentPage', 'pageSize', 'totalReplicableItems']),
...mapState(['replicableItems', 'paginationData']),
page: {
get() {
return this.currentPage;
return this.paginationData.page;
},
set(newVal) {
this.setPage(newVal);
......@@ -21,7 +21,7 @@ export default {
},
},
hasReplicableItems() {
return this.totalReplicableItems > 0;
return this.paginationData.total > 0;
},
},
methods: {
......@@ -45,8 +45,8 @@ export default {
<gl-pagination
v-if="hasReplicableItems"
v-model="page"
:per-page="pageSize"
:total-items="totalReplicableItems"
:per-page="paginationData.perPage"
:total-items="paginationData.total"
align="center"
/>
</section>
......
......@@ -3,7 +3,7 @@ import { mapActions, mapState, mapGetters } from 'vuex';
import { debounce } from 'lodash';
import { GlSearchBoxByType, GlDropdown, GlDropdownItem, GlButton } from '@gitlab/ui';
import { __, sprintf } from '~/locale';
import { DEFAULT_SEARCH_DELAY, ACTION_TYPES, FILTER_STATES } from '../store/constants';
import { DEFAULT_SEARCH_DELAY, ACTION_TYPES, FILTER_STATES } from '../constants';
export default {
name: 'GeoReplicableFilterBar',
......
......@@ -2,7 +2,7 @@
import { mapActions } from 'vuex';
import { GlLink, GlButton } from '@gitlab/ui';
import { __ } from '~/locale';
import { ACTION_TYPES } from '../store/constants';
import { ACTION_TYPES } from '../constants';
import GeoReplicableStatus from './geo_replicable_status.vue';
import GeoReplicableTimeAgo from './geo_replicable_time_ago.vue';
......
<script>
import { STATUS_ICON_NAMES, STATUS_ICON_CLASS, DEFAULT_STATUS } from '../store/constants';
import { STATUS_ICON_NAMES, STATUS_ICON_CLASS, DEFAULT_STATUS } from '../constants';
import Icon from '~/vue_shared/components/icon.vue';
export default {
......
......@@ -43,3 +43,7 @@ export const ACTION_TYPES = {
REVERIFY: 'reverify',
FORCE_REDOWNLOAD: 'force_redownload',
};
export const PREV = 'prev';
export const NEXT = 'next';
import Vue from 'vue';
import Translate from '~/vue_shared/translate';
import { parseBoolean } from '~/lib/utils/common_utils';
import createStore from './store';
import GeoReplicableApp from './components/app.vue';
......@@ -7,30 +8,21 @@ Vue.use(Translate);
export default () => {
const el = document.getElementById('js-geo-replicable');
const { replicableType } = el.dataset;
const { replicableType, geoTroubleshootingLink, geoReplicableEmptySvgPath } = el.dataset;
const useGraphQl = parseBoolean(el.dataset.graphql);
return new Vue({
el,
store: createStore(replicableType),
store: createStore({ replicableType, useGraphQl }),
components: {
GeoReplicableApp,
},
data() {
const {
dataset: { geoTroubleshootingLink, geoReplicableEmptySvgPath },
} = this.$options.el;
return {
geoTroubleshootingLink,
geoReplicableEmptySvgPath,
};
},
render(createElement) {
return createElement('geo-replicable-app', {
props: {
geoTroubleshootingLink: this.geoTroubleshootingLink,
geoReplicableEmptySvgPath: this.geoReplicableEmptySvgPath,
geoTroubleshootingLink,
geoReplicableEmptySvgPath,
},
});
},
......
......@@ -10,7 +10,7 @@ import {
import packageFilesQuery from '../graphql/package_files.query.graphql';
import { gqClient } from '../utils';
import * as types from './mutation_types';
import { FILTER_STATES } from './constants';
import { FILTER_STATES, PREV, NEXT } from '../constants';
// Fetch Replicable Items
export const requestReplicableItems = ({ commit }) => commit(types.REQUEST_REPLICABLE_ITEMS);
......@@ -25,24 +25,35 @@ export const receiveReplicableItemsError = ({ state, commit }) => {
commit(types.RECEIVE_REPLICABLE_ITEMS_ERROR);
};
export const fetchReplicableItems = ({ state, dispatch }) => {
export const fetchReplicableItems = ({ state, dispatch }, direction) => {
dispatch('requestReplicableItems');
return state.useGraphQl
? dispatch('fetchReplicableItemsGraphQl')
? dispatch('fetchReplicableItemsGraphQl', direction)
: dispatch('fetchReplicableItemsRestful');
};
export const fetchReplicableItemsGraphQl = ({ dispatch }) => {
export const fetchReplicableItemsGraphQl = ({ state, dispatch }, direction) => {
let before = '';
let after = '';
if (direction === PREV) {
before = state.paginationData.startCursor;
} else if (direction === NEXT) {
after = state.paginationData.endCursor;
}
gqClient
.query({
query: packageFilesQuery,
variables: { before, after },
})
.then(res => {
const registries = res.data.geoNode.packageFileRegistries;
const data = registries.edges.map(e => e.node);
const pagination = registries.pageInfo;
dispatch('receiveReplicableItemsSuccess', { data });
dispatch('receiveReplicableItemsSuccess', { data, pagination });
})
.catch(() => {
dispatch('receiveReplicableItemsError');
......@@ -50,12 +61,12 @@ export const fetchReplicableItemsGraphQl = ({ dispatch }) => {
};
export const fetchReplicableItemsRestful = ({ state, dispatch }) => {
const { filterOptions, currentFilterIndex, currentPage, searchFilter } = state;
const { filterOptions, currentFilterIndex, searchFilter, paginationData } = state;
const statusFilter = currentFilterIndex ? filterOptions[currentFilterIndex] : filterOptions[0];
const query = {
page: currentPage,
page: paginationData.page,
search: searchFilter || null,
sync_status: statusFilter.value === FILTER_STATES.ALL.value ? null : statusFilter.value,
};
......@@ -63,14 +74,10 @@ export const fetchReplicableItemsRestful = ({ state, dispatch }) => {
Api.getGeoReplicableItems(state.replicableType, query)
.then(res => {
const normalizedHeaders = normalizeHeaders(res.headers);
const paginationInformation = parseIntPagination(normalizedHeaders);
const camelCaseData = convertObjectPropsToCamelCase(res.data, { deep: true });
dispatch('receiveReplicableItemsSuccess', {
data: camelCaseData,
perPage: paginationInformation.perPage,
total: paginationInformation.total,
});
const pagination = parseIntPagination(normalizedHeaders);
const data = convertObjectPropsToCamelCase(res.data, { deep: true });
dispatch('receiveReplicableItemsSuccess', { data, pagination });
})
.catch(() => {
dispatch('receiveReplicableItemsError');
......
......@@ -7,11 +7,11 @@ import createState from './state';
Vue.use(Vuex);
const createStore = replicableType =>
const createStore = ({ replicableType, useGraphQl }) =>
new Vuex.Store({
actions,
getters,
mutations,
state: createState(replicableType),
state: createState({ replicableType, useGraphQl }),
});
export default createStore;
......@@ -2,30 +2,28 @@ import * as types from './mutation_types';
export default {
[types.SET_FILTER](state, filterIndex) {
state.currentPage = 1;
state.paginationData.page = 1;
state.currentFilterIndex = filterIndex;
},
[types.SET_SEARCH](state, search) {
state.currentPage = 1;
state.paginationData.page = 1;
state.searchFilter = search;
},
[types.SET_PAGE](state, page) {
state.currentPage = page;
state.paginationData.page = page;
},
[types.REQUEST_REPLICABLE_ITEMS](state) {
state.isLoading = true;
},
[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, { data, perPage, total }) {
[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, { data, pagination }) {
state.isLoading = false;
state.replicableItems = data;
state.pageSize = perPage;
state.totalReplicableItems = total;
state.paginationData = pagination;
},
[types.RECEIVE_REPLICABLE_ITEMS_ERROR](state) {
state.isLoading = false;
state.replicableItems = [];
state.pageSize = 0;
state.totalReplicableItems = 0;
state.paginationData = {};
},
[types.REQUEST_INITIATE_ALL_REPLICABLE_SYNCS](state) {
state.isLoading = true;
......
import { FILTER_STATES } from './constants';
import { FILTER_STATES } from '../constants';
const createState = replicableType => ({
const createState = ({ replicableType, useGraphQl }) => ({
replicableType,
useGraphQl: false,
useGraphQl,
isLoading: false,
replicableItems: [],
totalReplicableItems: 0,
pageSize: 0,
currentPage: 1,
paginationData: {
// GraphQL
hasNextPage: false,
hasPreviousPage: false,
startCursor: '',
endCursor: '',
// RESTful
total: 0,
perPage: 0,
page: 1,
},
searchFilter: '',
currentFilterIndex: 0,
......
......@@ -2,7 +2,7 @@ import Vuex from 'vuex';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import { GlLoadingIcon } from '@gitlab/ui';
import GeoReplicableApp from 'ee/geo_replicable/components/app.vue';
import store from 'ee/geo_replicable/store';
import createStore from 'ee/geo_replicable/store';
import GeoReplicable from 'ee/geo_replicable/components/geo_replicable.vue';
import GeoReplicableEmptyState from 'ee/geo_replicable/components/geo_replicable_empty_state.vue';
import GeoReplicableFilterBar from 'ee/geo_replicable/components/geo_replicable_filter_bar.vue';
......@@ -10,6 +10,7 @@ import {
MOCK_GEO_REPLICATION_SVG_PATH,
MOCK_GEO_TROUBLESHOOTING_LINK,
MOCK_BASIC_FETCH_DATA_MAP,
MOCK_REPLICABLE_TYPE,
} from '../mock_data';
const localVue = createLocalVue();
......@@ -31,7 +32,7 @@ describe('GeoReplicableApp', () => {
const createComponent = () => {
wrapper = shallowMount(GeoReplicableApp, {
localVue,
store,
store: createStore({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false }),
propsData,
methods: {
...actionSpies,
......@@ -90,7 +91,7 @@ describe('GeoReplicableApp', () => {
describe('with replicableItems', () => {
beforeEach(() => {
wrapper.vm.$store.state.replicableItems = MOCK_BASIC_FETCH_DATA_MAP;
wrapper.vm.$store.state.totalReplicableItems =
wrapper.vm.$store.state.paginationData.total =
wrapper.vm.$store.state.replicableItems.length;
});
......@@ -110,7 +111,7 @@ describe('GeoReplicableApp', () => {
describe('with no replicableItems', () => {
beforeEach(() => {
wrapper.vm.$store.state.replicableItems = [];
wrapper.vm.$store.state.totalReplicableItems = 0;
wrapper.vm.$store.state.paginationData.total = 0;
});
it('hides replicable items', () => {
......
......@@ -23,7 +23,7 @@ describe('GeoReplicableEmptyState', () => {
const createComponent = () => {
wrapper = shallowMount(GeoReplicableEmptyState, {
localVue,
store: createStore(MOCK_REPLICABLE_TYPE),
store: createStore({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false }),
propsData,
});
};
......
......@@ -3,7 +3,7 @@ import { createLocalVue, mount } from '@vue/test-utils';
import { GlDropdown, GlDropdownItem, GlSearchBoxByType, GlButton } from '@gitlab/ui';
import GeoReplicableFilterBar from 'ee/geo_replicable/components/geo_replicable_filter_bar.vue';
import createStore from 'ee/geo_replicable/store';
import { DEFAULT_SEARCH_DELAY } from 'ee/geo_replicable/store/constants';
import { DEFAULT_SEARCH_DELAY } from 'ee/geo_replicable/constants';
import { MOCK_REPLICABLE_TYPE } from '../mock_data';
const localVue = createLocalVue();
......@@ -22,7 +22,7 @@ describe('GeoReplicableFilterBar', () => {
const createComponent = () => {
wrapper = mount(GeoReplicableFilterBar, {
localVue,
store: createStore(MOCK_REPLICABLE_TYPE),
store: createStore({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false }),
methods: {
...actionSpies,
},
......
......@@ -2,9 +2,9 @@ import Vuex from 'vuex';
import { createLocalVue, mount } from '@vue/test-utils';
import { GlLink, GlButton } from '@gitlab/ui';
import GeoReplicableItem from 'ee/geo_replicable/components/geo_replicable_item.vue';
import store from 'ee/geo_replicable/store';
import { ACTION_TYPES } from 'ee/geo_replicable/store/constants';
import { MOCK_BASIC_FETCH_DATA_MAP } from '../mock_data';
import createStore from 'ee/geo_replicable/store';
import { ACTION_TYPES } from 'ee/geo_replicable/constants';
import { MOCK_BASIC_FETCH_DATA_MAP, MOCK_REPLICABLE_TYPE } from '../mock_data';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -29,7 +29,7 @@ describe('GeoReplicableItem', () => {
const createComponent = () => {
wrapper = mount(GeoReplicableItem, {
localVue,
store,
store: createStore({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false }),
propsData,
methods: {
...actionSpies,
......
import Vuex from 'vuex';
import { createLocalVue, mount } from '@vue/test-utils';
import { GlPagination } from '@gitlab/ui';
import store from 'ee/geo_replicable/store';
import createStore from 'ee/geo_replicable/store';
import GeoReplicable from 'ee/geo_replicable/components/geo_replicable.vue';
import GeoReplicableItem from 'ee/geo_replicable/components/geo_replicable_item.vue';
import { MOCK_BASIC_FETCH_DATA_MAP } from '../mock_data';
import { MOCK_BASIC_FETCH_DATA_MAP, MOCK_REPLICABLE_TYPE } from '../mock_data';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -20,7 +20,7 @@ describe('GeoReplicable', () => {
const createComponent = () => {
wrapper = mount(GeoReplicable, {
localVue,
store,
store: createStore({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false }),
methods: {
...actionSpies,
},
......@@ -45,10 +45,10 @@ describe('GeoReplicable', () => {
});
describe('GlPagination', () => {
describe('when pageSize >= totalReplicableItems', () => {
describe('when perPage >= total', () => {
beforeEach(() => {
wrapper.vm.$store.state.pageSize = 2;
wrapper.vm.$store.state.totalReplicableItems = 1;
wrapper.vm.$store.state.paginationData.perPage = 2;
wrapper.vm.$store.state.paginationData.total = 1;
});
it('is hidden', () => {
......@@ -56,10 +56,10 @@ describe('GeoReplicable', () => {
});
});
describe('when pageSize < totalReplicableItems', () => {
describe('when perPage < total', () => {
beforeEach(() => {
wrapper.vm.$store.state.pageSize = 1;
wrapper.vm.$store.state.totalReplicableItems = 2;
wrapper.vm.$store.state.paginationData.perPage = 1;
wrapper.vm.$store.state.paginationData.total = 2;
});
it('renders', () => {
......
import Vuex from 'vuex';
import { createLocalVue, mount } from '@vue/test-utils';
import store from 'ee/geo_replicable/store';
import createStore from 'ee/geo_replicable/store';
import GeoReplicableStatus from 'ee/geo_replicable/components/geo_replicable_status.vue';
import {
FILTER_STATES,
STATUS_ICON_NAMES,
STATUS_ICON_CLASS,
DEFAULT_STATUS,
} from 'ee/geo_replicable/store/constants';
} from 'ee/geo_replicable/constants';
import Icon from '~/vue_shared/components/icon.vue';
import { MOCK_REPLICABLE_TYPE } from '../mock_data';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -23,7 +24,7 @@ describe('GeoReplicableStatus', () => {
const createComponent = () => {
wrapper = mount(GeoReplicableStatus, {
localVue,
store,
store: createStore({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false }),
propsData,
});
};
......
import Vuex from 'vuex';
import { createLocalVue, mount } from '@vue/test-utils';
import store from 'ee/geo_replicable/store';
import createStore from 'ee/geo_replicable/store';
import GeoReplicableTimeAgo from 'ee/geo_replicable/components/geo_replicable_time_ago.vue';
import TimeAgo from '~/vue_shared/components/time_ago_tooltip.vue';
import { MOCK_REPLICABLE_TYPE } from '../mock_data';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -19,7 +20,7 @@ describe('GeoReplicableTimeAgo', () => {
const createComponent = () => {
wrapper = mount(GeoReplicableTimeAgo, {
localVue,
store,
store: createStore({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false }),
propsData,
});
};
......
......@@ -6,7 +6,7 @@ import Api from 'ee/api';
import * as actions from 'ee/geo_replicable/store/actions';
import * as types from 'ee/geo_replicable/store/mutation_types';
import createState from 'ee/geo_replicable/store/state';
import { ACTION_TYPES } from 'ee/geo_replicable/store/constants';
import { ACTION_TYPES, PREV, NEXT } from 'ee/geo_replicable/constants';
import { gqClient } from 'ee/geo_replicable/utils';
import packageFilesQuery from 'ee/geo_replicable/graphql/package_files.query.graphql';
import {
......@@ -16,6 +16,7 @@ import {
MOCK_REPLICABLE_TYPE,
MOCK_RESTFUL_PAGINATION_DATA,
MOCK_BASIC_GRAPHQL_QUERY_RESPONSE,
MOCK_GRAPHQL_PAGINATION_DATA,
} from '../mock_data';
jest.mock('~/flash');
......@@ -25,7 +26,7 @@ describe('GeoReplicable Store Actions', () => {
let state;
beforeEach(() => {
state = createState(MOCK_REPLICABLE_TYPE);
state = createState({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false });
});
describe('requestReplicableItems', () => {
......@@ -86,7 +87,10 @@ describe('GeoReplicable Store Actions', () => {
null,
state,
[],
[{ type: 'requestReplicableItems' }, { type: 'fetchReplicableItemsGraphQl' }],
[
{ type: 'requestReplicableItems' },
{ type: 'fetchReplicableItemsGraphQl', payload: null },
],
done,
);
});
......@@ -112,33 +116,92 @@ describe('GeoReplicable Store Actions', () => {
describe('fetchReplicableItemsGraphQl', () => {
describe('on success', () => {
const registries = MOCK_BASIC_GRAPHQL_QUERY_RESPONSE.geoNode?.packageFileRegistries;
const data = registries.edges.map(e => e.node);
beforeEach(() => {
jest.spyOn(gqClient, 'query').mockResolvedValue({
data: MOCK_BASIC_GRAPHQL_QUERY_RESPONSE,
});
state.paginationData = MOCK_GRAPHQL_PAGINATION_DATA;
});
it('should call gqClient with no before/after variables', () => {
testAction(
actions.fetchReplicableItemsGraphQl,
null,
state,
[],
[
{
type: 'receiveReplicableItemsSuccess',
payload: { data },
describe('with no direction set', () => {
const direction = null;
const registries = MOCK_BASIC_GRAPHQL_QUERY_RESPONSE.geoNode?.packageFileRegistries;
const data = registries.edges.map(e => e.node);
it('should call gqClient with no before/after variables', () => {
testAction(
actions.fetchReplicableItemsGraphQl,
direction,
state,
[],
[
{
type: 'receiveReplicableItemsSuccess',
payload: { data, pagination: registries.pageInfo },
},
],
() => {
expect(gqClient.query).toHaveBeenCalledWith({
query: packageFilesQuery,
variables: { before: '', after: '' },
});
},
],
() => {
expect(gqClient.query).toHaveBeenCalledWith({
query: packageFilesQuery,
});
},
);
);
});
});
describe('with direction set to "next"', () => {
const direction = NEXT;
const registries = MOCK_BASIC_GRAPHQL_QUERY_RESPONSE.geoNode?.packageFileRegistries;
const data = registries.edges.map(e => e.node);
it('should call gqClient with after variable but no before variable', () => {
testAction(
actions.fetchReplicableItemsGraphQl,
direction,
state,
[],
[
{
type: 'receiveReplicableItemsSuccess',
payload: { data, pagination: registries.pageInfo },
},
],
() => {
expect(gqClient.query).toHaveBeenCalledWith({
query: packageFilesQuery,
variables: { before: '', after: MOCK_GRAPHQL_PAGINATION_DATA.endCursor },
});
},
);
});
});
describe('with direction set to "prev"', () => {
const direction = PREV;
const registries = MOCK_BASIC_GRAPHQL_QUERY_RESPONSE.geoNode?.packageFileRegistries;
const data = registries.edges.map(e => e.node);
it('should call gqClient with before variable but no after variable', () => {
testAction(
actions.fetchReplicableItemsGraphQl,
direction,
state,
[],
[
{
type: 'receiveReplicableItemsSuccess',
payload: { data, pagination: registries.pageInfo },
},
],
() => {
expect(gqClient.query).toHaveBeenCalledWith({
query: packageFilesQuery,
variables: { before: MOCK_GRAPHQL_PAGINATION_DATA.startCursor, after: '' },
});
},
);
});
});
});
......@@ -185,11 +248,7 @@ describe('GeoReplicable Store Actions', () => {
[
{
type: 'receiveReplicableItemsSuccess',
payload: {
data: MOCK_BASIC_FETCH_DATA_MAP,
perPage: pagination.perPage,
total: pagination.total,
},
payload: { data: MOCK_BASIC_FETCH_DATA_MAP, pagination },
},
],
() => {
......@@ -204,7 +263,7 @@ describe('GeoReplicable Store Actions', () => {
describe('with params set', () => {
beforeEach(() => {
state.currentPage = 3;
state.paginationData.page = 3;
state.searchFilter = 'test search';
state.currentFilterIndex = 2;
});
......@@ -218,11 +277,7 @@ describe('GeoReplicable Store Actions', () => {
[
{
type: 'receiveReplicableItemsSuccess',
payload: {
data: MOCK_BASIC_FETCH_DATA_MAP,
perPage: pagination.perPage,
total: pagination.total,
},
payload: { data: MOCK_BASIC_FETCH_DATA_MAP, pagination },
},
],
() => {
......@@ -488,7 +543,7 @@ describe('GeoReplicable Store Actions', () => {
describe('setPage', () => {
it('should commit mutation SET_PAGE', done => {
state.currentPage = 1;
state.paginationData.page = 1;
const testValue = 2;
......
import * as getters from 'ee/geo_replicable/store/getters';
import createState from 'ee/geo_replicable/store/state';
import { MOCK_REPLICABLE_TYPE } from '../mock_data';
describe('GeoReplicable Store Getters', () => {
let state;
beforeEach(() => {
state = createState();
state = createState({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false });
});
describe('replicableTypeName', () => {
......
import mutations from 'ee/geo_replicable/store/mutations';
import createState from 'ee/geo_replicable/store/state';
import * as types from 'ee/geo_replicable/store/mutation_types';
import { MOCK_BASIC_FETCH_DATA_MAP } from '../mock_data';
import {
MOCK_BASIC_FETCH_DATA_MAP,
MOCK_REPLICABLE_TYPE,
MOCK_RESTFUL_PAGINATION_DATA,
MOCK_GRAPHQL_PAGINATION_DATA,
} from '../mock_data';
describe('GeoReplicable Store Mutations', () => {
let state;
beforeEach(() => {
state = createState();
state = createState({ replicableType: MOCK_REPLICABLE_TYPE, useGraphQl: false });
});
describe('SET_FILTER', () => {
......@@ -14,7 +19,7 @@ describe('GeoReplicable Store Mutations', () => {
beforeEach(() => {
state.currentFilterIndex = 1;
state.currentPage = 2;
state.paginationData.page = 2;
mutations[types.SET_FILTER](state, testValue);
});
......@@ -24,7 +29,7 @@ describe('GeoReplicable Store Mutations', () => {
});
it('resets the page to 1', () => {
expect(state.currentPage).toEqual(1);
expect(state.paginationData.page).toEqual(1);
});
});
......@@ -32,7 +37,7 @@ describe('GeoReplicable Store Mutations', () => {
const testValue = 'test search';
beforeEach(() => {
state.currentPage = 2;
state.paginationData.page = 2;
mutations[types.SET_SEARCH](state, testValue);
});
......@@ -42,16 +47,16 @@ describe('GeoReplicable Store Mutations', () => {
});
it('resets the page to 1', () => {
expect(state.currentPage).toEqual(1);
expect(state.paginationData.page).toEqual(1);
});
});
describe('SET_PAGE', () => {
it('sets the currentPage state key', () => {
it('sets the page state key', () => {
const testValue = 2;
mutations[types.SET_PAGE](state, testValue);
expect(state.currentPage).toEqual(testValue);
expect(state.paginationData.page).toEqual(testValue);
});
});
......@@ -64,27 +69,76 @@ describe('GeoReplicable Store Mutations', () => {
describe('RECEIVE_REPLICABLE_ITEMS_SUCCESS', () => {
let mockData = {};
let mockPaginationData = {};
beforeEach(() => {
mockData = MOCK_BASIC_FETCH_DATA_MAP;
});
describe('with RESTful pagination', () => {
beforeEach(() => {
mockData = MOCK_BASIC_FETCH_DATA_MAP;
mockPaginationData = MOCK_RESTFUL_PAGINATION_DATA;
});
it('sets isLoading to false', () => {
state.isLoading = true;
it('sets isLoading to false', () => {
state.isLoading = true;
mutations[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, mockData);
expect(state.isLoading).toEqual(false);
});
mutations[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, {
data: mockData,
pagination: mockPaginationData,
});
expect(state.isLoading).toEqual(false);
});
it('sets replicableItems array with data', () => {
mutations[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, {
data: mockData,
pagination: mockPaginationData,
});
expect(state.replicableItems).toBe(mockData);
});
it('sets replicableItems array with data', () => {
mutations[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, mockData);
expect(state.replicableItems).toBe(mockData.data);
it('sets perPage and total', () => {
mutations[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, {
data: mockData,
pagination: mockPaginationData,
});
expect(state.paginationData.perPage).toEqual(mockPaginationData.perPage);
expect(state.paginationData.total).toEqual(mockPaginationData.total);
});
});
it('sets pageSize and totalReplicableItems', () => {
mutations[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, mockData);
expect(state.pageSize).toEqual(mockData.perPage);
expect(state.totalReplicableItems).toEqual(mockData.total);
describe('with GraphQL pagination', () => {
beforeEach(() => {
mockData = MOCK_BASIC_FETCH_DATA_MAP;
mockPaginationData = MOCK_GRAPHQL_PAGINATION_DATA;
});
it('sets isLoading to false', () => {
state.isLoading = true;
mutations[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, {
data: mockData,
pagination: mockPaginationData,
});
expect(state.isLoading).toEqual(false);
});
it('sets replicableItems array with data', () => {
mutations[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, {
data: mockData,
pagination: mockPaginationData,
});
expect(state.replicableItems).toBe(mockData);
});
it('sets hasNextPage, hasPreviousPage, startCursor, and endCursor', () => {
mutations[types.RECEIVE_REPLICABLE_ITEMS_SUCCESS](state, {
data: mockData,
pagination: mockPaginationData,
});
expect(state.paginationData.hasNextPage).toEqual(mockPaginationData.hasNextPage);
expect(state.paginationData.hasPreviousPage).toEqual(mockPaginationData.hasPreviousPage);
expect(state.paginationData.startCursor).toEqual(mockPaginationData.startCursor);
expect(state.paginationData.endCursor).toEqual(mockPaginationData.endCursor);
});
});
});
......@@ -110,12 +164,8 @@ describe('GeoReplicable Store Mutations', () => {
});
it('resets pagination data', () => {
state.pageSize = mockData.perPage;
state.totalReplicableItems = mockData.total;
mutations[types.RECEIVE_REPLICABLE_ITEMS_ERROR](state);
expect(state.pageSize).toEqual(0);
expect(state.totalReplicableItems).toEqual(0);
expect(state.paginationData).toEqual({});
});
});
......
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