Merge branch 'develop' of git.pleroma.social:pleroma/pleroma-fe into add/edit-status

src/services/api/api.service.js

@@ -52,8 +52,12 @@ const MASTODON_STATUS_CONTEXT_URL = id => `/api/v1/statuses/${id}/context`
 const MASTODON_STATUS_SOURCE_URL = id => `/api/v1/statuses/${id}/source`
 const MASTODON_STATUS_HISTORY_URL = id => `/api/v1/statuses/${id}/history`
 const MASTODON_USER_URL = '/api/v1/accounts'
+const MASTODON_USER_LOOKUP_URL = '/api/v1/accounts/lookup'
 const MASTODON_USER_RELATIONSHIPS_URL = '/api/v1/accounts/relationships'
 const MASTODON_USER_TIMELINE_URL = id => `/api/v1/accounts/${id}/statuses`
+const MASTODON_LIST_URL = id => `/api/v1/lists/${id}`
+const MASTODON_LIST_TIMELINE_URL = id => `/api/v1/timelines/list/${id}`
+const MASTODON_LIST_ACCOUNTS_URL = id => `/api/v1/lists/${id}/accounts`
 const MASTODON_TAG_TIMELINE_URL = tag => `/api/v1/timelines/tag/${tag}`
 const MASTODON_BOOKMARK_TIMELINE_URL = '/api/v1/bookmarks'
 const MASTODON_USER_BLOCKS_URL = '/api/v1/blocks/'
@@ -81,6 +85,7 @@ const MASTODON_UNMUTE_CONVERSATION = id => `/api/v1/statuses/${id}/unmute`
 const MASTODON_SEARCH_2 = '/api/v2/search'
 const MASTODON_USER_SEARCH_URL = '/api/v1/accounts/search'
 const MASTODON_DOMAIN_BLOCKS_URL = '/api/v1/domain_blocks'
+const MASTODON_LISTS_URL = '/api/v1/lists'
 const MASTODON_STREAMING = '/api/v1/streaming'
 const MASTODON_KNOWN_DOMAIN_LIST_URL = '/api/v1/instance/peers'
 const PLEROMA_EMOJI_REACTIONS_URL = id => `/api/v1/pleroma/statuses/${id}/reactions`
@@ -91,6 +96,7 @@ const PLEROMA_CHAT_URL = id => `/api/v1/pleroma/chats/by-account-id/${id}`
 const PLEROMA_CHAT_MESSAGES_URL = id => `/api/v1/pleroma/chats/${id}/messages`
 const PLEROMA_CHAT_READ_URL = id => `/api/v1/pleroma/chats/${id}/read`
 const PLEROMA_DELETE_CHAT_MESSAGE_URL = (chatId, messageId) => `/api/v1/pleroma/chats/${chatId}/messages/${messageId}`
+const PLEROMA_ADMIN_REPORTS = '/api/pleroma/admin/reports'
 const PLEROMA_BACKUP_URL = '/api/v1/pleroma/backups'
 
 const oldfetch = window.fetch
@@ -315,6 +321,25 @@ const fetchUser = ({ id, credentials }) => {
     .then((data) => parseUser(data))
 }
 
