Merge pull request glitch-soc#2718 from ClearlyClaire/glitch-soc/merg…

…e-upstream

Merge upstream changes up to b6fd14f

app/javascript/flavours/glitch/actions/account_notes.ts

@@ -1,18 +1,10 @@
-import type { ApiRelationshipJSON } from 'flavours/glitch/api_types/relationships';
-import { createAppAsyncThunk } from 'flavours/glitch/store/typed_functions';
+import { apiSubmitAccountNote } from 'flavours/glitch/api/accounts';
+import { createDataLoadingThunk } from 'flavours/glitch/store/typed_functions';
 
-import api from '../api';
-
-export const submitAccountNote = createAppAsyncThunk(
+export const submitAccountNote = createDataLoadingThunk(
   'account_note/submit',
-  async (args: { id: string; value: string }) => {
-    const response = await api().post<ApiRelationshipJSON>(
-      `/api/v1/accounts/${args.id}/note`,
-      {
-        comment: args.value,
-      },
-    );
-
-    return { relationship: response.data };
-  },
+  ({ accountId, note }: { accountId: string; note: string }) =>
+    apiSubmitAccountNote(accountId, note),
+  (relationship) => ({ relationship }),
+  { skipLoading: true },
 );

app/javascript/flavours/glitch/actions/interactions.js

@@ -3,10 +3,6 @@ import api, { getLinks } from '../api';
 import { fetchRelationships } from './accounts';
 import { importFetchedAccounts, importFetchedStatus } from './importer';
 
-export const REBLOG_REQUEST = 'REBLOG_REQUEST';
-export const REBLOG_SUCCESS = 'REBLOG_SUCCESS';
-export const REBLOG_FAIL    = 'REBLOG_FAIL';
-
 export const REBLOGS_EXPAND_REQUEST = 'REBLOGS_EXPAND_REQUEST';
 export const REBLOGS_EXPAND_SUCCESS = 'REBLOGS_EXPAND_SUCCESS';
 export const REBLOGS_EXPAND_FAIL = 'REBLOGS_EXPAND_FAIL';
@@ -15,10 +11,6 @@ export const FAVOURITE_REQUEST = 'FAVOURITE_REQUEST';
 export const FAVOURITE_SUCCESS = 'FAVOURITE_SUCCESS';
 export const FAVOURITE_FAIL    = 'FAVOURITE_FAIL';
 
-export const UNREBLOG_REQUEST = 'UNREBLOG_REQUEST';
-export const UNREBLOG_SUCCESS = 'UNREBLOG_SUCCESS';
-export const UNREBLOG_FAIL    = 'UNREBLOG_FAIL';
-
 export const UNFAVOURITE_REQUEST = 'UNFAVOURITE_REQUEST';
 export const UNFAVOURITE_SUCCESS = 'UNFAVOURITE_SUCCESS';
 export const UNFAVOURITE_FAIL    = 'UNFAVOURITE_FAIL';
@@ -51,83 +43,7 @@ export const UNBOOKMARK_REQUEST = 'UNBOOKMARKED_REQUEST';
 export const UNBOOKMARK_SUCCESS = 'UNBOOKMARKED_SUCCESS';
 export const UNBOOKMARK_FAIL    = 'UNBOOKMARKED_FAIL';
 
-export function reblog(status, visibility) {
-  return function (dispatch) {
-    dispatch(reblogRequest(status));
-
-    api().post(`/api/v1/statuses/${status.get('id')}/reblog`, { visibility }).then(function (response) {
-      // The reblog API method returns a new status wrapped around the original. In this case we are only
-      // interested in how the original is modified, hence passing it skipping the wrapper
-      dispatch(importFetchedStatus(response.data.reblog));
-      dispatch(reblogSuccess(status));
-    }).catch(function (error) {
-      dispatch(reblogFail(status, error));
-    });
-  };
-}
-
-export function unreblog(status) {
-  return (dispatch) => {
-    dispatch(unreblogRequest(status));
-
-    api().post(`/api/v1/statuses/${status.get('id')}/unreblog`).then(response => {
-      dispatch(importFetchedStatus(response.data));
-      dispatch(unreblogSuccess(status));
-    }).catch(error => {
-      dispatch(unreblogFail(status, error));
-    });
-  };
-}
-
-export function reblogRequest(status) {
-  return {
-    type: REBLOG_REQUEST,
-    status: status,
-    skipLoading: true,
-  };
-}
-
-export function reblogSuccess(status) {
-  return {
-    type: REBLOG_SUCCESS,
-    status: status,
-    skipLoading: true,
-  };
-}
-
-export function reblogFail(status, error) {
-  return {
-    type: REBLOG_FAIL,
-    status: status,
-    error: error,
-    skipLoading: true,
-  };
-}
-
-export function unreblogRequest(status) {
-  return {
-    type: UNREBLOG_REQUEST,
-    status: status,
-    skipLoading: true,
-  };
-}
-
-export function unreblogSuccess(status) {
-  return {
-    type: UNREBLOG_SUCCESS,
-    status: status,
-    skipLoading: true,
-  };
-}
-
-export function unreblogFail(status, error) {
-  return {
-    type: UNREBLOG_FAIL,
-    status: status,
-    error: error,
-    skipLoading: true,
-  };
-}
+export * from "./interactions_typed";
 
 export function favourite(status) {
   return function (dispatch) {

app/javascript/flavours/glitch/actions/interactions_typed.ts

@@ -0,0 +1,35 @@
+import { apiReblog, apiUnreblog } from 'flavours/glitch/api/interactions';
+import type { StatusVisibility } from 'flavours/glitch/models/status';
+import { createDataLoadingThunk } from 'flavours/glitch/store/typed_functions';
+
+import { importFetchedStatus } from './importer';
+
+export const reblog = createDataLoadingThunk(
+  'status/reblog',
+  ({
+    statusId,
+    visibility,
+  }: {
+    statusId: string;
+    visibility: StatusVisibility;
+  }) => apiReblog(statusId, visibility),
+  (data, { dispatch, discardLoadData }) => {
+    // The reblog API method returns a new status wrapped around the original. In this case we are only
+    // interested in how the original is modified, hence passing it skipping the wrapper
+    dispatch(importFetchedStatus(data.reblog));
+
+    // The payload is not used in any actions
+    return discardLoadData;
+  },
+);
+
+export const unreblog = createDataLoadingThunk(
+  'status/unreblog',
+  ({ statusId }: { statusId: string }) => apiUnreblog(statusId),
+  (data, { dispatch, discardLoadData }) => {
+    dispatch(importFetchedStatus(data));
+
+    // The payload is not used in any actions
+    return discardLoadData;
+  },
+);

app/javascript/flavours/glitch/api.ts

@@ -1,4 +1,4 @@
-import type { AxiosResponse, RawAxiosRequestHeaders } from 'axios';
+import type { AxiosResponse, Method, RawAxiosRequestHeaders } from 'axios';
 import axios from 'axios';
 import LinkHeader from 'http-link-header';
 
@@ -40,11 +40,11 @@ const authorizationTokenFromInitialState = (): RawAxiosRequestHeaders => {
 };
 
 // eslint-disable-next-line import/no-default-export
-export default function api() {
+export default function api(withAuthorization = true) {
   return axios.create({
     headers: {
       ...csrfHeader,
-      ...authorizationTokenFromInitialState(),
+      ...(withAuthorization ? authorizationTokenFromInitialState() : {}),
     },
 
     transformResponse: [
@@ -58,3 +58,17 @@ export default function api() {
     ],
   });
 }
+
+export async function apiRequest<ApiResponse = unknown>(
+  method: Method,
+  url: string,
+  params?: Record<string, unknown>,
+) {
+  const { data } = await api().request<ApiResponse>({
+    method,
+    url: '/api/' + url,
+    data: params,
+  });
+
+  return data;
+}

app/javascript/flavours/glitch/api/accounts.ts

@@ -0,0 +1,7 @@
+import { apiRequest } from 'flavours/glitch/api';
+import type { ApiRelationshipJSON } from 'flavours/glitch/api_types/relationships';
+
+export const apiSubmitAccountNote = (id: string, value: string) =>
+  apiRequest<ApiRelationshipJSON>('post', `v1/accounts/${id}/note`, {
+    comment: value,
+  });

app/javascript/flavours/glitch/api/interactions.ts

@@ -0,0 +1,10 @@
+import { apiRequest } from 'flavours/glitch/api';
+import type { Status, StatusVisibility } from 'flavours/glitch/models/status';
+
+export const apiReblog = (statusId: string, visibility: StatusVisibility) =>
+  apiRequest<{ reblog: Status }>('post', `v1/statuses/${statusId}/reblog`, {
+    visibility,
+  });
+
+export const apiUnreblog = (statusId: string) =>
+  apiRequest<Status>('post', `v1/statuses/${statusId}/unreblog`);

app/javascript/flavours/glitch/components/admin/Counter.jsx

@@ -48,7 +48,7 @@ export default class Counter extends PureComponent {
   componentDidMount () {
     const { measure, start_at, end_at, params } = this.props;
 
-    api().post('/api/v1/admin/measures', { keys: [measure], start_at, end_at, [measure]: params }).then(res => {
+    api(false).post('/api/v1/admin/measures', { keys: [measure], start_at, end_at, [measure]: params }).then(res => {
       this.setState({
         loading: false,
         data: res.data,

app/javascript/flavours/glitch/components/admin/Dimension.jsx

@@ -26,7 +26,7 @@ export default class Dimension extends PureComponent {
   componentDidMount () {
     const { start_at, end_at, dimension, limit, params } = this.props;
 
-    api().post('/api/v1/admin/dimensions', { keys: [dimension], start_at, end_at, limit, [dimension]: params }).then(res => {
+    api(false).post('/api/v1/admin/dimensions', { keys: [dimension], start_at, end_at, limit, [dimension]: params }).then(res => {
       this.setState({
         loading: false,
         data: res.data,

app/javascript/flavours/glitch/components/admin/ImpactReport.jsx

@@ -27,7 +27,7 @@ export default class ImpactReport extends PureComponent {
       include_subdomains: true,
     };
 
-    api().post('/api/v1/admin/measures', {
+    api(false).post('/api/v1/admin/measures', {
       keys: ['instance_accounts', 'instance_follows', 'instance_followers'],
       start_at: null,
       end_at: null,

app/javascript/flavours/glitch/components/admin/ReportReasonSelector.jsx

@@ -105,7 +105,7 @@ class ReportReasonSelector extends PureComponent {
   };
 
   componentDidMount() {
-    api().get('/api/v1/instance').then(res => {
+    api(false).get('/api/v1/instance').then(res => {
       this.setState({
         rules: res.data.rules,
       });
@@ -122,7 +122,7 @@ class ReportReasonSelector extends PureComponent {
       return;
     }
 
-    api().put(`/api/v1/admin/reports/${id}`, {
+    api(false).put(`/api/v1/admin/reports/${id}`, {
       category,
       rule_ids: category === 'violation' ? rule_ids : [],
     }).catch(err => {

app/javascript/flavours/glitch/components/admin/Retention.jsx

@@ -34,7 +34,7 @@ export default class Retention extends PureComponent {
   componentDidMount () {
     const { start_at, end_at, frequency } = this.props;
 
-    api().post('/api/v1/admin/retention', { start_at, end_at, frequency }).then(res => {
+    api(false).post('/api/v1/admin/retention', { start_at, end_at, frequency }).then(res => {
       this.setState({
         loading: false,
         data: res.data,

app/javascript/flavours/glitch/components/admin/Trends.jsx

@@ -22,7 +22,7 @@ export default class Trends extends PureComponent {
   componentDidMount () {
     const { limit } = this.props;
 
-    api().get('/api/v1/admin/trends/tags', { params: { limit } }).then(res => {
+    api(false).get('/api/v1/admin/trends/tags', { params: { limit } }).then(res => {
       this.setState({
         loading: false,
         data: res.data,

app/javascript/flavours/glitch/containers/status_container.js

@@ -115,9 +115,9 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
 
   onModalReblog (status, privacy) {
     if (status.get('reblogged')) {
-      dispatch(unreblog(status));
+      dispatch(unreblog({ statusId: status.get('id') }));
     } else {
-      dispatch(reblog(status, privacy));
+      dispatch(reblog({ statusId: status.get('id'), visibility: privacy }));
     }
   },
 

app/javascript/flavours/glitch/features/account/containers/account_note_container.js

@@ -11,7 +11,7 @@ const mapStateToProps = (state, { account }) => ({
 const mapDispatchToProps = (dispatch, { account }) => ({
 
   onSave (value) {
-    dispatch(submitAccountNote({ id: account.get('id'), value}));
+    dispatch(submitAccountNote({ accountId: account.get('id'), note: value }));
   },
 
 });

app/javascript/flavours/glitch/features/notifications/containers/notification_container.js

@@ -36,12 +36,12 @@ const mapDispatchToProps = dispatch => ({
   },
 
   onModalReblog (status, privacy) {
-    dispatch(reblog(status, privacy));
+    dispatch(reblog({ statusId: status.get('id'), visibility: privacy }));
   },
 
   onReblog (status, e) {
     if (status.get('reblogged')) {
-      dispatch(unreblog(status));
+      dispatch(unreblog({ statusId: status.get('id') }));
     } else {
       if (e.shiftKey || !boostModal) {
         this.onModalReblog(status);

app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx

@@ -125,7 +125,7 @@ class Footer extends ImmutablePureComponent {
 
   _performReblog = (status, privacy) => {
     const { dispatch } = this.props;
-    dispatch(reblog(status, privacy));
+    dispatch(reblog({ statusId: status.get('id'), visibility: privacy }));
   };
 
   handleReblogClick = e => {
@@ -134,7 +134,7 @@ class Footer extends ImmutablePureComponent {
 
     if (signedIn) {
       if (status.get('reblogged')) {
-        dispatch(unreblog(status));
+        dispatch(unreblog({ statusId: status.get('id') }));
       } else if ((e && e.shiftKey) || !boostModal) {
         this._performReblog(status);
       } else {

app/javascript/flavours/glitch/features/status/containers/detailed_status_container.js

@@ -71,12 +71,12 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
   },
 
   onModalReblog (status, privacy) {
-    dispatch(reblog(status, privacy));
+    dispatch(reblog({ statusId: status.get('id'), visibility: privacy }));
   },
 
   onReblog (status, e) {
     if (status.get('reblogged')) {
-      dispatch(unreblog(status));
+      dispatch(unreblog({ statusId: status.get('id') }));
     } else {
       if (e.shiftKey || !boostModal) {
         this.onModalReblog(status);

app/javascript/flavours/glitch/features/status/index.jsx

@@ -346,9 +346,9 @@ class Status extends ImmutablePureComponent {
     const { dispatch } = this.props;
 
     if (status.get('reblogged')) {
-      dispatch(unreblog(status));
+      dispatch(unreblog({ statusId: status.get('id') }));
     } else {
-      dispatch(reblog(status, privacy));
+      dispatch(reblog({ statusId: status.get('id'), visibility: privacy }));
     }
   };