[Share box] show checkmark after copying

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

 module Gargantext.Components.Forest.Tree.Node.Action.Share where
 
+import Gargantext.Prelude
+
 import Data.Array (filter, nub)
 import Data.Either (Either(..))
 import Data.Generic.Rep (class Generic)
@@ -9,6 +11,7 @@ import Data.String (Pattern(..), contains)
 import Data.Tuple.Nested ((/\))
 import Effect.Aff (launchAff_)
 import Effect.Class (liftEffect)
+import Effect.Timer (setTimeout)
 import Gargantext.Components.Bootstrap as B
 import Gargantext.Components.Bootstrap.Types (Elevation(Level1))
 import Gargantext.Components.Forest.Tree.Node.Action.Types as Action
@@ -17,14 +20,13 @@ import Gargantext.Components.Forest.Tree.Node.Tools.SubTree (subTreeView, SubTre
 import Gargantext.Components.InputWithAutocomplete (inputWithAutocomplete)
 import Gargantext.Config.REST (AffRESTError)
 import Gargantext.Hooks.Loader (useLoader)
-import Gargantext.Prelude
 import Gargantext.Routes as GR
 import Gargantext.Sessions (Session, get, post)
 import Gargantext.Types (ID, NodeID, NodeType)
 import Gargantext.Types as GT
+import Gargantext.Utils.Clipboard (modalClipboard)
 import Gargantext.Utils.Reactix as R2
 import Gargantext.Utils.SimpleJSON as GUSJ
-import Gargantext.Utils.Clipboard (modalClipboard)
 import Reactix as R
 import Reactix.DOM.HTML as H
 import Simple.JSON as JSON
@@ -197,23 +199,31 @@ shareURLcpt :: R.Component ShareURL
 shareURLcpt = R2.hereComponent here "shareURL" hCpt
   where
   hCpt hp { nodeType, id, session } _ = do
+    copied <- T.useBox false
+
     useLoader
       { errorHandler: Just errorHandler
       , herePrefix: hp
       , loader: loadUrl
       , path: { nodeType, id, session }
-      , render: \url -> shareURLInner { url } []
+      , render: \url -> shareURLInner { url, copied } []
       }
   errorHandler err = here.warn2 "[ShareURL] RESTError" err
 
-shareURLInner :: R2.Component (url :: String)
+type ShareURLInnerProps =
+  ( url :: String
+  , copied :: T.Box Boolean
+  )
+
+shareURLInner :: R2.Component ShareURLInnerProps
 shareURLInner = R.createElement shareURLInnercpt
 
-shareURLInnercpt :: R.Component (url :: String)
+shareURLInnercpt :: R.Component ShareURLInnerProps
 shareURLInnercpt = here.component "shareURLInner" cpt
   where
-  cpt { url } _ = do
+  cpt { url, copied } _ = do
     R.useEffect' $ modalClipboard ".copy" url
+    copied' <- T.useLive T.unequal copied
 
     pure $ Tools.panelNoFooter
       { mError: Nothing
@@ -223,10 +233,13 @@ shareURLInnercpt = here.component "shareURLInner" cpt
       [ H.div {}
           [ H.a { href: url } [ H.text url ]
           , B.iconButton
-              { name: "clone"
-              , title: "Copy to clipboard"
+              { name: if copied' then "check" else "copy"
+              , title: if copied' then "Copied" else "Copy to clipboard"
               , className: "copy copy-btn"
-              , callback: \_ -> pure unit
+              , callback: \_ -> do
+                  T.write_ true copied
+                  _ <- setTimeout 2000 (T.write_ false copied)
+                  pure unit
               }
           ]
       ]