+const fetchUserByName = ({ name, credentials }) => {
+  return promisedRequest({
+    url: MASTODON_USER_LOOKUP_URL,
+    credentials,
+    params: { acct: name }
+  })
+    .then(data => data.id)
+    .catch(error => {
+      if (error && error.statusCode === 404) {
+        // Either the backend does not support lookup endpoint,
+        // or there is no user with such name. Fallback and treat name as id.
+        return name
+      } else {
+        throw error
+      }
+    })
+    .then(id => fetchUser({ id, credentials }))
+}
+
 const fetchUserRelationship = ({ id, credentials }) => {
   const url = `${MASTODON_USER_RELATIONSHIPS_URL}/?id=${id}`
   return fetch(url, { headers: authHeaders(credentials) })
@@ -387,6 +412,81 @@ const fetchFollowRequests = ({ credentials }) => {
     .then((data) => data.map(parseUser))
 }
 
+const fetchLists = ({ credentials }) => {
+  const url = MASTODON_LISTS_URL
+  return fetch(url, { headers: authHeaders(credentials) })
+    .then((data) => data.json())
+}
+
+const createList = ({ title, credentials }) => {
+  const url = MASTODON_LISTS_URL
+  const headers = authHeaders(credentials)
+  headers['Content-Type'] = 'application/json'
+
+  return fetch(url, {
+    headers,
+    method: 'POST',
+    body: JSON.stringify({ title })
+  }).then((data) => data.json())
+}
+
+const getList = ({ id, credentials }) => {
+  const url = MASTODON_LIST_URL(id)
+  return fetch(url, { headers: authHeaders(credentials) })
+    .then((data) => data.json())
+}
+
+const updateList = ({ id, title, credentials }) => {
+  const url = MASTODON_LIST_URL(id)
+  const headers = authHeaders(credentials)
+  headers['Content-Type'] = 'application/json'
+
+  return fetch(url, {
+    headers,
+    method: 'PUT',
+    body: JSON.stringify({ title })
+  })
+}
+
+const getListAccounts = ({ id, credentials }) => {
+  const url = MASTODON_LIST_ACCOUNTS_URL(id)
+  return fetch(url, { headers: authHeaders(credentials) })
+    .then((data) => data.json())
+    .then((data) => data.map(({ id }) => id))
+}
+
+const addAccountsToList = ({ id, accountIds, credentials }) => {
+  const url = MASTODON_LIST_ACCOUNTS_URL(id)
+  const headers = authHeaders(credentials)
+  headers['Content-Type'] = 'application/json'
+
+  return fetch(url, {
+    headers,
+    method: 'POST',
+    body: JSON.stringify({ account_ids: accountIds })
+  })
+}
+
+const removeAccountsFromList = ({ id, accountIds, credentials }) => {
+  const url = MASTODON_LIST_ACCOUNTS_URL(id)
+  const headers = authHeaders(credentials)
+  headers['Content-Type'] = 'application/json'
+
+  return fetch(url, {
+    headers,
+    method: 'DELETE',
+    body: JSON.stringify({ account_ids: accountIds })
+  })
+}
+
+const deleteList = ({ id, credentials }) => {
+  const url = MASTODON_LIST_URL(id)
+  return fetch(url, {
+    method: 'DELETE',
+    headers: authHeaders(credentials)
+  })
+}
+
 const fetchConversation = ({ id, credentials }) => {
   const urlContext = MASTODON_STATUS_CONTEXT_URL(id)
   return fetch(urlContext, { headers: authHeaders(credentials) })
@@ -533,9 +633,11 @@ const fetchTimeline = ({
   since = false,
   until = false,
   userId = false,
+  listId = false,
   tag = false,
   withMuted = false,
-  replyVisibility = 'all'
+  replyVisibility = 'all',
+  includeTypes = []
 }) => {
   const timelineUrls = {
     public: MASTODON_PUBLIC_TIMELINE,
@@ -545,6 +647,7 @@ const fetchTimeline = ({
     publicAndExternal: MASTODON_PUBLIC_TIMELINE,
     user: MASTODON_USER_TIMELINE_URL,
     media: MASTODON_USER_TIMELINE_URL,
+    list: MASTODON_LIST_TIMELINE_URL,
     favorites: MASTODON_USER_FAVORITES_TIMELINE_URL,
     tag: MASTODON_TAG_TIMELINE_URL,
     bookmarks: MASTODON_BOOKMARK_TIMELINE_URL
@@ -558,6 +661,10 @@ const fetchTimeline = ({
     url = url(userId)
   }
 
+  if (timeline === 'list') {
+    url = url(listId)
+  }
+
   if (since) {
     params.push(['since_id', since])
   }
@@ -582,6 +689,11 @@ const fetchTimeline = ({
   if (replyVisibility !== 'all') {
     params.push(['reply_visibility', replyVisibility])
   }
+  if (includeTypes.length > 0) {
+    includeTypes.forEach(type => {
+      params.push(['include_types[]', type])
+    })
+  }
 
   params.push(['limit', 20])
 
@@ -1417,6 +1529,38 @@ const deleteChatMessage = ({ chatId, messageId, credentials }) => {
   })
 }
 
+const setReportState = ({ id, state, credentials }) => {
+  // TODO: Can't use promisedRequest because on OK this does not return json
+  // See https://git.pleroma.social/pleroma/pleroma-fe/-/merge_requests/1322
+  return fetch(PLEROMA_ADMIN_REPORTS, {
+    headers: {
+      ...authHeaders(credentials),
+      Accept: 'application/json',
+      'Content-Type': 'application/json'
+    },
+    method: 'PATCH',
+    body: JSON.stringify({
+      reports: [{
+        id,
+        state
+      }]
+    })
+  })
+    .then(data => {
+      if (data.status >= 500) {
+        throw Error(data.statusText)
+      } else if (data.status >= 400) {
+        return data.json()
+      }
+      return data
+    })
+    .then(data => {
+      if (data.errors) {
+        throw Error(data.errors[0].message)
+      }
+    })
+}
+
 const apiService = {
   verifyCredentials,
   fetchTimeline,
@@ -1437,6 +1581,7 @@ const apiService = {
   blockUser,
   unblockUser,
   fetchUser,
+  fetchUserByName,
   fetchUserRelationship,
   favorite,
   unfavorite,
@@ -1486,6 +1631,14 @@ const apiService = {
   addBackup,
   listBackups,
   fetchFollowRequests,
+  fetchLists,
+  createList,
+  getList,
+  updateList,
+  getListAccounts,
+  addAccountsToList,
+  removeAccountsFromList,
+  deleteList,
   approveUser,
   denyUser,
   suggestions,
@@ -1511,7 +1664,8 @@ const apiService = {
   chatMessages,
   sendChatMessage,
   readChat,
-  deleteChatMessage
+  deleteChatMessage,
+  setReportState
 }
 
 export default apiService

src/services/backend_interactor_service/backend_interactor_service.js

@@ -2,10 +2,11 @@ import apiService, { getMastodonSocketURI, ProcessedWS } from '../api/api.servic
 import timelineFetcher from '../timeline_fetcher/timeline_fetcher.service.js'
 import notificationsFetcher from '../notifications_fetcher/notifications_fetcher.service.js'
 import followRequestFetcher from '../../services/follow_request_fetcher/follow_request_fetcher.service'
+import listsFetcher from '../../services/lists_fetcher/lists_fetcher.service.js'
 
 const backendInteractorService = credentials => ({
-  startFetchingTimeline ({ timeline, store, userId = false, tag }) {
-    return timelineFetcher.startFetching({ timeline, store, credentials, userId, tag })
+  startFetchingTimeline ({ timeline, store, userId = false, listId = false, tag }) {
+    return timelineFetcher.startFetching({ timeline, store, credentials, userId, listId, tag })
   },
 
   fetchTimeline (args) {
@@ -24,6 +25,10 @@ const backendInteractorService = credentials => ({
     return followRequestFetcher.startFetching({ store, credentials })
   },
 
+  startFetchingLists ({ store }) {
+    return listsFetcher.startFetching({ store, credentials })
+  },
+
   startUserSocket ({ store }) {
     const serv = store.rootState.instance.server.replace('http', 'ws')
     const url = serv + getMastodonSocketURI({ credentials, stream: 'user' })

src/services/entity_normalizer/entity_normalizer.service.js

@@ -90,6 +90,9 @@ export const parseUser = (data) => {
     output.bot = data.bot
 
     if (data.pleroma) {
+      if (data.pleroma.settings_store) {
+        output.storage = data.pleroma.settings_store['pleroma-fe']
+      }
       const relationship = data.pleroma.relationship
 
       output.background_image = data.pleroma.background_image
@@ -403,6 +406,13 @@ export const parseNotification = (data) => {
       : parseUser(data.target)
     output.from_profile = parseUser(data.account)
     output.emoji = data.emoji
+    if (data.report) {
+      output.report = data.report
+      output.report.content = data.report.content
+      output.report.acct = parseUser(data.report.account)
+      output.report.actor = parseUser(data.report.actor)
+      output.report.statuses = data.report.statuses.map(parseStatus)
+    }
   } else {
     const parsedNotice = parseStatus(data.notice)
     output.type = data.ntype

src/services/lists_fetcher/lists_fetcher.service.js

@@ -0,0 +1,22 @@
+import apiService from '../api/api.service.js'
+import { promiseInterval } from '../promise_interval/promise_interval.js'
+
+const fetchAndUpdate = ({ store, credentials }) => {
+  return apiService.fetchLists({ credentials })
+    .then(lists => {
+      store.commit('setLists', lists)
+    }, () => {})
+    .catch(() => {})
+}
+
+const startFetching = ({ credentials, store }) => {
+  const boundFetchAndUpdate = () => fetchAndUpdate({ credentials, store })
+  boundFetchAndUpdate()
+  return promiseInterval(boundFetchAndUpdate, 240000)
+}
+
+const listsFetcher = {
+  startFetching
+}
+
+export default listsFetcher

src/services/notification_utils/notification_utils.js

@@ -15,6 +15,7 @@ export const visibleTypes = store => {
     rootState.config.notificationVisibility.followRequest && 'follow_request',
     rootState.config.notificationVisibility.moves && 'move',
     rootState.config.notificationVisibility.emojiReactions && 'pleroma:emoji_reaction',
+    rootState.config.notificationVisibility.reports && 'pleroma:report',
     rootState.config.notificationVisibility.polls && 'poll'
   ].filter(_ => _))
 }
@@ -99,6 +100,9 @@ export const prepareNotificationObject = (notification, i18n) => {
     case 'follow_request':
       i18nString = 'follow_request'
       break
+    case 'pleroma:report':
+      i18nString = 'submitted_report'
+      break
     case 'poll':
       i18nString = 'poll_ended'
       break

src/services/notifications_fetcher/notifications_fetcher.service.js

@@ -1,6 +1,18 @@
 import apiService from '../api/api.service.js'
 import { promiseInterval } from '../promise_interval/promise_interval.js'
 
+// For using include_types when fetching notifications.
+// Note: chat_mention excluded as pleroma-fe polls them separately
+const mastoApiNotificationTypes = [
+  'mention',
+  'favourite',
+  'reblog',
+  'follow',
+  'move',
+  'pleroma:emoji_reaction',
+  'pleroma:report'
+]
+
 const update = ({ store, notifications, older }) => {
   store.dispatch('addNewNotifications', { notifications, older })
 }
@@ -12,6 +24,7 @@ const fetchAndUpdate = ({ store, credentials, older = false, since }) => {
   const timelineData = rootState.statuses.notifications
   const hideMutedPosts = getters.mergedConfig.hideMutedPosts
 
+  args.includeTypes = mastoApiNotificationTypes
   args.withMuted = !hideMutedPosts
 
   args.timeline = 'notifications'
@@ -63,6 +76,7 @@ const fetchNotifications = ({ store, args, older }) => {
         messageArgs: [error.message],
         timeout: 5000
       })
+      console.error(error)
     })
 }
 

src/services/push/push.js

@@ -1,4 +1,4 @@
-import runtime from 'serviceworker-webpack-plugin/lib/runtime'
+import runtime from 'serviceworker-webpack5-plugin/lib/runtime'
 
 function urlBase64ToUint8Array (base64String) {
   const padding = '='.repeat((4 - base64String.length % 4) % 4)

src/services/style_setter/style_setter.js

@@ -1,6 +1,7 @@
 import { convert } from 'chromatism'
 import { rgb2hex, hex2rgb, rgba2css, getCssColor, relativeLuminance } from '../color_convert/color_convert.js'
 import { getColors, computeDynamicColor, getOpacitySlot } from '../theme_data/theme_data.service.js'
+import { defaultState } from '../../modules/config.js'
 
 export const applyTheme = (input) => {
   const { rules } = generatePreset(input)
@@ -20,6 +21,36 @@ export const applyTheme = (input) => {
   body.classList.remove('hidden')
 }
 
+const configColumns = ({ sidebarColumnWidth, contentColumnWidth, notifsColumnWidth }) =>
+  ({ sidebarColumnWidth, contentColumnWidth, notifsColumnWidth })
+
+const defaultConfigColumns = configColumns(defaultState)
+
+export const applyConfig = (config) => {
+  const columns = configColumns(config)
+
+  if (columns === defaultConfigColumns) {
+    return
+  }
+
+  const head = document.head
+  const body = document.body
+  body.classList.add('hidden')
+
+  const rules = Object
+    .entries(columns)
+    .filter(([k, v]) => v)
+    .map(([k, v]) => `--${k}: ${v}`).join(';')
+
+  const styleEl = document.createElement('style')
+  head.appendChild(styleEl)
+  const styleSheet = styleEl.sheet
+
+  styleSheet.toString()
+  styleSheet.insertRule(`:root { ${rules} }`, 'index-max')
+  body.classList.remove('hidden')
+}
+
 export const getCssShadow = (input, usesDropShadow) => {
   if (input.length === 0) {
     return 'none'

src/services/timeline_fetcher/timeline_fetcher.service.js

@@ -3,12 +3,13 @@ import { camelCase } from 'lodash'
 import apiService from '../api/api.service.js'
 import { promiseInterval } from '../promise_interval/promise_interval.js'
 
-const update = ({ store, statuses, timeline, showImmediately, userId, pagination }) => {
+const update = ({ store, statuses, timeline, showImmediately, userId, listId, pagination }) => {
   const ccTimeline = camelCase(timeline)
 
   store.dispatch('addNewStatuses', {
     timeline: ccTimeline,
     userId,
+    listId,
     statuses,
     showImmediately,
     pagination
@@ -22,6 +23,7 @@ const fetchAndUpdate = ({
   older = false,
   showImmediately = false,
   userId = false,
+  listId = false,
   tag = false,
   until,
   since
@@ -44,6 +46,7 @@ const fetchAndUpdate = ({
   }
 
   args.userId = userId
+  args.listId = listId
   args.tag = tag
   args.withMuted = !hideMutedPosts
   if (loggedIn && ['friends', 'public', 'publicAndExternal'].includes(timeline)) {
@@ -62,7 +65,7 @@ const fetchAndUpdate = ({
       if (!older && statuses.length >= 20 && !timelineData.loading && numStatusesBeforeFetch > 0) {
         store.dispatch('queueFlush', { timeline, id: timelineData.maxId })
       }
-      update({ store, statuses, timeline, showImmediately, userId, pagination })
+      update({ store, statuses, timeline, showImmediately, userId, listId, pagination })
       return { statuses, pagination }
     })
     .catch((error) => {
@@ -75,14 +78,15 @@ const fetchAndUpdate = ({
     })
 }
 
-const startFetching = ({ timeline = 'friends', credentials, store, userId = false, tag = false }) => {
+const startFetching = ({ timeline = 'friends', credentials, store, userId = false, listId = false, tag = false }) => {
   const rootState = store.rootState || store.state
   const timelineData = rootState.statuses.timelines[camelCase(timeline)]
   const showImmediately = timelineData.visibleStatuses.length === 0
   timelineData.userId = userId
-  fetchAndUpdate({ timeline, credentials, store, showImmediately, userId, tag })
+  timelineData.listId = listId
+  fetchAndUpdate({ timeline, credentials, store, showImmediately, userId, listId, tag })
   const boundFetchAndUpdate = () =>
-    fetchAndUpdate({ timeline, credentials, store, userId, tag })
+    fetchAndUpdate({ timeline, credentials, store, userId, listId, tag })
   return promiseInterval(boundFetchAndUpdate, 10000)
 }
 const timelineFetcher = {