refactor: revert deletion of isShowProcessing

Author: bra-i-am

src/studio-home/StudioHome.tsx

@@ -35,6 +35,7 @@ const StudioHome = () => {
     isLoadingPage,
     isFailedLoadingPage,
     studioHomeData,
+    isShowProcessing,
     anyQueryIsFailed,
     isShowEmailStaff,
     anyQueryIsPending,
@@ -150,6 +151,7 @@ const StudioHome = () => {
             <TabsSection
               showNewCourseContainer={showNewCourseContainer}
               onClickNewCourse={() => setShowNewCourseContainer(true)}
+              isShowProcessing={isShowProcessing && !isFiltered}
               librariesV1Enabled={librariesV1Enabled}
               librariesV2Enabled={librariesV2Enabled}
             />

src/studio-home/tabs-section/courses-tab/index.test.tsx

@@ -13,6 +13,7 @@ import CoursesTab from '.';
 import { studioHomeCoursesRequestParamsDefault } from '../../data/slice';
 
 const onClickNewCourse = jest.fn();
+const isShowProcessing = false;
 const isLoading = false;
 const isFailed = false;
 const numPages = 1;
@@ -40,6 +41,7 @@ const renderComponent = (overrideProps = {}, studioHomeState = {}) => {
             coursesDataItems={studioHomeMock.courses}
             showNewCourseContainer={showNewCourseContainer}
             onClickNewCourse={onClickNewCourse}
+            isShowProcessing={isShowProcessing}
             isLoading={isLoading}
             isFailed={isFailed}
             numPages={numPages}
@@ -102,7 +104,7 @@ describe('<CoursesTab />', () => {
   });
 
   it('should render CollapsibleStateWithAction when courseCreatorStatus is true', () => {
-    const props = { isEnabledPagination: false };
+    const props = { isShowProcessing: true, isEnabledPagination: false };
     const customStoreData = {
       studioHomeData: {
         inProcessCourseActions: [],

src/studio-home/tabs-section/courses-tab/index.tsx

@@ -19,6 +19,7 @@ import CardItem from '../../card-item';
 import CollapsibleStateWithAction from '../../collapsible-state-with-action';
 import ContactAdministrator from './contact-administrator';
 import CoursesFilters from './courses-filters';
+import ProcessingCourses from '../../processing-courses';
 import { LoadingSpinner } from '../../../generic/Loading';
 import AlertMessage from '../../../generic/alert-message';
 import messages from '../messages';
@@ -37,6 +38,7 @@ interface Props {
   }[];
   showNewCourseContainer: boolean;
   onClickNewCourse: () => void;
+  isShowProcessing: boolean;
   isLoading: boolean;
   isFailed: boolean;
   numPages: number;
@@ -47,6 +49,7 @@ const CoursesTab: React.FC<Props> = ({
   coursesDataItems,
   showNewCourseContainer,
   onClickNewCourse,
+  isShowProcessing,
   isLoading,
   isFailed,
   numPages = 0,
@@ -118,6 +121,7 @@ const CoursesTab: React.FC<Props> = ({
     ) : (
       <div className="courses-tab-container">
         <div className="d-flex flex-row align-items-center justify-content-between my-4">
+          {isShowProcessing && <ProcessingCourses />}
           <CoursesFilters dispatch={dispatch} locationValue={locationValue} isLoading={isLoading} />
           <p data-testid="pagination-info" className="my-0">
             {intl.formatMessage(messages.coursesPaginationInfo, {

src/studio-home/tabs-section/index.tsx

@@ -22,6 +22,7 @@ import { fetchLibraryData } from '../data/thunks';
 const TabsSection = ({
   showNewCourseContainer,
   onClickNewCourse,
+  isShowProcessing,
   librariesV1Enabled,
   librariesV2Enabled,
 }) => {
@@ -91,6 +92,7 @@ const TabsSection = ({
           coursesDataItems={courses}
           showNewCourseContainer={showNewCourseContainer}
           onClickNewCourse={onClickNewCourse}
+          isShowProcessing={isShowProcessing}
           isLoading={isLoadingCourses}
           isFailed={isFailedCoursesPage}
           numPages={numPages}
@@ -178,6 +180,7 @@ const TabsSection = ({
 TabsSection.propTypes = {
   showNewCourseContainer: PropTypes.bool.isRequired,
   onClickNewCourse: PropTypes.func.isRequired,
+  isShowProcessing: PropTypes.bool.isRequired,
   librariesV1Enabled: PropTypes.bool,
   librariesV2Enabled: PropTypes.bool,
 };