Commit ffe273a8 authored by Przemyslaw Kaminski's avatar Przemyslaw Kaminski Committed by Alexandre Delanoë

[Tree] progress bar first draft, renders dummy values for now

parent e4634284
...@@ -14,6 +14,7 @@ import Gargantext.Ends (Frontends) ...@@ -14,6 +14,7 @@ import Gargantext.Ends (Frontends)
import Gargantext.Components.Loader (loader) import Gargantext.Components.Loader (loader)
import Gargantext.Routes (AppRoute) import Gargantext.Routes (AppRoute)
import Gargantext.Sessions (Session) import Gargantext.Sessions (Session)
import Gargantext.Types (AsyncTask(..))
import Prelude (Unit, bind, discard, map, pure, void, ($), (+), (<>)) import Prelude (Unit, bind, discard, map, pure, void, ($), (+), (<>))
import Reactix as R import Reactix as R
import Reactix.DOM.HTML as H import Reactix.DOM.HTML as H
...@@ -55,7 +56,7 @@ loadedTreeView reload p = R.createElement el p [] ...@@ -55,7 +56,7 @@ loadedTreeView reload p = R.createElement el p []
where where
el = R.hooksComponent "LoadedTreeView" cpt el = R.hooksComponent "LoadedTreeView" cpt
cpt {tree, mCurrentRoute, session, frontends} _ = do cpt {tree, mCurrentRoute, session, frontends} _ = do
treeState <- R.useState' {tree, asyncTasks: []} treeState <- R.useState' {tree, asyncTasks: [AsyncTask {id: "1hello", status: "pending"}]}
pure $ H.div {className: "tree"} pure $ H.div {className: "tree"}
[ toHtml reload treeState session frontends mCurrentRoute ] [ toHtml reload treeState session frontends mCurrentRoute ]
...@@ -102,8 +103,8 @@ childNodes session frontends reload (true /\ _) mCurrentRoute ary = ...@@ -102,8 +103,8 @@ childNodes session frontends reload (true /\ _) mCurrentRoute ary =
childNode :: Tree -> R.Element childNode :: Tree -> R.Element
childNode props = R.createElement el props [] childNode props = R.createElement el props []
el = R.hooksComponent "ChildNodeView" cpt el = R.hooksComponent "ChildNodeView" cpt
cpt {tree} _ = do cpt {tree, asyncTasks} _ = do
treeState <- R.useState' {tree, asyncTasks: []} treeState <- R.useState' {tree, asyncTasks}
pure $ toHtml reload treeState session frontends mCurrentRoute pure $ toHtml reload treeState session frontends mCurrentRoute
......
...@@ -11,6 +11,7 @@ import Gargantext.Components.Forest.Tree.Node.Action (Action(..), DroppedFile(.. ...@@ -11,6 +11,7 @@ import Gargantext.Components.Forest.Tree.Node.Action (Action(..), DroppedFile(..
import Gargantext.Components.Forest.Tree.Node.Action.Add (NodePopup(..), createNodeView) import Gargantext.Components.Forest.Tree.Node.Action.Add (NodePopup(..), createNodeView)
import Gargantext.Components.Forest.Tree.Node.Action.Rename (renameBox) import Gargantext.Components.Forest.Tree.Node.Action.Rename (renameBox)
import Gargantext.Components.Forest.Tree.Node.Action.Upload (uploadFileView, fileTypeView) import Gargantext.Components.Forest.Tree.Node.Action.Upload (uploadFileView, fileTypeView)
import Gargantext.Components.Forest.Tree.Node.ProgressBar (asyncProgressBar)
import Gargantext.Components.Search.Types (allLangs) import Gargantext.Components.Search.Types (allLangs)
import Gargantext.Components.Search.SearchBar (searchBar) import Gargantext.Components.Search.SearchBar (searchBar)
import Gargantext.Components.Search.SearchField (Search, defaultSearch, isIsTex) import Gargantext.Components.Search.SearchField (Search, defaultSearch, isIsTex)
...@@ -22,7 +23,7 @@ import Gargantext.Sessions (Session, sessionId) ...@@ -22,7 +23,7 @@ import Gargantext.Sessions (Session, sessionId)
import Gargantext.Types (NodeType(..), NodePath(..), fldr, AsyncTask(..)) import Gargantext.Types (NodeType(..), NodePath(..), fldr, AsyncTask(..))
import Gargantext.Utils (glyphicon, glyphiconActive) import Gargantext.Utils (glyphicon, glyphiconActive)
import Gargantext.Utils.Reactix as R2 import Gargantext.Utils.Reactix as R2
import Prelude (Unit, bind, const, discard, identity, map, pure, show, void, ($), (<$>), (<>), (==), (-), (+)) import Prelude (Unit, bind, const, discard, identity, map, pure, show, void, ($), (<>), (==), (-), (+))
import React.SyntheticEvent as E import React.SyntheticEvent as E
import Reactix as R import Reactix as R
import Reactix.DOM.HTML as H import Reactix.DOM.HTML as H
...@@ -66,7 +67,7 @@ nodeMainSpan d p folderOpen session frontends = R.createElement el p [] ...@@ -66,7 +67,7 @@ nodeMainSpan d p folderOpen session frontends = R.createElement el p []
, popOverIcon showBox popupOpen popupPosition , popOverIcon showBox popupOpen popupPosition
, mNodePopupView props showBox popupOpen popupPosition , mNodePopupView props showBox popupOpen popupPosition
, fileTypeView d {id, nodeType} droppedFile isDragOver , fileTypeView d {id, nodeType} droppedFile isDragOver
, H.div {} (progressBar <$> asyncTasks) , H.div {} (map (\t -> asyncProgressBar {corpusId: id, asyncTask: t}) asyncTasks)
] ]
where where
SettingsBox {show: showBox} = settingsBox nodeType SettingsBox {show: showBox} = settingsBox nodeType
...@@ -133,8 +134,6 @@ nodeMainSpan d p folderOpen session frontends = R.createElement el p [] ...@@ -133,8 +134,6 @@ nodeMainSpan d p folderOpen session frontends = R.createElement el p []
setIsDragOver $ const true setIsDragOver $ const true
onDragLeave (_ /\ setIsDragOver) _ = setIsDragOver $ const false onDragLeave (_ /\ setIsDragOver) _ = setIsDragOver $ const false
progressBar (AsyncTask {id}) = H.div {className: "progress"} [ H.text id ]
{- {-
fldr nt open = if open fldr nt open = if open
then "fa fa-globe" -- <> color nt then "fa fa-globe" -- <> color nt
......
module Gargantext.Components.Forest.Tree.Node.ProgressBar where
import Data.Int (fromNumber)
import Data.Maybe (fromJust)
import Data.Tuple.Nested ((/\))
import Effect.Timer (setTimeout)
import Math (min)
import Partial.Unsafe (unsafePartial)
import Prelude ((+), ($), (<>), (<<<), pure, bind, discard, unit, show)
import Reactix as R
import Reactix.DOM.HTML as H
import Gargantext.Components.Forest.Tree.Node.Action (ID)
import Gargantext.Types (AsyncTask(..))
type Props =
(
asyncTask :: AsyncTask
, corpusId :: ID
)
asyncProgressBar :: Record Props -> R.Element
asyncProgressBar p = R.createElement asyncProgressBarCpt p []
asyncProgressBarCpt :: R.Component Props
asyncProgressBarCpt = R.hooksComponent "G.C.F.T.N.asyncProgressBar" cpt
where
cpt {asyncTask: (AsyncTask {id}), corpusId} _ = do
(progress /\ setProgress) <- R.useState' 0.0
R.useEffect' $ do
_ <- setTimeout 1000 $ do
setProgress \p -> min 100.0 (p + 10.0)
pure unit
pure $
H.div { className: "progress" } [
H.div { className: "progress-bar"
, role: "progressbar"
, style: { width: (show $ toInt progress) <> "%" }
} [ H.text id ]
]
toInt :: Number -> Int
toInt n = unsafePartial $ fromJust $ fromNumber n
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment