diff --git a/admin/src/components/CreationFormular.spec.js b/admin/src/components/CreationFormular.spec.js index 5dba2d931..8f8cc03b0 100644 --- a/admin/src/components/CreationFormular.spec.js +++ b/admin/src/components/CreationFormular.spec.js @@ -2,14 +2,18 @@ import { mount } from '@vue/test-utils' import CreationFormular from './CreationFormular' import { adminCreateContribution } from '../graphql/adminCreateContribution' import { toastErrorSpy, toastSuccessSpy } from '../../test/testSetup' +import VueApollo from 'vue-apollo' +import { createMockClient } from 'mock-apollo-client' +import { adminOpenCreations } from '../graphql/adminOpenCreations' + +const mockClient = createMockClient() +const apolloProvider = new VueApollo({ + defaultClient: mockClient, +}) const localVue = global.localVue +localVue.use(VueApollo) -const apolloMutateMock = jest.fn().mockResolvedValue({ - data: { - adminCreateContribution: [0, 0, 0], - }, -}) const stateCommitMock = jest.fn() const mocks = { @@ -18,9 +22,6 @@ const mocks = { const date = new Date(d) return date.toISOString().split('T')[0] }), - $apollo: { - mutate: apolloMutateMock, - }, $store: { commit: stateCommitMock, }, @@ -31,7 +32,8 @@ const propsData = { creation: [], } -const now = new Date(Date.now()) +const now = new Date() + const getCreationDate = (sub) => { const date = sub === 0 ? now : new Date(now.getFullYear(), now.getMonth() - sub, 1, 0) return date.toISOString().split('T')[0] @@ -40,8 +42,43 @@ const getCreationDate = (sub) => { describe('CreationFormular', () => { let wrapper + const adminOpenCreationsMock = jest.fn() + const adminCreateContributionMock = jest.fn() + mockClient.setRequestHandler( + adminOpenCreations, + adminOpenCreationsMock.mockResolvedValue({ + data: { + adminOpenCreations: [ + { + month: new Date(now.getFullYear(), now.getMonth() - 2).getMonth(), + year: new Date(now.getFullYear(), now.getMonth() - 2).getFullYear(), + amount: '200', + }, + { + month: new Date(now.getFullYear(), now.getMonth() - 1).getMonth(), + year: new Date(now.getFullYear(), now.getMonth() - 1).getFullYear(), + amount: '400', + }, + { + month: now.getMonth(), + year: now.getFullYear(), + amount: '600', + }, + ], + }, + }), + ) + mockClient.setRequestHandler( + adminCreateContribution, + adminCreateContributionMock.mockResolvedValue({ + data: { + adminCreateContribution: [0, 0, 0], + }, + }), + ) + const Wrapper = () => { - return mount(CreationFormular, { localVue, mocks, propsData }) + return mount(CreationFormular, { localVue, mocks, propsData, apolloProvider }) } describe('mount', () => { @@ -107,17 +144,12 @@ describe('CreationFormular', () => { }) it('sends ... to apollo', () => { - expect(apolloMutateMock).toBeCalledWith( - expect.objectContaining({ - mutation: adminCreateContribution, - variables: { - email: 'benjamin@bluemchen.de', - creationDate: getCreationDate(2), - amount: 90, - memo: 'Test create coins', - }, - }), - ) + expect(adminCreateContributionMock).toBeCalledWith({ + email: 'benjamin@bluemchen.de', + creationDate: getCreationDate(2), + amount: 90, + memo: 'Test create coins', + }) }) it('emits update-user-data', () => { @@ -144,7 +176,7 @@ describe('CreationFormular', () => { describe('sendForm with server error', () => { beforeEach(async () => { - apolloMutateMock.mockRejectedValueOnce({ message: 'Ouch!' }) + adminCreateContributionMock.mockRejectedValueOnce({ message: 'Ouch!' }) await wrapper.find('.test-submit').trigger('click') }) @@ -212,7 +244,7 @@ describe('CreationFormular', () => { }) it('sends ... to apollo', () => { - expect(apolloMutateMock).toBeCalled() + expect(adminCreateContributionMock).toBeCalled() }) }) @@ -275,7 +307,7 @@ describe('CreationFormular', () => { }) it('sends mutation to apollo', () => { - expect(apolloMutateMock).toBeCalled() + expect(adminCreateContributionMock).toBeCalled() }) it('toast success message', () => { diff --git a/admin/src/components/CreationFormular.vue b/admin/src/components/CreationFormular.vue index 137b46400..df8611c3b 100644 --- a/admin/src/components/CreationFormular.vue +++ b/admin/src/components/CreationFormular.vue @@ -117,10 +117,6 @@ export default { return {} }, }, - creation: { - type: Array, - required: true, - }, }, data() { return { @@ -129,6 +125,7 @@ export default { rangeMin: 0, rangeMax: 1000, selected: '', + userId: this.item.userId, } }, methods: { @@ -136,7 +133,7 @@ export default { // do we want to reset the memo everytime the month changes? this.text = this.$t('creation_form.creation_for') + ' ' + name.short + ' ' + name.year this.rangeMin = 0 - this.rangeMax = name.creation + this.rangeMax = Number(name.creation) }, submitCreation() { this.$apollo @@ -167,6 +164,10 @@ export default { this.$refs.creationForm.reset() this.value = 0 }) + .finally(() => { + this.$apollo.queries.OpenCreations.refetch() + this.selected = '' + }) }, }, watch: { diff --git a/admin/src/components/EditCreationFormular.spec.js b/admin/src/components/EditCreationFormular.spec.js index 4a304dc79..ee0458ba2 100644 --- a/admin/src/components/EditCreationFormular.spec.js +++ b/admin/src/components/EditCreationFormular.spec.js @@ -1,19 +1,18 @@ import { mount } from '@vue/test-utils' import EditCreationFormular from './EditCreationFormular' import { toastErrorSpy, toastSuccessSpy } from '../../test/testSetup' +import VueApollo from 'vue-apollo' +import { createMockClient } from 'mock-apollo-client' +import { adminOpenCreations } from '../graphql/adminOpenCreations' +import { adminUpdateContribution } from '../graphql/adminUpdateContribution' + +const mockClient = createMockClient() +const apolloProvider = new VueApollo({ + defaultClient: mockClient, +}) const localVue = global.localVue - -const apolloMutateMock = jest.fn().mockResolvedValue({ - data: { - adminUpdateContribution: { - creation: [0, 0, 0], - amount: 500, - date: new Date(), - memo: 'Test Schöpfung 2', - }, - }, -}) +localVue.use(VueApollo) const stateCommitMock = jest.fn() @@ -23,22 +22,18 @@ const mocks = { const date = new Date(d) return date.toISOString().split('T')[0] }), - $apollo: { - mutate: apolloMutateMock, - }, $store: { commit: stateCommitMock, }, } -const now = new Date(Date.now()) +const now = new Date() const getCreationDate = (sub) => { const date = sub === 0 ? now : new Date(now.getFullYear(), now.getMonth() - sub, 1, 0) return date.toISOString().split('T')[0] } const propsData = { - creation: [200, 400, 600], creationUserData: { memo: 'Test schöpfung 1', amount: 100, @@ -46,20 +41,65 @@ const propsData = { }, item: { id: 0, - email: 'bob@baumeister.de', + amount: '300', + contributionDate: `${now.getFullYear()}-${now.getMonth() + 1}-${now.getDate()}`, }, } +const data = () => { + return { creation: ['1000', '1000', '400'] } +} + describe('EditCreationFormular', () => { let wrapper + const adminUpdateContributionMock = jest.fn() + const adminOpenCreationsMock = jest.fn() + mockClient.setRequestHandler( + adminOpenCreations, + adminOpenCreationsMock.mockResolvedValue({ + data: { + adminOpenCreations: [ + { + month: new Date(now.getFullYear(), now.getMonth() - 2).getMonth(), + year: new Date(now.getFullYear(), now.getMonth() - 2).getFullYear(), + amount: '1000', + }, + { + month: new Date(now.getFullYear(), now.getMonth() - 1).getMonth(), + year: new Date(now.getFullYear(), now.getMonth() - 1).getFullYear(), + amount: '1000', + }, + { + month: now.getMonth(), + year: now.getFullYear(), + amount: '400', + }, + ], + }, + }), + ) + mockClient.setRequestHandler( + adminUpdateContribution, + adminUpdateContributionMock.mockResolvedValue({ + data: { + adminUpdateContribution: { + amount: '600', + date: new Date(), + memo: 'This is my memo', + }, + }, + }), + ) + const Wrapper = () => { - return mount(EditCreationFormular, { localVue, mocks, propsData }) + return mount(EditCreationFormular, { localVue, mocks, propsData, data, apolloProvider }) } describe('mount', () => { - beforeEach(() => { + beforeEach(async () => { wrapper = Wrapper() + await wrapper.vm.$nextTick() }) it('has a DIV element with the class.component-edit-creation-formular', () => { @@ -89,42 +129,16 @@ describe('EditCreationFormular', () => { }) it('calls the API', () => { - expect(apolloMutateMock).toBeCalledWith( - expect.objectContaining({ - variables: { - id: 0, - email: 'bob@baumeister.de', - creationDate: getCreationDate(0), - amount: 500, - memo: 'Test Schöpfung 2', - }, - }), - ) - }) - - it('emits update-user-data', () => { - expect(wrapper.emitted('update-user-data')).toEqual([ - [ - { - id: 0, - email: 'bob@baumeister.de', - }, - [0, 0, 0], - ], - ]) + expect(adminUpdateContributionMock).toBeCalledWith({ + id: 0, + creationDate: getCreationDate(0), + amount: 500, + memo: 'Test Schöpfung 2', + }) }) it('emits update-creation-data', () => { - expect(wrapper.emitted('update-creation-data')).toEqual([ - [ - { - amount: 500, - date: expect.any(Date), - memo: 'Test Schöpfung 2', - row: expect.any(Object), - }, - ], - ]) + expect(wrapper.emitted('update-creation-data')).toBeTruthy() }) it('toasts a success message', () => { @@ -134,7 +148,7 @@ describe('EditCreationFormular', () => { describe('change and save memo and value with error', () => { beforeEach(async () => { - apolloMutateMock.mockRejectedValue({ message: 'Oh no!' }) + adminUpdateContributionMock.mockRejectedValue({ message: 'Oh no!' }) await wrapper.find('input[type="number"]').setValue(500) await wrapper.find('textarea').setValue('Test Schöpfung 2') await wrapper.find('.test-submit').trigger('click') diff --git a/admin/src/components/EditCreationFormular.vue b/admin/src/components/EditCreationFormular.vue index 084e44b87..6dbe22ebb 100644 --- a/admin/src/components/EditCreationFormular.vue +++ b/admin/src/components/EditCreationFormular.vue @@ -96,18 +96,14 @@ export default { type: Object, required: true, }, - creation: { - type: Array, - required: true, - }, }, data() { return { text: !this.creationUserData.memo ? '' : this.creationUserData.memo, value: !this.creationUserData.amount ? 0 : Number(this.creationUserData.amount), rangeMin: 0, - rangeMax: 1000, - selected: '', + selected: this.selectedComputed, + userId: this.item.userId, } }, methods: { @@ -117,20 +113,13 @@ export default { mutation: adminUpdateContribution, variables: { id: this.item.id, - email: this.item.email, creationDate: this.selected.date, amount: Number(this.value), memo: this.text, }, }) .then((result) => { - this.$emit('update-user-data', this.item, result.data.adminUpdateContribution.creation) - this.$emit('update-creation-data', { - amount: Number(result.data.adminUpdateContribution.amount), - date: result.data.adminUpdateContribution.date, - memo: result.data.adminUpdateContribution.memo, - row: this.row, - }) + this.$emit('update-creation-data') this.toastSuccess( this.$t('creation_form.toasted_update', { value: this.value, @@ -149,15 +138,29 @@ export default { // Den geschöpften Wert auf o setzen this.value = 0 }) + .finally(() => { + this.$apollo.queries.OpenCreations.refetch() + }) }, }, - created() { - if (this.creationUserData.date) { - const month = this.$d(new Date(this.creationUserData.date), 'month') - const index = this.radioOptions.findIndex((obj) => obj.item.short === month) - this.selected = this.radioOptions[index].item - this.rangeMax = Number(this.creation[index]) + Number(this.creationUserData.amount) - } + computed: { + creationIndex() { + const month = this.$d(new Date(this.item.contributionDate), 'month') + return this.radioOptions.findIndex((obj) => { + return obj.item.short === month + }) + }, + selectedComputed() { + return this.radioOptions[this.creationIndex].item + }, + rangeMax() { + return Number(this.creation[this.creationIndex]) + Number(this.item.amount) + }, + }, + watch: { + selectedComputed() { + this.selected = this.selectedComputed + }, }, } diff --git a/admin/src/components/Tables/OpenCreationsTable.spec.js b/admin/src/components/Tables/OpenCreationsTable.spec.js index 6542dab31..8f91aca03 100644 --- a/admin/src/components/Tables/OpenCreationsTable.spec.js +++ b/admin/src/components/Tables/OpenCreationsTable.spec.js @@ -5,7 +5,6 @@ const localVue = global.localVue const apolloMutateMock = jest.fn().mockResolvedValue({}) const apolloQueryMock = jest.fn().mockResolvedValue({}) -const toggleDetailsMock = jest.fn() const propsData = { items: [ @@ -17,7 +16,7 @@ const propsData = { amount: 300, memo: 'Aktives Grundeinkommen für Januar 2022', date: '2022-01-01T00:00:00.000Z', - moderator: 1, + moderatorId: 1, creation: [700, 1000, 1000], __typename: 'PendingCreation', }, @@ -29,7 +28,7 @@ const propsData = { amount: 210, memo: 'Aktives Grundeinkommen für Januar 2022', date: '2022-01-01T00:00:00.000Z', - moderator: null, + moderatorId: null, creation: [790, 1000, 1000], __typename: 'PendingCreation', }, @@ -41,7 +40,7 @@ const propsData = { amount: 330, memo: 'Aktives Grundeinkommen für Januar 2022', date: '2022-01-01T00:00:00.000Z', - moderator: 1, + moderatorId: 1, creation: [670, 1000, 1000], __typename: 'PendingCreation', }, @@ -83,7 +82,7 @@ const mocks = { $store: { state: { moderator: { - id: 0, + id: 1, name: 'test moderator', }, }, @@ -132,14 +131,6 @@ describe('OpenCreationsTable', () => { }) }) - describe('call updateUserData', () => { - it('user creations has updated data', async () => { - wrapper.vm.updateUserData(propsData.items[0], [444, 555, 666]) - await wrapper.vm.$nextTick() - expect(wrapper.vm.items[0].creation).toEqual([444, 555, 666]) - }) - }) - describe('call updateState', () => { beforeEach(() => { wrapper.vm.updateState(4) @@ -149,40 +140,5 @@ describe('OpenCreationsTable', () => { expect(wrapper.vm.$root.$emit('update-state', 4)).toBeTruthy() }) }) - - describe('call updateCreationData', () => { - const date = new Date() - beforeEach(() => { - wrapper.vm.updateCreationData({ - amount: Number(80.0), - date: date, - memo: 'Test memo', - row: { - item: {}, - detailsShowing: false, - toggleDetails: toggleDetailsMock, - }, - }) - }) - - it('emits update-state', () => { - expect( - wrapper.vm.$emit('update-contributions', { - amount: Number(80.0), - date: date, - memo: 'Test memo', - row: { - item: {}, - detailsShowing: false, - toggleDetails: toggleDetailsMock, - }, - }), - ).toBeTruthy() - }) - - it('calls toggleDetails', () => { - expect(toggleDetailsMock).toBeCalled() - }) - }) }) }) diff --git a/admin/src/components/Tables/OpenCreationsTable.vue b/admin/src/components/Tables/OpenCreationsTable.vue index a17d3a185..9d93eba60 100644 --- a/admin/src/components/Tables/OpenCreationsTable.vue +++ b/admin/src/components/Tables/OpenCreationsTable.vue @@ -27,9 +27,10 @@