From c9e9b62955a3fa26fcdc9a0d28d9b96f6af9baa0 Mon Sep 17 00:00:00 2001 From: Angelina Filippova Date: Wed, 25 Sep 2019 19:08:43 +0300 Subject: [PATCH 01/56] Extract dropdown for moderating users into separate component and rename timeline item to report --- .../components/ModerateUserDropdown.vue | 86 +++++++++++++++++++ .../{TimelineItem.vue => Report.vue} | 74 +--------------- src/views/reports/index.vue | 70 +++++++++++---- test/views/reports/timelineItem.test.js | 16 ++-- 4 files changed, 153 insertions(+), 93 deletions(-) create mode 100644 src/views/reports/components/ModerateUserDropdown.vue rename src/views/reports/components/{TimelineItem.vue => Report.vue} (57%) diff --git a/src/views/reports/components/ModerateUserDropdown.vue b/src/views/reports/components/ModerateUserDropdown.vue new file mode 100644 index 00000000..141b2afe --- /dev/null +++ b/src/views/reports/components/ModerateUserDropdown.vue @@ -0,0 +1,86 @@ + + + diff --git a/src/views/reports/components/TimelineItem.vue b/src/views/reports/components/Report.vue similarity index 57% rename from src/views/reports/components/TimelineItem.vue rename to src/views/reports/components/Report.vue index 771298aa..6d07aded 100644 --- a/src/views/reports/components/TimelineItem.vue +++ b/src/views/reports/components/Report.vue @@ -16,60 +16,7 @@ {{ $t('reports.close') }} - - {{ $t('reports.moderateUser') }} - - - {{ report.account.deactivated ? $t('users.activateAccount') : $t('users.deactivateAccount') }} - - - {{ $t('users.deleteAccount') }} - - - {{ $t('users.forceNsfw') }} - - - - {{ $t('users.stripMedia') }} - - - - {{ $t('users.forceUnlisted') }} - - - - {{ $t('users.sandbox') }} - - - - {{ $t('users.disableRemoteSubscription') }} - - - - {{ $t('users.disableAnySubscription') }} - - - - +
@@ -112,10 +59,11 @@ @@ -56,9 +87,14 @@ export default { padding: 0px; } .filter-container { + display: flex; + flex-direction: column; margin: 22px 15px 22px 15px; padding-bottom: 0 } + .group-reports-checkbox { + margin-top: 10px; + } h1 { margin: 22px 0 0 15px; } @@ -78,9 +114,13 @@ only screen and (max-width: 760px), .filter-container { margin: 0 10px } - .timeline { - margin: 20px 20px 20px 18px - } + } + #app > div > div.main-container > section > div > div.block > ul { + margin: 45px 45px 5px 19px; + } + .reports-pagination { + margin: 25px 0; + text-align: center; } } diff --git a/test/views/reports/timelineItem.test.js b/test/views/reports/timelineItem.test.js index 6e3b9f01..5582732c 100644 --- a/test/views/reports/timelineItem.test.js +++ b/test/views/reports/timelineItem.test.js @@ -1,7 +1,7 @@ import Vuex from 'vuex' import { mount, createLocalVue, config } from '@vue/test-utils' import Element from 'element-ui' -import TimelineItem from '@/views/reports/components/TimelineItem' +import Report from '@/views/reports/components/Report' import storeConfig from './store.conf' import { cloneDeep } from 'lodash' import flushPromises from 'flush-promises' @@ -25,7 +25,7 @@ describe('Report in a timeline', () => { it('changes report state from open to resolved', async (done) => { const report = store.state.reports.fetchedReports[0] - const wrapper = mount(TimelineItem, { + const wrapper = mount(Report, { store, localVue, propsData: { @@ -43,7 +43,7 @@ describe('Report in a timeline', () => { it('changes report state from open to closed', async (done) => { const report = store.state.reports.fetchedReports[3] - const wrapper = mount(TimelineItem, { + const wrapper = mount(Report, { store, localVue, propsData: { @@ -61,7 +61,7 @@ describe('Report in a timeline', () => { it('shows statuses', () => { const report = store.state.reports.fetchedReports[4] - const wrapper = mount(TimelineItem, { + const wrapper = mount(Report, { store, localVue, propsData: { @@ -75,7 +75,7 @@ describe('Report in a timeline', () => { it('adds sensitive flag to a status', async (done) => { const report = store.state.reports.fetchedReports[4] - const wrapper = mount(TimelineItem, { + const wrapper = mount(Report, { store, localVue, propsData: { @@ -93,7 +93,7 @@ describe('Report in a timeline', () => { it('removes sensitive flag to a status', async (done) => { const report = store.state.reports.fetchedReports[4] - const wrapper = mount(TimelineItem, { + const wrapper = mount(Report, { store, localVue, propsData: { @@ -111,7 +111,7 @@ describe('Report in a timeline', () => { it('changes status visibility from public to unlisted', async (done) => { const report = store.state.reports.fetchedReports[4] - const wrapper = mount(TimelineItem, { + const wrapper = mount(Report, { store, localVue, propsData: { @@ -129,7 +129,7 @@ describe('Report in a timeline', () => { it('changes status visibility from unlisted to private', async (done) => { const report = store.state.reports.fetchedReports[4] - const wrapper = mount(TimelineItem, { + const wrapper = mount(Report, { store, localVue, propsData: { From 6ccffd97283b4d50b2cc5f8d54c53cd858a4d2f0 Mon Sep 17 00:00:00 2001 From: Angelina Filippova Date: Sat, 28 Sep 2019 01:24:51 +0300 Subject: [PATCH 02/56] Fetch reports after changing and deleting status --- src/store/modules/reports.js | 26 ++++------------- src/views/reports/components/Report.vue | 7 ++++- src/views/reports/components/Statuses.vue | 35 +++++++++++------------ 3 files changed, 27 insertions(+), 41 deletions(-) diff --git a/src/store/modules/reports.js b/src/store/modules/reports.js index a699a22a..8ff3a909 100644 --- a/src/store/modules/reports.js +++ b/src/store/modules/reports.js @@ -28,33 +28,17 @@ const reports = { const updatedReports = state.fetchedReports.map(report => report.id === reportId ? data : report) commit('SET_REPORTS', updatedReports) }, - async ChangeStatusScope({ commit, getters, state }, { statusId, isSensitive, visibility, reportId }) { - const { data } = await changeStatusScope(statusId, isSensitive, visibility, getters.authHost, getters.token) - const updatedReports = state.fetchedReports.map(report => { - if (report.id === reportId) { - const statuses = report.statuses.map(status => status.id === statusId ? data : status) - return { ...report, statuses } - } else { - return report - } - }) - commit('SET_REPORTS', updatedReports) + async ChangeStatusScope({ dispatch, getters }, { statusId, isSensitive, visibility }) { + await changeStatusScope(statusId, isSensitive, visibility, getters.authHost, getters.token) + dispatch('FetchReports') }, ClearFetchedReports({ commit }) { commit('SET_REPORTS', []) commit('SET_LAST_REPORT_ID', '') }, - async DeleteStatus({ commit, getters, state }, { statusId, reportId }) { + async DeleteStatus({ dispatch, getters }, { statusId }) { deleteStatus(statusId, getters.authHost, getters.token) - const updatedReports = state.fetchedReports.map(report => { - if (report.id === reportId) { - const statuses = report.statuses.filter(status => status.id !== statusId) - return { ...report, statuses } - } else { - return report - } - }) - commit('SET_REPORTS', updatedReports) + dispatch('FetchReports') }, async FetchReports({ commit, getters, state }) { commit('SET_LOADING', true) diff --git a/src/views/reports/components/Report.vue b/src/views/reports/components/Report.vue index 6d07aded..418284d3 100644 --- a/src/views/reports/components/Report.vue +++ b/src/views/reports/components/Report.vue @@ -49,7 +49,9 @@
- + + +
@@ -87,6 +89,9 @@ export default { return 'primary' } }, + getStatusesTitle(statuses) { + return `Reported statuses: ${statuses.length} item(s)` + }, parseTimestamp(timestamp) { return moment(timestamp).format('L HH:mm') } diff --git a/src/views/reports/components/Statuses.vue b/src/views/reports/components/Statuses.vue index a385a700..c276af90 100644 --- a/src/views/reports/components/Statuses.vue +++ b/src/views/reports/components/Statuses.vue @@ -1,6 +1,6 @@ + + diff --git a/src/views/reports/components/ReportCard.vue b/src/views/reports/components/ReportCard.vue new file mode 100644 index 00000000..62fa1945 --- /dev/null +++ b/src/views/reports/components/ReportCard.vue @@ -0,0 +1,89 @@ + + + + + diff --git a/src/views/reports/index.vue b/src/views/reports/index.vue index 928e2b2f..f35ab2e3 100644 --- a/src/views/reports/index.vue +++ b/src/views/reports/index.vue @@ -3,12 +3,15 @@

