[FEAT] Login on uniq server for Join main button at Home page

src/Gargantext/Components/App.purs

@@ -10,6 +10,7 @@ import Reactix.DOM.HTML as H
 
 import Gargantext.Prelude
 
+import Gargantext.Config (publicBackend)
 import Gargantext.Components.Forest (forest)
 import Gargantext.Components.GraphExplorer (explorerLayout)
 import Gargantext.Components.Lang (LandingLang(..))
@@ -25,7 +26,7 @@ import Gargantext.Components.Nodes.Home (homeLayout)
 import Gargantext.Components.Nodes.Lists (listsLayout)
 import Gargantext.Components.Nodes.Texts (textsLayout)
 import Gargantext.Config (defaultFrontends, defaultBackends)
-import Gargantext.Ends (Frontends)
+import Gargantext.Ends (Frontends, Backend)
 import Gargantext.Hooks.Router (useHashRouter)
 import Gargantext.License (license)
 import Gargantext.Router (router)
@@ -51,6 +52,8 @@ appCpt = R2.hooksComponent thisModule "app" cpt where
     route      <- useHashRouter router Home
 
     showLogin  <- R.useState' false
+    backend    <- R.useState' Nothing
+
     showCorpus <- R.useState' false
 
     treeReload <- R.useState' 0
@@ -65,17 +68,27 @@ appCpt = R2.hooksComponent thisModule "app" cpt where
                                          , reload: treeReload
                                          , route:  fst route
                                          , sessions: fst sessions
-                                         , showLogin: snd showLogin }
+                                         , showLogin: snd showLogin
+                                         , backend
+                                         }
     let mCurrentRoute     = fst route
-    let withSession sid f =
-          maybe' (const $ forested $ homeLayout LL_EN) (ff f) $ Sessions.lookup sid (fst sessions)
+    let withSession sid f = maybe' ( const $ forested
+                                           $ homeLayout { lang: LL_EN
+                                                        , backend
+                                                        , publicBackend
+                                                        , sessions
+                                                        , visible:showLogin
+                                                        }
+                                   )
+                                   (ff f)
+                                   (Sessions.lookup sid (fst sessions))
 
     pure $ case fst showLogin of
-      true -> forested $ login { backends, sessions, visible: showLogin }
+      true -> forested $ login { backend, backends, sessions, visible: showLogin }
       false ->
         case fst route of
-          Home  -> forested $ homeLayout LL_EN
-          Login -> login { backends, sessions, visible: showLogin }
+          Home  -> forested $ homeLayout {lang:LL_EN, backend, publicBackend, sessions, visible:showLogin}
+          Login -> login { backends, sessions, visible: showLogin, backend}
           Folder sid nodeId -> withSession sid $ \session -> forested $ corpusLayout { nodeId, session }
           FolderPrivate sid nodeId -> withSession sid $ \session -> forested $ corpusLayout { nodeId, session }
           FolderPublic sid nodeId  -> withSession sid $ \session -> forested $ corpusLayout { nodeId, session }
@@ -106,6 +119,7 @@ appCpt = R2.hooksComponent thisModule "app" cpt where
                                  , session
                                  , sessions: (fst sessions)
                                  , showLogin
+                                 , backend
                                  --, treeReload
                                  }
 
@@ -117,6 +131,7 @@ type ForestLayoutProps =
   , route     :: AppRoute
   , sessions  :: Sessions
   , showLogin :: R2.Setter Boolean
+  , backend   :: R.State (Maybe Backend)
   )
 
 forestLayout :: Record ForestLayoutProps -> R.Element
@@ -134,7 +149,7 @@ forestLayoutMain props = R.createElement forestLayoutMainCpt props []
 forestLayoutMainCpt :: R.Component ForestLayoutProps
 forestLayoutMainCpt = R2.hooksComponent thisModule "forestLayoutMain" cpt
   where
-    cpt { child, frontends, handed, reload, route, sessions, showLogin } _ = do
+    cpt { child, frontends, handed, reload, route, sessions, showLogin, backend} _ = do
       let ordering =
             case fst handed of
               GT.LeftHanded  -> reverse
@@ -142,7 +157,7 @@ forestLayoutMainCpt = R2.hooksComponent thisModule "forestLayoutMain" cpt
 
       pure $ R2.row $ ordering [
         H.div { className: "col-md-2", style: { paddingTop: "60px" } }
-            [ forest { frontends, handed: fst handed, reload, route, sessions, showLogin } ]
+            [ forest { frontends, handed: fst handed, reload, route, sessions, showLogin, backend} ]
       , mainPage child
       ]
 

src/Gargantext/Components/Forest.purs

 module Gargantext.Components.Forest where
 
-import Gargantext.Prelude
+import DOM.Simple.Console (log)
 
 import Data.Maybe (Maybe(..))
 import Data.Set as Set
-import Data.Tuple (fst)
+import Data.Tuple (fst, snd)
 import Data.Tuple.Nested ((/\))
-import Reactix as R
-import Reactix.DOM.HTML as H
-
 import Gargantext.AsyncTasks as GAT
 import Gargantext.Components.Forest.Tree (treeView)
-import Gargantext.Ends (Frontends)
+import Gargantext.Ends (Frontends, Backend(..))
+import Gargantext.Prelude
 import Gargantext.Routes (AppRoute)
 import Gargantext.Sessions (Session(..), Sessions, OpenNodes, unSessions)
 import Gargantext.Types (Reload, Handed(..))
 import Gargantext.Utils.Reactix as R2
+import Reactix as R
+import Reactix.DOM.HTML as H
 
 thisModule = "Gargantext.Components.Forest"
 
@@ -26,6 +26,7 @@ type Props =
   , route     :: AppRoute
   , sessions  :: Sessions
   , showLogin :: R2.Setter Boolean
+  , backend   :: R.State (Maybe Backend)
   )
 
 forest :: Record Props -> R.Element
@@ -33,7 +34,7 @@ forest props = R.createElement forestCpt props []
 
 forestCpt :: R.Component Props
 forestCpt = R2.hooksComponent thisModule "forest" cpt where
-  cpt { frontends, handed, reload: extReload, route, sessions, showLogin } _ = do
+  cpt { frontends, handed, reload: extReload, route, sessions, showLogin, backend} _ = do
     -- NOTE: this is a hack to reload the tree view on demand
     reload     <- R.useState' (0 :: Reload)
     openNodes  <- R2.useLocalStorageState R2.openNodesKey (Set.empty :: OpenNodes)
@@ -48,9 +49,9 @@ forestCpt = R2.hooksComponent thisModule "forest" cpt where
       /\ fst asyncTasks
       /\ handed
       )
-      (cpt' openNodes asyncTasks reload showLogin)
-  cpt' openNodes asyncTasks reload showLogin (frontends /\ route /\ sessions /\ _ /\ _ /\ _ /\ _ /\ handed) = do
-    pure $ R2.row $ [plus handed showLogin] <> trees
+      (cpt' openNodes asyncTasks reload showLogin backend)
+  cpt' openNodes asyncTasks reload showLogin backend (frontends /\ route /\ sessions /\ _ /\ _ /\ _ /\ _ /\ handed) = do
+    pure $ R2.row $ [plus handed showLogin backend] <> trees
     where
       trees = tree <$> unSessions sessions
       tree s@(Session {treeId}) =
@@ -64,8 +65,8 @@ forestCpt = R2.hooksComponent thisModule "forest" cpt where
                  , session: s
                  }
 
-plus :: Handed -> R2.Setter Boolean -> R.Element
-plus handed showLogin = H.div {className: if handed == RightHanded
+plus :: Handed -> R2.Setter Boolean -> R.State (Maybe Backend) -> R.Element
+plus handed showLogin backend = H.div {className: if handed == RightHanded
                                              then "flex-start"  -- TODO we should use lefthanded SASS class here
                                              else "flex-end"
                               } [
@@ -84,5 +85,5 @@ plus handed showLogin = H.div {className: if handed == RightHanded
   -- TODO same as the one in the Login Modal (same CSS)
   -- [ H.i { className: "material-icons md-36"} [] ]
   where
-    click _ = do
-      showLogin $ const true
+    click _ = (snd backend) (const Nothing)
+            *> showLogin (const true)

src/Gargantext/Components/GraphExplorer.purs

@@ -27,7 +27,7 @@ import Gargantext.Components.GraphExplorer.Sidebar as Sidebar
 import Gargantext.Components.GraphExplorer.ToggleButton as Toggle
 import Gargantext.Components.GraphExplorer.Types as GET
 import Gargantext.Data.Louvain as Louvain
-import Gargantext.Ends (Frontends)
+import Gargantext.Ends (Frontends, Backend)
 import Gargantext.Hooks.Loader (useLoader)
 import Gargantext.Hooks.Sigmax as Sigmax
 import Gargantext.Hooks.Sigmax.Types as SigmaxT
@@ -48,6 +48,7 @@ type LayoutProps =
   , session       :: Session
   , sessions      :: Sessions
   , showLogin     :: R.State Boolean
+  , backend       :: R.State (Maybe Backend)
   )
 
 type Props =
@@ -100,6 +101,7 @@ explorerCpt = R2.hooksComponent thisModule "explorer" cpt
               , session
               , sessions
               , showLogin
+              , backend
               } _ = do
 
       let startForceAtlas = maybe true (\(GET.MetaData { startForceAtlas }) -> startForceAtlas) mMetaData
@@ -158,7 +160,8 @@ explorerCpt = R2.hooksComponent thisModule "explorer" cpt
                           , reload: treeReload
                           , sessions
                           , show: fst controls.showTree
-                          , showLogin: snd showLogin }
+                          , showLogin: snd showLogin 
+                          , backend}
                     /\
                     RH.div { ref: graphRef, id: "graph-view", className: "col-md-12" } []
                     /\
