Fix spurious loading bar middleware usage (#31592)

app/javascript/mastodon/actions/account_notes.ts

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

app/javascript/mastodon/store/middlewares/loading_bar.ts

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

app/javascript/mastodon/store/typed_functions.ts

@@ -15,7 +15,7 @@ export interface AsyncThunkRejectValue {
 }
 
 interface AppMeta {
-  skipLoading?: boolean;
+  useLoadingBar?: boolean;
 }
 
 export const createAppAsyncThunk = createAsyncThunk.withTypes<{
@@ -34,7 +34,7 @@ interface AppThunkConfig {
 type AppThunkApi = Pick<GetThunkAPI<AppThunkConfig>, 'getState' | 'dispatch'>;
 
 interface AppThunkOptions {
-  skipLoading?: boolean;
+  useLoadingBar?: boolean;
 }
 
 const createBaseAsyncThunk = createAsyncThunk.withTypes<AppThunkConfig>();
@@ -54,15 +54,20 @@ export function createThunk<Arg = void, Returned = void>(
         const result = await creator(arg, { dispatch, getState });
 
         return fulfillWithValue(result, {
-          skipLoading: options.skipLoading,
+          useLoadingBar: options.useLoadingBar,
         });
       } catch (error) {
-        return rejectWithValue({ error }, { skipLoading: true });
+        return rejectWithValue(
+          { error },
+          {
+            useLoadingBar: options.useLoadingBar,
+          },
+        );
       }
     },
     {
       getPendingMeta() {
-        if (options.skipLoading) return { skipLoading: true };
+        if (options.useLoadingBar) return { useLoadingBar: true };
         return {};
       },
     },
@@ -148,7 +153,7 @@ export function createDataLoadingThunk<
  *   You can also omit this parameter and pass `thunkOptions` directly
  * @param maybeThunkOptions
  *   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
  */
 export function createDataLoadingThunk<
@@ -198,6 +203,6 @@ export function createDataLoadingThunk<
         return undefined as Returned;
       else return result;
     },
-    thunkOptions,
+    { useLoadingBar: thunkOptions?.useLoadingBar ?? true },
   );
 }