From ab0a206d43a70abc9cd76932e6ffd6f5cedc14f6 Mon Sep 17 00:00:00 2001 From: Echo Date: Fri, 8 Aug 2025 10:44:05 +0200 Subject: [PATCH] [Glitch] Update Redux to handle quote posts Port 8ee4b3f906c52bad2e2a899e17047235376a8d83 to glitch-soc Signed-off-by: Claire --- .../flavours/glitch/actions/compose.js | 2 + .../flavours/glitch/actions/compose_typed.ts | 34 +++++- .../flavours/glitch/api_types/quotes.ts | 23 ++++ .../flavours/glitch/api_types/statuses.ts | 2 + .../flavours/glitch/reducers/compose.js | 23 +++- .../flavours/glitch/store/typed_functions.ts | 106 ++++++++++++++++-- 6 files changed, 178 insertions(+), 12 deletions(-) create mode 100644 app/javascript/flavours/glitch/api_types/quotes.ts diff --git a/app/javascript/flavours/glitch/actions/compose.js b/app/javascript/flavours/glitch/actions/compose.js index 3b4b704626..047ecbd552 100644 --- a/app/javascript/flavours/glitch/actions/compose.js +++ b/app/javascript/flavours/glitch/actions/compose.js @@ -246,6 +246,8 @@ export function submitCompose(overridePrivacy = null) { visibility: overridePrivacy || getState().getIn(['compose', 'privacy']), poll: getState().getIn(['compose', 'poll'], null), language: getState().getIn(['compose', 'language']), + quoted_status_id: getState().getIn(['compose', 'quoted_status_id']), + quote_approval_policy: getState().getIn(['compose', 'quote_policy']), }, headers: { 'Idempotency-Key': getState().getIn(['compose', 'idempotencyKey']), diff --git a/app/javascript/flavours/glitch/actions/compose_typed.ts b/app/javascript/flavours/glitch/actions/compose_typed.ts index 70be8abcd2..eb09a92615 100644 --- a/app/javascript/flavours/glitch/actions/compose_typed.ts +++ b/app/javascript/flavours/glitch/actions/compose_typed.ts @@ -1,9 +1,18 @@ +import { createAction } from '@reduxjs/toolkit'; import type { List as ImmutableList, Map as ImmutableMap } from 'immutable'; import { apiUpdateMedia } from 'flavours/glitch/api/compose'; import type { ApiMediaAttachmentJSON } from 'flavours/glitch/api_types/media_attachments'; import type { MediaAttachment } from 'flavours/glitch/models/media_attachment'; -import { createDataLoadingThunk } from 'flavours/glitch/store/typed_functions'; +import { + createDataLoadingThunk, + createAppThunk, +} from 'flavours/glitch/store/typed_functions'; + +import type { ApiQuotePolicy } from '../api_types/quotes'; +import type { Status } from '../models/status'; + +import { ensureComposeIsVisible } from './compose'; type SimulatedMediaAttachmentJSON = ApiMediaAttachmentJSON & { unattached?: boolean; @@ -68,3 +77,26 @@ export const changeUploadCompose = createDataLoadingThunk( useLoadingBar: false, }, ); + +export const quoteComposeByStatus = createAppThunk( + 'compose/quoteComposeStatus', + (status: Status, { getState }) => { + ensureComposeIsVisible(getState); + return status; + }, +); + +export const quoteComposeById = createAppThunk( + (statusId: string, { dispatch, getState }) => { + const status = getState().statuses.get(statusId); + if (status) { + dispatch(quoteComposeByStatus(status)); + } + }, +); + +export const quoteComposeCancel = createAction('compose/quoteComposeCancel'); + +export const setQuotePolicy = createAction( + 'compose/setQuotePolicy', +); diff --git a/app/javascript/flavours/glitch/api_types/quotes.ts b/app/javascript/flavours/glitch/api_types/quotes.ts new file mode 100644 index 0000000000..8c0ea10fc3 --- /dev/null +++ b/app/javascript/flavours/glitch/api_types/quotes.ts @@ -0,0 +1,23 @@ +import type { ApiStatusJSON } from './statuses'; + +export type ApiQuoteState = 'accepted' | 'pending' | 'revoked' | 'unauthorized'; +export type ApiQuotePolicy = 'public' | 'followers' | 'nobody'; + +interface ApiQuoteEmptyJSON { + state: Exclude; + quoted_status: null; +} + +interface ApiNestedQuoteJSON { + state: 'accepted'; + quoted_status_id: string; +} + +interface ApiQuoteAcceptedJSON { + state: 'accepted'; + quoted_status: Omit & { + quote: ApiNestedQuoteJSON | ApiQuoteEmptyJSON; + }; +} + +export type ApiQuoteJSON = ApiQuoteAcceptedJSON | ApiQuoteEmptyJSON; diff --git a/app/javascript/flavours/glitch/api_types/statuses.ts b/app/javascript/flavours/glitch/api_types/statuses.ts index fcdcef1c70..85357a13a4 100644 --- a/app/javascript/flavours/glitch/api_types/statuses.ts +++ b/app/javascript/flavours/glitch/api_types/statuses.ts @@ -4,6 +4,7 @@ import type { ApiAccountJSON } from './accounts'; import type { ApiCustomEmojiJSON } from './custom_emoji'; import type { ApiMediaAttachmentJSON } from './media_attachments'; import type { ApiPollJSON } from './polls'; +import type { ApiQuoteJSON } from './quotes'; // See app/modals/status.rb export type StatusVisibility = @@ -118,6 +119,7 @@ export interface ApiStatusJSON { card?: ApiPreviewCardJSON; poll?: ApiPollJSON; + quote?: ApiQuoteJSON; // glitch-soc additions local_only?: boolean; diff --git a/app/javascript/flavours/glitch/reducers/compose.js b/app/javascript/flavours/glitch/reducers/compose.js index df55788134..bf4fe9a4f8 100644 --- a/app/javascript/flavours/glitch/reducers/compose.js +++ b/app/javascript/flavours/glitch/reducers/compose.js @@ -1,6 +1,11 @@ import { Map as ImmutableMap, List as ImmutableList, OrderedSet as ImmutableOrderedSet, fromJS } from 'immutable'; -import { changeUploadCompose } from 'flavours/glitch/actions/compose_typed'; +import { + changeUploadCompose, + quoteComposeByStatus, + quoteComposeCancel, + setQuotePolicy, +} from 'flavours/glitch/actions/compose_typed'; import { timelineDelete } from 'flavours/glitch/actions/timelines_typed'; import { @@ -109,6 +114,11 @@ const initialState = ImmutableMap({ adaptiveStroke: true, smoothing: false, }), + + // Quotes + quoted_status_id: null, + quote_policy: 'public', + default_quote_policy: 'public', // Set in hydration. }); const initialPoll = ImmutableMap({ @@ -169,6 +179,8 @@ function clearAll(state) { map.set('progress', 0); map.set('poll', null); map.set('idempotencyKey', uuid()); + map.set('quoted_status_id', null); + map.set('quote_policy', state.get('default_quote_policy')); }); } @@ -393,6 +405,15 @@ export const composeReducer = (state = initialState, action) => { return state.set('is_changing_upload', true); } else if (changeUploadCompose.rejected.match(action)) { return state.set('is_changing_upload', false); + } else if (quoteComposeByStatus.match(action)) { + const status = action.payload; + if (status.getIn(['quote_approval', 'current_user']) === 'automatic') { + return state.set('quoted_status_id', status.get('id')); + } + } else if (quoteComposeCancel.match(action)) { + return state.set('quoted_status_id', null); + } else if (setQuotePolicy.match(action)) { + return state.set('quote_policy', action.payload); } switch(action.type) { diff --git a/app/javascript/flavours/glitch/store/typed_functions.ts b/app/javascript/flavours/glitch/store/typed_functions.ts index f0a18a0681..69f6028be2 100644 --- a/app/javascript/flavours/glitch/store/typed_functions.ts +++ b/app/javascript/flavours/glitch/store/typed_functions.ts @@ -1,5 +1,12 @@ -import type { GetThunkAPI } from '@reduxjs/toolkit'; -import { createAsyncThunk, createSelector } from '@reduxjs/toolkit'; +import type { + ActionCreatorWithPreparedPayload, + GetThunkAPI, +} from '@reduxjs/toolkit'; +import { + createAsyncThunk as rtkCreateAsyncThunk, + createSelector, + createAction, +} from '@reduxjs/toolkit'; // eslint-disable-next-line @typescript-eslint/no-restricted-imports import { useDispatch, useSelector } from 'react-redux'; @@ -18,7 +25,7 @@ interface AppMeta { useLoadingBar?: boolean; } -export const createAppAsyncThunk = createAsyncThunk.withTypes<{ +export const createAppAsyncThunk = rtkCreateAsyncThunk.withTypes<{ state: RootState; dispatch: AppDispatch; rejectValue: AsyncThunkRejectValue; @@ -43,9 +50,88 @@ interface AppThunkOptions { ) => boolean; } -const createBaseAsyncThunk = createAsyncThunk.withTypes(); +// Type definitions for the sync thunks. +type AppThunk = ( + arg: Arg, +) => (dispatch: AppDispatch, getState: () => RootState) => Returned; -export function createThunk( +type AppThunkCreator = ( + arg: Arg, + api: AppThunkApi, + extra?: ExtraArg, +) => Returned; + +type AppThunkActionCreator< + Arg = void, + Returned = void, +> = ActionCreatorWithPreparedPayload< + [Returned, Arg], + Returned, + string, + never, + { arg: Arg } +>; + +// Version that does not dispatch it's own action. +export function createAppThunk( + creator: AppThunkCreator, + extra?: ExtraArg, +): AppThunk; + +// Version that dispatches an named action with the result of the creator callback. +export function createAppThunk( + name: string, + creator: AppThunkCreator, + extra?: ExtraArg, +): AppThunk & AppThunkActionCreator; + +/** Creates a thunk that dispatches an action. */ +export function createAppThunk( + nameOrCreator: string | AppThunkCreator, + maybeCreatorOrExtra?: AppThunkCreator | ExtraArg, + maybeExtra?: ExtraArg, +) { + const isDispatcher = typeof nameOrCreator === 'string'; + const name = isDispatcher ? nameOrCreator : undefined; + const creator = isDispatcher + ? (maybeCreatorOrExtra as AppThunkCreator) + : nameOrCreator; + const extra = isDispatcher ? maybeExtra : (maybeCreatorOrExtra as ExtraArg); + let action: null | AppThunkActionCreator = null; + + // Creates a thunk that dispatches the action with the result of the creator. + const actionCreator: AppThunk = (arg) => { + return (dispatch, getState) => { + const result = creator(arg, { dispatch, getState }, extra); + if (action) { + // Dispatches the action with the result. + const actionObj = action(result, arg); + dispatch(actionObj); + } + return result; + }; + }; + + // No action name provided, return the thunk directly. + if (!name) { + return actionCreator; + } + + // Create the action and assign the action creator to it in order + // to have things like `toString` and `match` available. + action = createAction(name, (payload: Returned, arg: Arg) => ({ + payload, + meta: { + arg, + }, + })); + + return Object.assign({}, action, actionCreator); +} + +const createBaseAsyncThunk = rtkCreateAsyncThunk.withTypes(); + +export function createAsyncThunk( name: string, creator: (arg: Arg, api: AppThunkApi) => Returned | Promise, options: AppThunkOptions = {}, @@ -104,7 +190,7 @@ export function createDataLoadingThunk( name: string, loadData: (args: Args) => Promise, thunkOptions?: AppThunkOptions, -): ReturnType>; +): ReturnType>; // Overload when the `onData` method returns discardLoadDataInPayload, then the payload is empty export function createDataLoadingThunk( @@ -114,7 +200,7 @@ export function createDataLoadingThunk( | AppThunkOptions | OnData, thunkOptions?: AppThunkOptions, -): ReturnType>; +): ReturnType>; // Overload when the `onData` method returns nothing, then the mayload is the `onData` result export function createDataLoadingThunk( @@ -124,7 +210,7 @@ export function createDataLoadingThunk( | AppThunkOptions | OnData, thunkOptions?: AppThunkOptions, -): ReturnType>; +): ReturnType>; // Overload when there is an `onData` method returning something export function createDataLoadingThunk< @@ -138,7 +224,7 @@ export function createDataLoadingThunk< | AppThunkOptions | OnData, thunkOptions?: AppThunkOptions, -): ReturnType>; +): ReturnType>; /** * This function creates a Redux Thunk that handles loading data asynchronously (usually from the API), dispatching `pending`, `fullfilled` and `rejected` actions. @@ -189,7 +275,7 @@ export function createDataLoadingThunk< thunkOptions = maybeThunkOptions; } - return createThunk( + return createAsyncThunk( name, async (arg, { getState, dispatch }) => { const data = await loadData(arg, {