@@ -205,9 +208,9 @@ explorerCpt = R2.hooksComponent thisModule "explorer" cpt
 
     tree :: Record TreeProps -> R.Element
     tree { show: false } = RH.div { id: "tree" } []
-    tree { frontends, handed, mCurrentRoute: route, reload, sessions, showLogin } =
+    tree { frontends, handed, mCurrentRoute: route, reload, sessions, showLogin, backend} =
       RH.div {className: "col-md-2 graph-tree"} [
-        forest { frontends, handed, reload, route, sessions, showLogin }
+        forest { frontends, handed, reload, route, sessions, showLogin, backend}
       ]
 
     mSidebar :: Maybe GET.MetaData
@@ -226,6 +229,7 @@ type TreeProps =
   , sessions :: Sessions
   , show :: Boolean
   , showLogin :: R2.Setter Boolean
+  , backend   :: R.State (Maybe Backend)
   )
 
 type MSidebarProps =

src/Gargantext/Components/Login.purs

@@ -29,15 +29,33 @@ import Gargantext.Utils.Reactix as R2
 
 thisModule = "Gargantext.Components.Login"
 
--- TODO: ask for login (modal) or account creation after 15 mn when user
--- is not logged and has made one search at least
+-- TODO
+-- enable anonymous login for first map
+-- and ask for login (modal) or account creation after 15 mn when user
+-- if not logged user can not save his work
 
-type Props =
+type LoginProps =
   ( backends :: Array Backend
   , sessions :: R2.Reductor Sessions Sessions.Action
   , visible  :: R.State Boolean
+  , backend  :: R.State (Maybe Backend) 
   )
 
+login :: Record LoginProps -> R.Element
+login props = R.createElement loginCpt props []
+
+loginCpt :: R.Component LoginProps
+loginCpt = R2.hooksComponent thisModule "login" cpt
+  where
+    cpt props@{backends, sessions, visible, backend} _ = do
+      pure $
+        modal {visible} $
+          case fst backend of
+            Nothing -> chooser { backends, backend, sessions, visible }
+            Just b  -> form { sessions, visible, backend: b }
+
+
+------------------------------------------------------------------------
 type ModalProps = ( visible :: R.State Boolean )
 
 modal :: Record ModalProps -> R.Element -> R.Element
@@ -76,43 +94,31 @@ modalCpt = R2.hooksComponent thisModule "modal" cpt where
                            ]
 
 
-
-login :: Record Props -> R.Element
-login props = R.createElement loginCpt props []
-
-loginCpt :: R.Component Props
-loginCpt = R2.hooksComponent thisModule "login" cpt
-  where
-    cpt props@{backends, sessions, visible} _ = do
-      backend <- R.useState' Nothing
-      pure $
-        modal {visible} $
-          case fst backend of
-            Nothing -> chooser { backends, backend, sessions, visible }
-            Just b  -> form { sessions, visible, backend: b }
-
-type ChooserProps = ( backend :: R.State (Maybe Backend) | Props )
-
-chooser :: Record ChooserProps -> R.Element
+------------------------------------------------------------------------
+chooser :: Record LoginProps -> R.Element
 chooser props = R.createElement chooserCpt props []
 
-chooserCpt :: R.Component ChooserProps
+chooserCpt :: R.Component LoginProps
 chooserCpt = R.staticComponent "G.C.Login.chooser" cpt where
