adding a waiting text to the progressbar before the task starts

dist/styles/bootstrap-darkster.css

@@ -10104,6 +10104,12 @@ input[type=range]:-moz-focusring {
   height: 8px;
   background-color: #FFFFFF;
 }
+.mainleaf__progress-bar .b-progress-bar .progress-text {
+  color: #0F81C7;
+  font-size: 10px;
+  line-height: 8px;
+  position: absolute;
+}
 .right-handed .mainleaf__progress-bar {
   margin-left: 16px;
 }

dist/styles/bootstrap-default.css

@@ -10051,6 +10051,12 @@ input[type=range]:-moz-focusring {
   height: 8px;
   background-color: #FFFFFF;
 }
+.mainleaf__progress-bar .b-progress-bar .progress-text {
+  color: #17a2b8;
+  font-size: 10px;
+  line-height: 8px;
+  position: absolute;
+}
 .right-handed .mainleaf__progress-bar {
   margin-left: 16px;
 }

dist/styles/bootstrap-greyson.css

@@ -9813,6 +9813,12 @@ input[type=range]:-moz-focusring {
   height: 8px;
   background-color: #FFFFFF;
 }
+.mainleaf__progress-bar .b-progress-bar .progress-text {
+  color: #5c8f94;
+  font-size: 10px;
+  line-height: 8px;
+  position: absolute;
+}
 .right-handed .mainleaf__progress-bar {
   margin-left: 16px;
 }

dist/styles/bootstrap-herbie.css

@@ -10061,6 +10061,12 @@ input[type=range]:-moz-focusring {
   height: 8px;
   background-color: #FFFFFF;
 }
+.mainleaf__progress-bar .b-progress-bar .progress-text {
+  color: #74DBEF;
+  font-size: 10px;
+  line-height: 8px;
+  position: absolute;
+}
 .right-handed .mainleaf__progress-bar {
   margin-left: 16px;
 }

dist/styles/bootstrap-monotony.css

@@ -10062,6 +10062,12 @@ input[type=range]:-moz-focusring {
   height: 8px;
   background-color: #FFFFFF;
 }
+.mainleaf__progress-bar .b-progress-bar .progress-text {
+  color: #515151;
+  font-size: 10px;
+  line-height: 8px;
+  position: absolute;
+}
 .right-handed .mainleaf__progress-bar {
   margin-left: 16px;
 }

src/Gargantext/Components/Bootstrap/Block/ProgressBar.purs

@@ -10,6 +10,7 @@ import Reactix.DOM.HTML as H
 
 type Props   =
   ( value     :: Number
+  , waitingTextClass :: String
   | Options
   )
 
@@ -67,4 +68,12 @@ component = R.hooksComponent componentName cpt where
         , "aria-valuemax": "100"
         }
         []
+      ,
+        H.div
+        { className: intercalate " "
+          [ "progress-text" 
+          , props.waitingTextClass
+          ]
+        } 
+        [ H.text "Waiting task..." ]
       ]

src/Gargantext/Components/Forest/Tree/Node.purs

@@ -702,5 +702,6 @@ taskProgressCpt = here.component "progress" cpt where
         B.progressBar
         { value: asyncProgressContext
         , variant: Info
+        , waitingTextClass: if asyncProgressContext > 0.0 then "d-none" else "d-block"
         }
       ]

src/sass/_legacy/_tree.sass

@@ -266,6 +266,12 @@ $node-popup-width: 544px
       height: $progress-bar-height
       background-color: $white
 
+      .progress-text
+        color: $info
+        font-size: 10px
+        line-height: 8px
+        position: absolute
+
     @include right-handed
       margin-left: space-x(2)
     @include left-handed
@@ -284,7 +290,7 @@ $node-popup-width: 544px
   //----------------------------
 
   &--selected &
-
+    
     &__node-link::before
       content: ""
       background-color: $gray-100