{{ $t('reports.reports') }}

- + Group reports by statuses
- + + + +
@@ -29,14 +32,181 @@ @@ -274,6 +265,10 @@ export default { } } +.reports-pagination { + margin: 25px 0; + text-align: center; +} @media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) { @@ -288,9 +283,5 @@ only screen and (max-width: 760px), #app > div > div.main-container > section > div > div.block > ul { margin: 45px 45px 5px 19px; } - .reports-pagination { - margin: 25px 0; - text-align: center; - } } From a0667c1f4552614ca9d968f1a7fcfd4e1d1cfb85 Mon Sep 17 00:00:00 2001 From: Angelina Filippova Date: Mon, 30 Sep 2019 00:22:01 +0300 Subject: [PATCH 08/56] Move report rendering and its pagination inside report component --- src/store/modules/reports.js | 4 +- .../reports/components/GroupedReport.vue | 102 +++++------ src/views/reports/components/Report.vue | 161 +++++++++++------- src/views/reports/index.vue | 38 +---- 4 files changed, 158 insertions(+), 147 deletions(-) diff --git a/src/store/modules/reports.js b/src/store/modules/reports.js index 5d1cdb69..9922f465 100644 --- a/src/store/modules/reports.js +++ b/src/store/modules/reports.js @@ -5,8 +5,8 @@ const reports = { fetchedReports: [], totalReportsCount: 0, currentPage: 1, - pageSize: 1, - groupReports: true, + pageSize: 50, + groupReports: false, stateFilter: '', loading: true }, diff --git a/src/views/reports/components/GroupedReport.vue b/src/views/reports/components/GroupedReport.vue index 1e6cc8fa..f304a87d 100644 --- a/src/views/reports/components/GroupedReport.vue +++ b/src/views/reports/components/GroupedReport.vue @@ -1,55 +1,57 @@ - - diff --git a/src/views/status/Status.vue b/src/views/status/Status.vue new file mode 100644 index 00000000..74bb3881 --- /dev/null +++ b/src/views/status/Status.vue @@ -0,0 +1,171 @@ + + + + + From 2ea990f0743a012e1b334beca14f73b1d8420827 Mon Sep 17 00:00:00 2001 From: Angelina Filippova Date: Fri, 4 Oct 2019 00:20:48 +0300 Subject: [PATCH 12/56] Add module for status --- src/api/reports.js | 19 ------------------- src/api/status.js | 24 ++++++++++++++++++++++++ src/store/index.js | 2 ++ src/store/modules/reports.js | 10 +--------- src/store/modules/status.js | 16 ++++++++++++++++ 5 files changed, 43 insertions(+), 28 deletions(-) create mode 100644 src/api/status.js create mode 100644 src/store/modules/status.js diff --git a/src/api/reports.js b/src/api/reports.js index 9bad8f86..073f84ad 100644 --- a/src/api/reports.js +++ b/src/api/reports.js @@ -12,25 +12,6 @@ export async function changeState(state, id, authHost, token) { }) } -export async function changeStatusScope(id, sensitive, visibility, authHost, token) { - return await request({ - baseURL: baseName(authHost), - url: `/api/pleroma/admin/statuses/${id}`, - method: 'put', - headers: authHeaders(token), - data: { sensitive, visibility } - }) -} - -export async function deleteStatus(id, authHost, token) { - return await request({ - baseURL: baseName(authHost), - url: `/api/pleroma/admin/statuses/${id}`, - method: 'delete', - headers: authHeaders(token) - }) -} - export async function fetchReports(filter, page, pageSize, authHost, token) { const url = filter.length > 0 ? `/api/pleroma/admin/reports?state=${filter}&page=${page}&page_size=${pageSize}` diff --git a/src/api/status.js b/src/api/status.js new file mode 100644 index 00000000..7d931ae0 --- /dev/null +++ b/src/api/status.js @@ -0,0 +1,24 @@ +import request from '@/utils/request' +import { getToken } from '@/utils/auth' +import { baseName } from './utils' + +export async function changeStatusScope(id, sensitive, visibility, authHost, token) { + return await request({ + baseURL: baseName(authHost), + url: `/api/pleroma/admin/statuses/${id}`, + method: 'put', + headers: authHeaders(token), + data: { sensitive, visibility } + }) +} + +export async function deleteStatus(id, authHost, token) { + return await request({ + baseURL: baseName(authHost), + url: `/api/pleroma/admin/statuses/${id}`, + method: 'delete', + headers: authHeaders(token) + }) +} + +const authHeaders = (token) => token ? { 'Authorization': `Bearer ${getToken()}` } : {} diff --git a/src/store/index.js b/src/store/index.js index 830c0788..9a3cad50 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -6,6 +6,7 @@ import invites from './modules/invites' import permission from './modules/permission' import reports from './modules/reports' import settings from './modules/settings' +import status from './modules/status' import tagsView from './modules/tagsView' import user from './modules/user' import userProfile from './modules/userProfile' @@ -23,6 +24,7 @@ const store = new Vuex.Store({ permission, reports, settings, + status, tagsView, user, userProfile, diff --git a/src/store/modules/reports.js b/src/store/modules/reports.js index 9922f465..8e3d2c4f 100644 --- a/src/store/modules/reports.js +++ b/src/store/modules/reports.js @@ -1,4 +1,4 @@ -import { changeState, changeStatusScope, deleteStatus, fetchReports } from '@/api/reports' +import { changeState, fetchReports } from '@/api/reports' const reports = { state: { @@ -38,18 +38,10 @@ const reports = { await changeState(reportState, reportId, getters.authHost, getters.token) dispatch('FetchReports', state.currentPage) }, - async ChangeStatusScope({ dispatch, getters, state }, { statusId, isSensitive, visibility }) { - await changeStatusScope(statusId, isSensitive, visibility, getters.authHost, getters.token) - dispatch('FetchReports', state.currentPage) - }, ClearFetchedReports({ commit }) { commit('SET_REPORTS', []) commit('SET_LAST_REPORT_ID', '') }, - async DeleteStatus({ dispatch, getters, state }, { statusId }) { - await deleteStatus(statusId, getters.authHost, getters.token) - dispatch('FetchReports', state.currentPage) - }, async FetchReports({ commit, getters, state }, page) { commit('SET_LOADING', true) const { data } = await fetchReports(state.stateFilter, page, state.pageSize, getters.authHost, getters.token) diff --git a/src/store/modules/status.js b/src/store/modules/status.js new file mode 100644 index 00000000..a287f94b --- /dev/null +++ b/src/store/modules/status.js @@ -0,0 +1,16 @@ +import { changeStatusScope, deleteStatus } from '@/api/status' + +const status = { + actions: { + async ChangeStatusScope({ dispatch, getters, state }, { statusId, isSensitive, visibility }) { + await changeStatusScope(statusId, isSensitive, visibility, getters.authHost, getters.token) + dispatch('FetchReports', state.currentPage) + }, + async DeleteStatus({ dispatch, getters, state }, { statusId }) { + await deleteStatus(statusId, getters.authHost, getters.token) + dispatch('FetchReports', state.currentPage) + } + } +} + +export default status From f5c088dc1a7ef1df935b15cc310378c1a2686087 Mon Sep 17 00:00:00 2001 From: Angelina Filippova Date: Fri, 4 Oct 2019 00:45:21 +0300 Subject: [PATCH 13/56] Add ability to display media attachments, polls and statuses with hidden content --- src/views/status/Status.vue | 169 ++++++++++++++++++++++++------------ src/views/users/show.vue | 34 ++------ 2 files changed, 118 insertions(+), 85 deletions(-) diff --git a/src/views/status/Status.vue b/src/views/status/Status.vue index 74bb3881..e79b5a80 100644 --- a/src/views/status/Status.vue +++ b/src/views/status/Status.vue @@ -54,7 +54,40 @@
- +
+ {{ status.spoiler_text }} + Show more + Show less +
+ +
+
    +
  • + {{ option.title }} + +
    • +
+
+
+ +
+
+ +
+
+ +
+
    +
  • + {{ option.title }} + +
    • +
+
+
+ +
+
@@ -66,13 +99,18 @@ import moment from 'moment' export default { - name: 'Statuses', + name: 'Status', props: { status: { type: Object, required: true } }, + data() { + return { + showHiddenStatus: false + } + }, methods: { capitalizeFirstLetter(str) { return str.charAt(0).toUpperCase() + str.slice(1) @@ -98,6 +136,13 @@ export default { }) }) }, + optionPercent(poll, pollOption) { + const allVotes = poll.options.reduce((acc, option) => (acc + option.votes_count), 0) + if (allVotes === 0) { + return 0 + } + return +(pollOption.votes_count / allVotes * 100).toFixed(1) + }, parseTimestamp(timestamp) { return moment(timestamp).format('YYYY-MM-DD HH:mm') } @@ -106,66 +151,78 @@ export default { diff --git a/src/views/users/show.vue b/src/views/users/show.vue index 049ae02f..829f7ebd 100644 --- a/src/views/users/show.vue +++ b/src/views/users/show.vue @@ -70,22 +70,8 @@ - - - {{ status.spoiler_text }} -

-

-
    -
  • - {{ option.title }} - -
    • -
-
-
- -
- + + @@ -94,8 +80,11 @@
diff --git a/src/components/Tinymce/components/editorImage.vue b/src/components/Tinymce/components/editorImage.vue deleted file mode 100644 index 93b211d0..00000000 --- a/src/components/Tinymce/components/editorImage.vue +++ /dev/null @@ -1,103 +0,0 @@ - - - - - diff --git a/src/components/Tinymce/index.vue b/src/components/Tinymce/index.vue deleted file mode 100644 index d9f81acc..00000000 --- a/src/components/Tinymce/index.vue +++ /dev/null @@ -1,210 +0,0 @@ -