-  cpt :: Record ChooserProps -> Array R.Element -> R.Element
+  cpt :: Record LoginProps -> Array R.Element -> R.Element
   cpt {backend, backends, sessions} _ =
     R.fragment $ title <> active <> new <> search
       where
         title =  [H.h2 { className: "center modal-title" } [H.text "Instances manager"]]
-        active = if DS.length ss > 0 then [ H.h3 {} [H.text "Active connection(s)"]
+        active = if DS.length ss > 0
+                    then [ H.h3 {} [H.text "Active connection(s)"]
                          , H.ul {} [ renderSessions sessions]
-                 ] else [] where
+                         ]
+                    else []
+                      where
                         Sessions {sessions:ss} = fst sessions
         search = [ H.input {className: "form-control", type:"text", placeholder: "Search for your institute"}]
-        new    = [ H.h3 {} [H.text "Last connection(s)"]
-                 , H.table {className : "table"}
-                 [ H.thead {className: "thead-dark"} [ H.tr {} [ H.th {} [ H.text ""]
-                                                               , H.th {} [H.text "Label of instance"]
-                                                               , H.th {} [H.text "Gargurl"]
+        new    = [ H.h3 {} [ H.text "Last connection(s)" ]
+                 , H.table { className : "table" }
+                           [ H.thead { className: "thead-dark" }
+                                     [ H.tr {} [ H.th {} [ H.text "" ]
+                                               , H.th {} [ H.text "Label of instance" ]
+                                               , H.th {} [ H.text "Gargurl" ]
                                                ]
                                      ]
                            , H.tbody {} (map (renderBackend backend) backends)
@@ -205,8 +211,8 @@ formCpt = R2.hooksComponent thisModule "form" cpt where
         Left message -> liftEffect $ (snd error) (const message)
         Right sess -> liftEffect $ do
           (snd sessions) (Sessions.Login sess)
-          (snd error) (const "")
-          (snd visible) (const false)
+          (snd error   ) (const "")
+          (snd visible ) (const false)
 
 csrfTokenInput :: {} -> R.Element
 csrfTokenInput _ =

src/Gargantext/Components/Nodes/Home.purs

 module Gargantext.Components.Nodes.Home where
 
+import Data.Maybe (Maybe(..))
 import Data.Newtype (class Newtype)
 import Effect (Effect)
 import Reactix as R
 import Reactix.DOM.HTML as H
 import Routing.Hash (setHash)
 
+import Gargantext.Ends (Backend(..))
+import Gargantext.Sessions (Sessions(..))
+import Gargantext.Sessions as Sessions
+
 import Gargantext.Components.Data.Landing (BlockText(..), BlockTexts(..), Button(..), LandingData(..))
 import Gargantext.Components.Lang (LandingLang(..))
 import Gargantext.Components.Lang.Landing.EnUS as En
@@ -47,19 +52,31 @@ langLandingData LL_EN = En.landingData
 
 ------------------------------------------------------------------------
 
-homeLayout :: LandingLang -> R.Element
-homeLayout lang = R.createElement homeLayoutCpt {landingData} []
-  where landingData = langLandingData lang
+type HomeProps = ( lang      :: LandingLang
+                 , publicBackend :: Backend
+                 , backend   :: R.State (Maybe Backend)
+                 , sessions  :: R2.Reductor Sessions Sessions.Action
+                 , visible  :: R.State Boolean
+                 )
+
+homeLayout :: Record HomeProps -> R.Element
+homeLayout props = R.createElement homeLayoutCpt props []
 
-homeLayoutCpt :: R.Component ( landingData :: LandingData )
+homeLayoutCpt :: R.Component HomeProps
 homeLayoutCpt = R2.hooksComponent thisModule "homeLayout" cpt
   where
-    cpt {landingData} _ = do
+    cpt {lang, backend, publicBackend, sessions, visible} _ = do
+      let landingData = langLandingData lang
       pure $ H.span {}
            [ H.div { className: "container1" } [ jumboTitle landingData false ]
            , H.div { className: "container1" } [] -- TODO put research form
            , H.div { className: "container1" } [ blocksRandomText' landingData ]
-           , H.div { className: "container1" } [ renderPublic ]
+           , H.div { className: "container1" } [ renderPublic { backend
+                                                              , publicBackend
+                                                              , sessions
+                                                              , visible
+                                                              }
+                                               ]
            , license
            ]
 

src/Gargantext/Components/Nodes/Home/Public.purs

 module Gargantext.Components.Nodes.Home.Public where
 
+import DOM.Simple.Console (log)
 import Data.Array.NonEmpty (toArray)
 import Data.Array as Array
 import Data.Argonaut as Argonaut
@@ -9,12 +10,13 @@ import Data.Maybe (Maybe(..))
 import Data.NonEmpty (head)
 import Data.String (take)
 import Data.Traversable (traverse)
-import Data.Tuple (fst)
+import Data.Tuple (fst, snd)
 import Effect.Aff (Aff)
 import Effect.Class (liftEffect)
 import Reactix as R
 import Reactix.DOM.HTML as H
 
+import Gargantext.Components.Login (login)
 import Gargantext.Config (publicBackend)
 import Gargantext.Config.REST (get)
 import Gargantext.Ends (backendUrl, Backend(..))
@@ -23,10 +25,22 @@ import Gargantext.Prelude
 import Gargantext.Utils.Argonaut (genericSumDecodeJson, genericSumEncodeJson)
 import Gargantext.Utils.Reactix as R2
 
+import Gargantext.Ends (Backend(..))
+import Gargantext.Sessions (Sessions(..))
+import Gargantext.Sessions as Sessions
+
+
 thisModule = "Gargantext.Components.Nodes.Home.Public"
 
-type PublicProps = (publicDatas :: (Array PublicData)
-                   -- , session :: Session
+type PublicProps = ( backend   :: R.State (Maybe Backend)
+                   , publicBackend :: Backend
+                   , sessions  :: R2.Reductor Sessions Sessions.Action
+                   , visible   :: R.State Boolean
+                   )
+
+type PublicDataProps =
+  ( publicDatas :: (Array PublicData)
+  | PublicProps
   )
 
 data PublicData = PublicData
@@ -75,25 +89,28 @@ loadPublicData _l = do
   Array.concat <$> traverse (\backend -> get Nothing (backendUrl backend "public")) backends
 -}
 
-renderPublic :: R.Element
-renderPublic = R.createElement renderPublicCpt {} []
+renderPublic :: Record PublicProps -> R.Element
+renderPublic props = R.createElement renderPublicCpt props []
 
-renderPublicCpt :: R.Component LoadData
+renderPublicCpt :: R.Component PublicProps
 renderPublicCpt = R2.hooksComponent thisModule "renderPublic" cpt
   where
-    cpt {} _ = do
+    cpt {backend, publicBackend, sessions, visible} _ = do
       reload <- R.useState' 0
-      useLoader { reload: fst reload } loadPublicData (\pd -> publicLayout {publicDatas: pd})
+      showLogin <- R.useState' false
+      useLoader { reload: fst reload }
+                loadPublicData
+                (\pd -> publicLayout {publicDatas: pd, backend, publicBackend, sessions, visible})
 
 
 ------------------------------------------------------------------------
-publicLayout :: Record PublicProps -> R.Element
+publicLayout :: Record PublicDataProps -> R.Element
 publicLayout props = R.createElement publicLayoutCpt props []
 
-publicLayoutCpt :: R.Component PublicProps
+publicLayoutCpt :: R.Component PublicDataProps
 publicLayoutCpt = R2.hooksComponent thisModule "publicLayout" cpt
   where
-    cpt {publicDatas} _ = do
+    cpt {publicDatas, visible, backend, publicBackend, sessions} _ = do
       pure $ H.span {}
              [ H.div { className: "text-center" }
                      [ H.div { className:"container1" }
@@ -102,10 +119,12 @@ publicLayoutCpt = R2.hooksComponent thisModule "publicLayout" cpt
                                    [ H.text "Discover maps made with "
                                    , H.span {className: "fa fa-heart"} []
                                    ]
-                             , H.p { className:"flex-space-around" }
-                                   [ H.a { className: "btn btn-primary my-2"
-                                         , href :"https://gargantext.org"
-                                         } [H.text "Join"]
+                             , H.div { className:"flex-space-around" }
+                                   [ H.button { className: "btn btn-primary my-2"
+                                              , on : { click }
+                                              , title: "Connect to the server"
+                                              } [ H.text "Join"
+                                                ]
                                    ]
                              ]
                      ]
@@ -113,6 +132,9 @@ publicLayoutCpt = R2.hooksComponent thisModule "publicLayout" cpt
              -- | TODO random maps
              , album publicDatas
              ]
+        where
+          click _ = log "click!" *> (snd backend) (const $ Just publicBackend)
+                                 *> (snd visible) (const true)
 
 album :: Array PublicData -> R.Element
 album pds = H.div {className: "album py-5 bg-light"}