From f33f3a4d167010dc0f59793acaf9782bf664baa0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Robert=20Sch=C3=A4fer?= Date: Fri, 15 Mar 2019 19:56:21 +0100 Subject: [PATCH] Report/disable message shows data of the resource --- components/Comment.vue | 2 +- components/ContentMenu.vue | 7 +++--- components/Modal.spec.js | 35 ++++++++++++++++++++++++--- components/Modal.vue | 26 +++++++++++++++++--- components/Modal/DisableModal.spec.js | 27 +++++++++++---------- components/Modal/DisableModal.vue | 17 ++++++------- components/Modal/ReportModal.spec.js | 34 ++++++++++++++++++++------ components/Modal/ReportModal.vue | 17 ++++++------- components/PostCard.vue | 3 +-- locales/fr.json | 4 +-- pages/post/_slug/index.vue | 3 +-- pages/profile/_slug.vue | 3 +-- 12 files changed, 117 insertions(+), 61 deletions(-) diff --git a/components/Comment.vue b/components/Comment.vue index 3d9d6eaac..119727211 100644 --- a/components/Comment.vue +++ b/components/Comment.vue @@ -10,8 +10,8 @@ diff --git a/components/ContentMenu.vue b/components/ContentMenu.vue index 376611d44..2a63bb99b 100644 --- a/components/ContentMenu.vue +++ b/components/ContentMenu.vue @@ -52,7 +52,7 @@ export default { }, props: { placement: { type: String, default: 'top-end' }, - itemId: { type: String, required: true }, + resource: { type: Object, required: true }, isOwner: { type: Boolean, default: false }, resourceType: { type: String, @@ -72,7 +72,7 @@ export default { path: this.$router.resolve({ name: 'post-edit-id', params: { - id: this.itemId + id: this.resource.id } }).href, icon: 'edit' @@ -136,8 +136,7 @@ export default { name: dialog, data: { type: this.resourceType, - id: this.itemId, - name: this.name + resource: this.resource } }) } diff --git a/components/Modal.spec.js b/components/Modal.spec.js index b31d1d330..1ec032edb 100644 --- a/components/Modal.spec.js +++ b/components/Modal.spec.js @@ -67,8 +67,10 @@ describe('Modal.vue', () => { open: 'disable', data: { type: 'contribution', - name: 'some title', - id: 456 + resource: { + id: 'c456', + title: 'some title' + } } } wrapper = Wrapper() @@ -79,10 +81,10 @@ describe('Modal.vue', () => { }) it('passes data to disable modal', () => { - expect(wrapper.find(DisableModal).props().resource).toEqual({ + expect(wrapper.find(DisableModal).props()).toEqual({ type: 'contribution', name: 'some title', - id: 456 + id: 'c456' }) }) @@ -92,6 +94,31 @@ describe('Modal.vue', () => { expect(wrapper.contains(DisableModal)).toBe(false) }) }) + + describe('store/modal data contains a comment', () => { + it('passes author name to disable modal', () => { + state.data = { + type: 'comment', + resource: { id: 'c456', author: { name: 'Author name' } } + } + wrapper = Wrapper() + expect(wrapper.find(DisableModal).props()).toEqual({ + type: 'comment', + name: 'Author name', + id: 'c456' + }) + }) + + it('does not crash if author is undefined', () => { + state.data = { type: 'comment', resource: { id: 'c456' } } + wrapper = Wrapper() + expect(wrapper.find(DisableModal).props()).toEqual({ + type: 'comment', + name: '', + id: 'c456' + }) + }) + }) }) }) }) diff --git a/components/Modal.vue b/components/Modal.vue index 43bd7345e..0507e5439 100644 --- a/components/Modal.vue +++ b/components/Modal.vue @@ -2,12 +2,16 @@
@@ -28,7 +32,23 @@ export default { ...mapGetters({ data: 'modal/data', open: 'modal/open' - }) + }), + name() { + if (!this.data || !this.data.resource) return '' + const { + resource: { name, title, author } + } = this.data + switch (this.data.type) { + case 'user': + return name + case 'contribution': + return title + case 'comment': + return author && author.name + default: + return null + } + } }, methods: { close() { diff --git a/components/Modal/DisableModal.spec.js b/components/Modal/DisableModal.spec.js index aa6bb41af..e4debdc70 100644 --- a/components/Modal/DisableModal.spec.js +++ b/components/Modal/DisableModal.spec.js @@ -14,7 +14,11 @@ describe('DisableModal.vue', () => { let wrapper beforeEach(() => { - propsData = {} + propsData = { + type: 'contribution', + name: 'blah', + id: 'c42' + } mocks = { $filters: { truncate: a => a @@ -38,10 +42,9 @@ describe('DisableModal.vue', () => { describe('given a user', () => { beforeEach(() => { propsData = { - resource: { - type: 'user', - name: 'Bob Ross' - } + type: 'user', + id: 'u2', + name: 'Bob Ross' } }) @@ -56,10 +59,9 @@ describe('DisableModal.vue', () => { describe('given a contribution', () => { beforeEach(() => { propsData = { - resource: { - type: 'contribution', - name: 'This is some post title.' - } + type: 'contribution', + id: 'c3', + name: 'This is some post title.' } }) @@ -83,9 +85,8 @@ describe('DisableModal.vue', () => { describe('given id', () => { beforeEach(() => { propsData = { - resource: { - id: 4711 - } + type: 'user', + id: 'u4711' } }) @@ -129,7 +130,7 @@ describe('DisableModal.vue', () => { it('passes id to mutation', () => { const calls = mocks.$apollo.mutate.mock.calls const [[{ variables }]] = calls - expect(variables).toEqual({ id: 4711 }) + expect(variables).toEqual({ id: 'u4711' }) }) it('fades away', () => { diff --git a/components/Modal/DisableModal.vue b/components/Modal/DisableModal.vue index d330070a4..4ab0293cd 100644 --- a/components/Modal/DisableModal.vue +++ b/components/Modal/DisableModal.vue @@ -32,12 +32,9 @@ import gql from 'graphql-tag' export default { props: { - resource: { - type: Object, - default() { - return { id: null, type: 'contribution', name: '' } - } - } + name: { type: String, default: '' }, + type: { type: String, required: true }, + id: { type: String, required: true } }, data() { return { @@ -48,11 +45,11 @@ export default { }, computed: { title() { - return this.$t(`disable.${this.resource.type}.title`) + return this.$t(`disable.${this.type}.title`) }, message() { - const name = this.$filters.truncate(this.resource.name, 30) - return this.$t(`disable.${this.resource.type}.message`, { name }) + const name = this.$filters.truncate(this.name, 30) + return this.$t(`disable.${this.type}.message`, { name }) } }, methods: { @@ -70,7 +67,7 @@ export default { disable(id: $id) } `, - variables: { id: this.resource.id } + variables: { id: this.id } }) this.$toast.success(this.$t('disable.success')) this.isOpen = false diff --git a/components/Modal/ReportModal.spec.js b/components/Modal/ReportModal.spec.js index 50d3fbb8e..865348512 100644 --- a/components/Modal/ReportModal.spec.js +++ b/components/Modal/ReportModal.spec.js @@ -16,7 +16,10 @@ describe('ReportModal.vue', () => { let mocks beforeEach(() => { - propsData = {} + propsData = { + type: 'contribution', + id: 'c43' + } mocks = { $t: jest.fn(), $filters: { @@ -50,10 +53,9 @@ describe('ReportModal.vue', () => { describe('given a user', () => { beforeEach(() => { propsData = { - resource: { - type: 'user', - name: 'Bob Ross' - } + type: 'user', + id: 'u4', + name: 'Bob Ross' } }) @@ -64,6 +66,23 @@ describe('ReportModal.vue', () => { expect(calls).toEqual(expect.arrayContaining(expected)) }) }) + + describe('given a post', () => { + beforeEach(() => { + propsData = { + id: 'p23', + type: 'post', + name: 'It is a post' + } + }) + + it('mentions post title', () => { + Wrapper() + const calls = mocks.$t.mock.calls + const expected = [['report.post.message', { name: 'It is a post' }]] + expect(calls).toEqual(expect.arrayContaining(expected)) + }) + }) }) describe('mount', () => { @@ -80,9 +99,8 @@ describe('ReportModal.vue', () => { describe('given id', () => { beforeEach(() => { propsData = { - resource: { - id: 4711 - } + type: 'user', + id: 'u4711' } wrapper = Wrapper() }) diff --git a/components/Modal/ReportModal.vue b/components/Modal/ReportModal.vue index c41d9e63d..846fe5420 100644 --- a/components/Modal/ReportModal.vue +++ b/components/Modal/ReportModal.vue @@ -51,12 +51,9 @@ export default { SweetalertIcon }, props: { - resource: { - type: Object, - default() { - return { id: null, type: 'contribution', name: '' } - } - } + name: { type: String, default: '' }, + type: { type: String, required: true }, + id: { type: String, required: true } }, data() { return { @@ -67,11 +64,11 @@ export default { }, computed: { title() { - return this.$t(`report.${this.resource.type}.title`) + return this.$t(`report.${this.type}.title`) }, message() { - const name = this.$filters.truncate(this.resource.name, 30) - return this.$t(`report.${this.resource.type}.message`, { name }) + const name = this.$filters.truncate(this.name, 30) + return this.$t(`report.${this.type}.message`, { name }) } }, methods: { @@ -92,7 +89,7 @@ export default { } } `, - variables: { id: this.resource.id } + variables: { id: this.id } }) this.success = true this.$toast.success(this.$t('report.success')) diff --git a/components/PostCard.vue b/components/PostCard.vue index 6786d7712..11ace0a04 100644 --- a/components/PostCard.vue +++ b/components/PostCard.vue @@ -52,8 +52,7 @@ diff --git a/locales/fr.json b/locales/fr.json index 01c2614ac..bb0caaaa3 100644 --- a/locales/fr.json +++ b/locales/fr.json @@ -133,7 +133,7 @@ "comment": { "title": "Désactiver le commentaire", "type": "Commentaire", - "message": "Souhaitez-vous vraiment désactiver le commentaire de \"{nom}\" ?" + "message": "Souhaitez-vous vraiment désactiver le commentaire de \"{name}\" ?" } }, "report": { @@ -166,4 +166,4 @@ "edit": "Rédiger un commentaire", "delete": "Supprimer le commentaire" } -} \ No newline at end of file +} diff --git a/pages/post/_slug/index.vue b/pages/post/_slug/index.vue index 8fb0e514e..baf2b615b 100644 --- a/pages/post/_slug/index.vue +++ b/pages/post/_slug/index.vue @@ -14,8 +14,7 @@ diff --git a/pages/profile/_slug.vue b/pages/profile/_slug.vue index f9aecca6e..76011f456 100644 --- a/pages/profile/_slug.vue +++ b/pages/profile/_slug.vue @@ -24,8 +24,7 @@