Commit dc896c1b authored by Yoelis Acourt's avatar Yoelis Acourt

hide stuff from ui

also rearrange top bar menu
also add format-ps (npm run format-ps)
parent d44bac0c
...@@ -21,6 +21,7 @@ ...@@ -21,6 +21,7 @@
"test": "spago test", "test": "spago test",
"dev": "concurrently \"npm run watch\" \"npm run serve\" ", "dev": "concurrently \"npm run watch\" \"npm run serve\" ",
"serve": "npx parcel serve --dist-dir ./dist/dev/bundle ./dist/dev/index.html", "serve": "npx parcel serve --dist-dir ./dist/dev/bundle ./dist/dev/index.html",
"format-ps": "purs-tidy format-in-place src",
"prepare": "husky" "prepare": "husky"
}, },
"dependencies": { "dependencies": {
......
module Gargantext.Components.TopBar (component) where module Gargantext.Components.TopBar (component) where
import Gargantext.Prelude
import Affjax.RequestBody (document)
import Data.Foldable (intercalate) import Data.Foldable (intercalate)
import Data.Maybe (Maybe(..), isJust, fromMaybe)
import Data.Tuple.Nested ((/\))
import Effect (Effect) import Effect (Effect)
import Effect.Console (log)
import Gargantext.Components.App.Store as AppStore import Gargantext.Components.App.Store as AppStore
import Gargantext.Components.Bootstrap as B import Gargantext.Components.Bootstrap as B
import Gargantext.Components.Bootstrap.Types (ButtonVariant(..), Variant(..)) import Gargantext.Components.Bootstrap.Types (ButtonVariant(..), Variant(..))
import Gargantext.Components.Themes (themeSwitcher, allThemes) import Gargantext.Components.Themes (themeSwitcher, allThemes)
import Gargantext.Prelude import Gargantext.Components.Themes as Themes
import Gargantext.Hooks.FirstEffect (useFirstEffect')
import Gargantext.Hooks.UseFeatureFlag as Feature
import Gargantext.Sessions.Types (update)
import Gargantext.Types (Handed(..), defaultCacheParams) import Gargantext.Types (Handed(..), defaultCacheParams)
import Gargantext.Utils (setter, (?)) import Gargantext.Utils (setter, (?))
import Gargantext.Utils.Reactix as R2 import Gargantext.Utils.Reactix as R2
import Reactix (Hooks)
import Reactix as R import Reactix as R
import Reactix.DOM.HTML as H import Reactix.DOM.HTML as H
import Toestand as T import Toestand as T
import Web.HTML (window)
import Web.HTML.Location (host, protocol)
import Web.HTML.Window as Window
here :: R2.Here here :: R2.Here
here = R2.here "Gargantext.Components.TopBar" here = R2.here "Gargantext.Components.TopBar"
...@@ -31,9 +44,15 @@ componentCpt = here.component "main" cpt ...@@ -31,9 +44,15 @@ componentCpt = here.component "main" cpt
} <- AppStore.use } <- AppStore.use
showTree' <- R2.useLive' showTree showTree' <- R2.useLive' showTree
(windowLocation /\ updateWindowLocation) <- R.useState' Nothing
-- | Effects -- | Effects
-- | -- |
useFirstEffect' $ do
l <- window >>= Window.location >>= host
protocol <- window >>= Window.location >>= protocol
let url = protocol <> "//" <> l
updateWindowLocation (\_prev -> Just url)
-- | Behaviors -- | Behaviors
-- | -- |
...@@ -53,8 +72,31 @@ componentCpt = here.component "main" cpt ...@@ -53,8 +72,31 @@ componentCpt = here.component "main" cpt
, role: "navigation" , role: "navigation"
} }
[ logo [ logo
, divDropdownLeft {} [] , viewSideBar showTree' onTreeToggleClick
, H.li , viewChangeLayoutSide
, viewInfoMenu { location: windowLocation } []
, Feature.feature
{ keys: [ "expert" ]
, render: \shouldRender ->
if shouldRender then viewQuestionMark else empty
}
, Feature.feature
{ keys: [ "expert" ]
, render: \shouldRender ->
if shouldRender then viewThemeSelector theme else empty
}
, H.div
{ id: "portal-topbar"
, className: "ml-1 w-100 h-100"
}
[]
]
viewChangeLayoutSide :: R.Element
viewChangeLayoutSide =
H.li
{ title: "If you are Left Handed you can change\n" { title: "If you are Left Handed you can change\n"
<> "the interface by clicking on me. Click\n" <> "the interface by clicking on me. Click\n"
<> "again to come back to previous state." <> "again to come back to previous state."
...@@ -63,20 +105,11 @@ componentCpt = here.component "main" cpt ...@@ -63,20 +105,11 @@ componentCpt = here.component "main" cpt
[ handedChooser [ handedChooser
{} {}
] ]
, H.li
{ title: "Hello! Looking for the tree?\n" viewSideBar :: Boolean -> (Unit -> Effect Unit) -> R.Element
<> "Just watch on the other side!\n" viewSideBar showTree' onTreeToggleClick =
<> "Click on the hand again to see it back." H.li { className: "nav-item" }
, className: "nav-item main-topbar__help-button"
}
[ H.a
{ className: "nav-link navbar-text" }
[ H.span
{ className: "fa fa-question-circle-o" }
[]
]
]
, H.li { className: "nav-item" }
[ B.button [ B.button
{ variant: showTree' { variant: showTree'
? ButtonVariant Light ? ButtonVariant Light
...@@ -92,14 +125,12 @@ componentCpt = here.component "main" cpt ...@@ -92,14 +125,12 @@ componentCpt = here.component "main" cpt
{ name: "sidebar" { name: "sidebar"
, className: "" , className: ""
} }
-- ,
-- if showTree'
-- then H.text $ nbsp 1 <> "Hide Tree"
-- else H.text $ nbsp 1 <> "Show Tree"
] ]
] ]
, H.li
viewThemeSelector :: T.Box Themes.Theme -> R.Element
viewThemeSelector theme =
H.li
{ className: "nav-item main-topbar__theme-switcher" } { className: "nav-item main-topbar__theme-switcher" }
[ themeSwitcher [ themeSwitcher
{ theme { theme
...@@ -108,31 +139,25 @@ componentCpt = here.component "main" cpt ...@@ -108,31 +139,25 @@ componentCpt = here.component "main" cpt
[] []
] ]
{- , empty :: R.Element
H.li { className: "nav-item main-topbar__lang-switcher" } empty =
[ langSwitcher H.text ""
{ lang
, langs: allFeLangs viewQuestionMark :: R.Element
} [] viewQuestionMark =
]-} H.li
{- , B.button { title: "Hello! Looking for the tree?\n"
{ variant: showTree' ? <> "Just watch on the other side!\n"
ButtonVariant Light $ <> "Click on the hand again to see it back."
OutlinedButtonVariant Light , className: "nav-item main-topbar__help-button"
, callback: onTreeToggleClick
, className: "main-topbar__tree-switcher"
}
[
if showTree'
then H.text "Hide Tree"
else H.text "Show Tree"
]-}
, H.div
{ id: "portal-topbar"
, className: "ml-1 w-100 h-100"
} }
[ H.a
{ className: "nav-link navbar-text" }
[ H.span
{ className: "fa fa-question-circle-o" }
[] []
] ]
]
-- SB.searchBar {session, databases: allDatabases} -- SB.searchBar {session, databases: allDatabases}
...@@ -154,28 +179,28 @@ logo = ...@@ -154,28 +179,28 @@ logo =
src = "images/logoSmall.png" src = "images/logoSmall.png"
title = "Back to home" title = "Back to home"
divDropdownLeft :: R2.Component () viewInfoMenu :: R2.Component (location :: Maybe String)
divDropdownLeft = R.createElement divDropdownLeftCpt viewInfoMenu = R.createElement viewInfoMenu'
divDropdownLeftCpt :: R.Component () viewInfoMenu' :: R.Component (location :: Maybe String)
divDropdownLeftCpt = here.component "divDropdownLeft" cpt viewInfoMenu' = here.component "divDropdownLeft" cpt
where where
cpt {} _ = do cpt { location } _ = do
show <- T.useBox false show <- T.useBox false
pure $ H.li { className: "nav-item dropdown" } pure $ H.li { className: "nav-item dropdown" }
[ menuButton { element: menuElement, show } [] [ menuButton { element: menuElement, show } []
, menuElements { elements, show } [] , menuElements { elements: elements location, show } []
] ]
menuElement = LiNav menuElement = LiNav
{ title: "GarganText" { title: "GarganText"
, href: "#" , href: "#"
, icon: "fa fa-navicon" , icon: "fa fa-question-circle-o"
, text: "GarganText" , text: "infos"
} }
elements = elements location =
[ [ LiNav [ [ LiNav
{ title: "User documentation" { title: "User documentation"
, href: "https://write.frame.gargantext.org/s/649a6d7e1db3b365d6d0b1430d9700cc0bb4fdb1348dd1040a94c95f98979abe" , href: "https://write.frame.gargantext.org/s/649a6d7e1db3b365d6d0b1430d9700cc0bb4fdb1348dd1040a94c95f98979abe"
...@@ -228,7 +253,13 @@ divDropdownLeftCpt = here.component "divDropdownLeft" cpt ...@@ -228,7 +253,13 @@ divDropdownLeftCpt = here.component "divDropdownLeft" cpt
-} -}
, LiNav , LiNav
{ title: "API documentation" { title: "API documentation"
, href: "https://cnrs.gargantext.org/swagger-ui" , href: case location of
Just l ->
l <> "/swagger-ui"
Nothing ->
"https://cnrs.gargantext.org/swagger-ui"
, icon: "fa fa-code-fork" , icon: "fa fa-code-fork"
, text: "API documentation" , text: "API documentation"
} }
......
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