Add variable for scroll loading status JC-720

apps/react/src/store/anime/selectors.ts

@@ -8,6 +8,12 @@ export const selectAnimeListLoading = createSelector(
 	isLoading => isLoading,
 );
 
+/** Select anime additional loading state. */
+export const selectAdditionalAnimeLoading = createSelector(
+	(state: RootState) => state.anime.isAdditionalLoading,
+	isAdditionalLoading => isAdditionalLoading,
+);
+
 /** Select anime error state. */
 export const selectAnimeListError = createSelector(
 	(state: RootState) => state.anime.error,

apps/react/src/store/anime/slice.ts

@@ -33,7 +33,7 @@ export const animeSlice = createSlice({
 		})
 
 		.addCase(fetchNewPage.pending, state => {
-			state.isLoading = true;
+			state.isAdditionalLoading = true;
 		})
 		.addCase(fetchNewPage.fulfilled, (state, action) => {
 			const { byId, allIds } = state.animeList;
@@ -47,12 +47,12 @@ export const animeSlice = createSlice({
 
 			state.nextPage = action.payload.next;
 			state.previousPage = action.payload.previous;
-			state.isLoading = false;
+			state.isAdditionalLoading = false;
 		})
 		.addCase(fetchNewPage.rejected, (state, action) => {
 			if (action.error.message) {
 				state.error = action.error.message;
 			}
-			state.isLoading = false;
+			state.isAdditionalLoading = false;
 		}),
 });

apps/react/src/store/anime/state.ts

@@ -19,11 +19,15 @@ export type AnimeListState = {
 
 	/** Whether the anime are loading or not. */
 	readonly isLoading: boolean;
+
+	/** Whether the new page of anime list are loading or not. */
+	readonly isAdditionalLoading: boolean;
 };
 
 /** Initial state for anime list state. */
 export const initialState: AnimeListState = {
 	isLoading: false,
+	isAdditionalLoading: false,
 	animeList: { byId: {}, allIds: [] },
 	previousPage: null,
 	nextPage: null,