Fix spurious loading bar middleware usage (#31592)

This commit is contained in:
Claire 2024-08-26 18:38:34 +02:00 committed by GitHub
parent 4c2534d12e
commit e38ce3beb7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 15 additions and 10 deletions

View file

@ -6,5 +6,4 @@ export const submitAccountNote = createDataLoadingThunk(
({ accountId, note }: { accountId: string; note: string }) => ({ accountId, note }: { accountId: string; note: string }) =>
apiSubmitAccountNote(accountId, note), apiSubmitAccountNote(accountId, note),
(relationship) => ({ relationship }), (relationship) => ({ relationship }),
{ skipLoading: true },
); );

View file

@ -48,8 +48,9 @@ export const loadingBarMiddleware = (
let isRejected = false; let isRejected = false;
if ( if (
isAsyncThunkAction(action) isAsyncThunkAction(action) &&
// TODO: once we get the first use-case for it, add a check for skipLoading 'useLoadingBar' in action.meta &&
action.meta.useLoadingBar
) { ) {
if (isThunkActionPending(action)) isPending = true; if (isThunkActionPending(action)) isPending = true;
else if (isThunkActionFulfilled(action)) isFulfilled = true; else if (isThunkActionFulfilled(action)) isFulfilled = true;

View file

@ -15,7 +15,7 @@ export interface AsyncThunkRejectValue {
} }
interface AppMeta { interface AppMeta {
skipLoading?: boolean; useLoadingBar?: boolean;
} }
export const createAppAsyncThunk = createAsyncThunk.withTypes<{ export const createAppAsyncThunk = createAsyncThunk.withTypes<{
@ -34,7 +34,7 @@ interface AppThunkConfig {
type AppThunkApi = Pick<GetThunkAPI<AppThunkConfig>, 'getState' | 'dispatch'>; type AppThunkApi = Pick<GetThunkAPI<AppThunkConfig>, 'getState' | 'dispatch'>;
interface AppThunkOptions { interface AppThunkOptions {
skipLoading?: boolean; useLoadingBar?: boolean;
} }
const createBaseAsyncThunk = createAsyncThunk.withTypes<AppThunkConfig>(); const createBaseAsyncThunk = createAsyncThunk.withTypes<AppThunkConfig>();
@ -54,15 +54,20 @@ export function createThunk<Arg = void, Returned = void>(
const result = await creator(arg, { dispatch, getState }); const result = await creator(arg, { dispatch, getState });
return fulfillWithValue(result, { return fulfillWithValue(result, {
skipLoading: options.skipLoading, useLoadingBar: options.useLoadingBar,
}); });
} catch (error) { } catch (error) {
return rejectWithValue({ error }, { skipLoading: true }); return rejectWithValue(
{ error },
{
useLoadingBar: options.useLoadingBar,
},
);
} }
}, },
{ {
getPendingMeta() { getPendingMeta() {
if (options.skipLoading) return { skipLoading: true }; if (options.useLoadingBar) return { useLoadingBar: true };
return {}; return {};
}, },
}, },
@ -148,7 +153,7 @@ export function createDataLoadingThunk<
* You can also omit this parameter and pass `thunkOptions` directly * You can also omit this parameter and pass `thunkOptions` directly
* @param maybeThunkOptions * @param maybeThunkOptions
* Additional Mastodon specific options for the thunk. Currently supports: * Additional Mastodon specific options for the thunk. Currently supports:
* - `skipLoading` to avoid showing the loading bar when the request is in progress * - `useLoadingBar` to display a loading bar while this action is pending. Defaults to true.
* @returns The created thunk * @returns The created thunk
*/ */
export function createDataLoadingThunk< export function createDataLoadingThunk<
@ -198,6 +203,6 @@ export function createDataLoadingThunk<
return undefined as Returned; return undefined as Returned;
else return result; else return result;
}, },
thunkOptions, { useLoadingBar: thunkOptions?.useLoadingBar ?? true },
); );
} }