loading bar logic and example

app/pages/PageEnigma/PageEnigmaComponent.tsx

@@ -77,7 +77,6 @@ export const PageEnigmaComponent = () => {
                   message={appUiState.showEditorLoadingBar.message}
                   label={appUiState.showEditorLoadingBar.label}
                   progress={appUiState.showEditorLoadingBar.progress}
-                  useFakeTimer={30000}
                 />
               </div>
               

app/pages/PageEnigma/comps/ControlsTopButtons/ControlsTopButtons.tsx

@@ -27,15 +27,38 @@ export const ControlsTopButtons = () => {
 
   const handleButtonTest = () => {
     if(appUiState?.showEditorLoadingBar.isShowing){
+      //TO GO TO A HUNDRED AND DISAPPER
       dispatchAppUiState({
-        type: APPUI_ACTION_TYPES.HIDE_EDITOR_LOADINGBAR,
+        type: APPUI_ACTION_TYPES.UPDATE_EDITOR_LOADINGBAR,
+        payload:{
+          showEditorLoadingBar: {
+            progress: 100,
+          }
+        }
       });
+      setTimeout(() => {
+        dispatchAppUiState({
+          type: APPUI_ACTION_TYPES.HIDE_EDITOR_LOADINGBAR,
+        });
+      }, 1000);
+       //END :TO GO TO A HUNDRED AND DISAPPER
+
+       //EAMPLE OF CHANING LOADING MESSAGE
+      //  dispatchAppUiState({
+      //   type: APPUI_ACTION_TYPES.UPDATE_EDITOR_LOADINGBAR,
+      //   payload:{
+      //     showEditorLoadingBar: {
+      //       message: "new message",
+      //     }
+      //   }
+      // });
     }else{
       dispatchAppUiState({
         type: APPUI_ACTION_TYPES.SHOW_EDITOR_LOADINGBAR,
         payload:{
           showEditorLoadingBar: {
-            message: 'display of LoadingBar triggered by Test Button'
+            message: 'display of LoadingBar triggered by Test Button',
+            progress: 10,
           }
         }
         

app/pages/PageEnigma/reducers/appUiReducer/reducer.tsx

@@ -29,6 +29,15 @@ export function reducer(state: State, action: Action): State {
         },
       }
     }
+    case ACTION_TYPES.UPDATE_EDITOR_LOADINGBAR:{
+      return{
+        ...state,
+        showEditorLoadingBar: {
+          ...state.showEditorLoadingBar,
+          ...action.payload?.showEditorLoadingBar,
+        },
+      }
+    }
     case ACTION_TYPES.HIDE_EDITOR_LOADINGBAR:{
       return{
         ...state,

app/pages/PageEnigma/reducers/appUiReducer/types.tsx

@@ -28,6 +28,7 @@ export enum ACTION_TYPES {
   SHOW_EDITOR_LOADER = "show_editor_loader",
   HIDE_EDITOR_LOADER = "hide_editor_loader",
   SHOW_EDITOR_LOADINGBAR = "show_editor_loadingbar",
+  UPDATE_EDITOR_LOADINGBAR = "update_editor_loadingbar",
   HIDE_EDITOR_LOADINGBAR = "hide_editor_loadingbar",
 };
 
@@ -49,7 +50,17 @@ export type Action =
           label?: string;
           message?: string;
           progress?: number;
-          useFake?: boolean;
+          useFakeTimer?: number;
+        }
+      }
+    }
+  | {
+      type: ACTION_TYPES.UPDATE_EDITOR_LOADINGBAR,
+      payload:{
+        showEditorLoadingBar: {
+          label?: string;
+          message?: string;
+          progress?: number;
         }
       }
     }