Commit 9ba23e92 authored by Alexandre Delanoë's avatar Alexandre Delanoë

Merge branch 'searchbar-component' of...

Merge branch 'searchbar-component' of ssh://gitlab.iscpif.fr:20022/gargantext/purescript-gargantext into searchbar-component
parents 066514fd 0f2b5a52
......@@ -16,6 +16,7 @@ import Gargantext.Pages.Corpus.Document as D
import Gargantext.Pages.Corpus.Graph as GE
import Gargantext.Pages.Layout.Specs.AddCorpus as AC
import Gargantext.Pages.Layout.Specs.Search as S
import Gargantext.Pages.Layout.Specs.SearchBar as SB
import Gargantext.Pages.Layout.States (AppState)
import Gargantext.Prelude
import Gargantext.Router (Routes)
......@@ -25,29 +26,26 @@ import Gargantext.Router (Routes)
data Action
= LoginA LN.Action
| SetRoute Routes
| SearchA S.Action
| Search String
| AddCorpusA AC.Action
| GraphExplorerA GE.Action
| DocumentViewA D.Action
| SearchA S.Action
| AddCorpusA AC.Action
| GraphExplorerA GE.Action
| DocumentViewA D.Action
| AnnuaireAction Annuaire.Action
| Go
| SearchBarAction SB.Action
| ShowLogin
| Logout
| ShowAddcorpus
| ShowAddCorpus
| ToggleTree
performAction :: PerformAction AppState {} Action
performAction (SetRoute route) _ _ = void do
modifyState $ _ {currentRoute = pure route}
performAction (Search s) _ _ = void do
modifyState $ _ {search = s}
performAction (ToggleTree) _ (state) = void do -- TODO
modifyState $ _ {showTree = not (state.showTree)}
performAction (ShowLogin) _ _ = void do
performAction ShowLogin _ _ = void do
liftEffect $ modalShow "loginModal"
modifyState $ _ {showLogin = true}
......@@ -60,23 +58,21 @@ performAction Logout _ _ = do
---------------------------------------------------------
-- TODO chose one of them
performAction (ShowAddcorpus) _ _ = void do
performAction ShowAddCorpus _ _ = void do
liftEffect $ modalShow "addCorpus"
modifyState $ _ {showCorpus = true}
performAction Go _ _ = void do
liftEffect $ modalShow "addCorpus"
modifyState $ _ {showCorpus = true}
-- _ <- lift $ setHash "/addCorpus"
--modifyState id
---------------------------------------------------------
performAction (LoginA _) _ _ = pure unit
performAction (AddCorpusA _) _ _ = pure unit
performAction (SearchA _) _ _ = pure unit
performAction (DocumentViewA _) _ _ = pure unit
performAction (GraphExplorerA _) _ _ = pure unit
performAction (AnnuaireAction _) _ _ = pure unit
performAction (LoginA _) _ _ = pure unit
performAction (AddCorpusA _) _ _ = pure unit
performAction (SearchA _) _ _ = pure unit
performAction (DocumentViewA _) _ _ = pure unit
performAction (GraphExplorerA _) _ _ = pure unit
performAction (AnnuaireAction _) _ _ = pure unit
performAction (SearchBarAction _) _ _ = pure unit
-- liftEffect $ modalShow "addCorpus"
-- modifyState $ _ {showCorpus = true}
----------------------------------------------------------
......@@ -104,6 +100,12 @@ _annuaireAction = prism AnnuaireAction \action ->
AnnuaireAction a -> Right a
_ -> Left action
_searchBarAction :: Prism' Action SB.Action
_searchBarAction = prism SearchBarAction \action ->
case action of
SearchBarAction a -> Right a
_ -> Left action
_documentViewAction :: Prism' Action D.Action
_documentViewAction = prism DocumentViewA \action ->
case action of
......
......@@ -8,7 +8,7 @@ import React (ReactElement)
import React.DOM (a, button, div, footer, hr', img, input, li, p, span, text, ul,i)
import React.DOM.Props (_data, _id, _type, aria, className, href, onChange, onClick, placeholder, role, src, style, tabIndex, target, title)
import Thermite (Render, Spec, _render, defaultPerformAction, defaultRender, focus, simpleSpec, withState, noState, cmapProps)
import Unsafe.Coerce (unsafeCoerce)
-- import Unsafe.Coerce (unsafeCoerce)
import Gargantext.Prelude
import Gargantext.Components.Data.Lang (Lang(..))
......@@ -23,10 +23,11 @@ import Gargantext.Pages.Corpus.Document as Annotation
import Gargantext.Pages.Corpus.Dashboard as Dsh
import Gargantext.Pages.Corpus.Graph as GE
import Gargantext.Pages.Home as L
import Gargantext.Pages.Layout.Actions (Action(..), _addCorpusAction, _documentViewAction, _graphExplorerAction, _loginAction, _searchAction, performAction)
import Gargantext.Pages.Layout.Actions (Action(..), _addCorpusAction, _documentViewAction, _graphExplorerAction, _loginAction, _searchAction, _searchBarAction, performAction)
import Gargantext.Pages.Layout.Specs.AddCorpus as AC
import Gargantext.Pages.Layout.Specs.Search as S
import Gargantext.Pages.Layout.States (AppState, _addCorpusState, _documentViewState, _graphExplorerState, _loginState, _searchState)
import Gargantext.Pages.Layout.Specs.SearchBar as SB
import Gargantext.Pages.Layout.States (AppState, _addCorpusState, _documentViewState, _graphExplorerState, _loginState, _searchState, _searchBarState)
import Gargantext.Router (Routes(..))
layoutSpec :: Spec AppState {} Action
......@@ -61,7 +62,6 @@ pagesComponent s = case s.currentRoute of
selectSpec (Document i) = layout0 $ focus _documentViewState _documentViewAction Annotation.docview
selectSpec (PGraphExplorer i)= layout1 $ focus _graphExplorerState _graphExplorerAction GE.specOld
selectSpec Dashboard = layout0 $ noState Dsh.layoutDashboard
selectSpec (Annuaire i) = layout0 $ cmapProps (const {annuaireId: i}) $ noState A.layout
selectSpec (UserPage i) = layout0 $ cmapProps (const {nodeId: i}) $ noState C.layoutUser
selectSpec (ContactPage i) = layout0 $ cmapProps (const {nodeId: i}) $ noState C.layoutUser
......@@ -75,11 +75,12 @@ layout0 :: Spec AppState {} Action
-> Spec AppState {} Action
layout0 layout =
fold
[ layoutSidebar divSearchBar
[ searchBar
, outerLayout
, layoutFooter
]
where
searchBar = layoutSidebar $ focus _searchBarState _searchBarAction SB.renderSpec
outerLayout1 = simpleSpec defaultPerformAction defaultRender
outerLayout :: Spec AppState {} Action
outerLayout =
......@@ -122,12 +123,13 @@ layout1 :: Spec AppState {} Action
-> Spec AppState {} Action
layout1 layout =
fold
[ layoutSidebar divSearchBar
[ searchBar
, layout
-- , outerLayout
, layoutFooter
]
where
searchBar = layoutSidebar $ focus _searchBarState _searchBarAction SB.renderSpec
outerLayout1 = simpleSpec defaultPerformAction defaultRender
outerLayout :: Spec AppState {} Action
outerLayout =
......@@ -163,8 +165,7 @@ layout1 layout =
]
layoutSidebar :: Spec AppState {} Action
-> Spec AppState {} Action
layoutSidebar :: Spec AppState {} Action -> Spec AppState {} Action
layoutSidebar = over _render \render d p s c ->
[ div [ _id "dafixedtop"
, className "navbar navbar-inverse navbar-fixed-top"
......@@ -297,31 +298,6 @@ liNav (LiNav { title : title'
]
]
-- TODO put the search form in the center of the navBar
divSearchBar :: Spec AppState {} Action
divSearchBar = simpleSpec performAction render
where
render :: Render AppState {} Action
render dispatch _ state _ = [div [ className "" ] [ searchbar']]
where
searchbar' = ul [ className "nav navbar-nav col-md-6 col-md-offset-3"
, style { "marginLeft" : "15%"}
] [ {-div [className "navbar-form"]
[ input [ className "search-query"
, placeholder "Query, URL or FILE (works with Firefox or Chromium browsers)"
, _type "text"
, style { height: "35px"
, width: "400px"
}
, onChange \e -> dispatch $ Search (unsafeCoerce e).target.value
]
--, button [onClick \e -> dispatch Go, className "btn btn-primary"] [text "Enter"]
, span [onClick \e -> dispatch Go, style {color : "#039BE5"}]
[ i [className "material-icons md-36"] [text "control_point"]]
]
-}
]
divDropdownRight :: (Action -> Effect Unit) -> AppState -> ReactElement
divDropdownRight d s =
ul [className "nav navbar-nav pull-right"]
......
module Gargantext.Pages.Layout.Specs.SearchBar
(State, Action(..), initialState, performAction, renderSpec) where
import Data.Foldable (fold, intercalate)
import Data.Lens (Lens', lens, over, (^.), (.~))
import Data.Maybe (Maybe(Nothing, Just))
import Effect (Effect)
import Effect.Class.Console (log)
import React (ReactElement)
import React.DOM (a, button, div, footer, hr', img, input, li, p, span, text, ul,i)
import React.DOM.Props (_data, _id, _type, aria, className, href, onChange, onClick, placeholder, role, src, style, tabIndex, target, title)
import Thermite (Render, Spec, _render, defaultPerformAction, defaultRender, focus, simpleSpec, withState, noState, cmapProps)
import Unsafe.Coerce (unsafeCoerce)
import Gargantext.Prelude
import Gargantext.Components.Data.Lang (Lang(..))
import Gargantext.Components.Login.Types (AuthData(..))
import Gargantext.Components.Login as LN
import Gargantext.Components.Tree as Tree
import Gargantext.Folder as F
import Gargantext.Pages.Annuaire as A
import Gargantext.Pages.Annuaire.User.Contacts as C
import Gargantext.Pages.Corpus as Corpus
import Gargantext.Pages.Corpus.Document as Annotation
import Gargantext.Pages.Corpus.Dashboard as Dsh
import Gargantext.Pages.Corpus.Graph as GE
import Gargantext.Pages.Home as L
import Gargantext.Pages.Layout.Specs.AddCorpus as AC
import Gargantext.Pages.Layout.Specs.Search as S
import Gargantext.Router (Routes(..))
import Thermite (PerformAction, Render, Spec, modifyState, simpleSpec)
import Gargantext.Components.Modals.Modal (modalShow)
import Effect.Class (liftEffect)
import Data.Newtype as N
type State' = { open :: Boolean, searchTerm :: String }
newtype State = State State'
derive instance newtypeState :: N.Newtype State _
initialState :: State
initialState = State { open: false, searchTerm: "" }
data Action =
ToggleOpen
| SetSearchTerm String
| PerformSearch
performAction :: PerformAction State {} Action
performAction ToggleOpen _ st = void $ do
let new = st ^. _open
let msg = "Toggled open from " <> show new
liftEffect $ log msg
modifyState $ over _open not
performAction (SetSearchTerm term) _ _ = void $ do
liftEffect $ log $ "Search term set " <> term
modifyState $ _searchTerm .~ term
performAction PerformSearch _ _ = void $ do
liftEffect $ log "Search performed"
liftEffect $ modalShow "addCorpus"
render :: Render State {} Action
render dispatch _ state _ = [ expander ] <> (draw $ state ^. _open)
where
draw true = [ searchbar ]
draw false = [ ]
go = button [onClick \e -> dispatch PerformSearch, className "btn btn-primary"]
[text "Enter"]
expander = ul [ className "nav navbar pull-left" ]
[ li [ onClick \e -> dispatch ToggleOpen, style { color: "#039BE5" } ]
[ i [ className "material-icons md-36", style { marginTop: "-5px" } ]
[ text "control_point" ] ] ]
search = input [ className "search-query"
, placeholder "Query, URL or FILE (works with Firefox or Chromium browsers)"
, _type "text"
, style { height: "35px", width: "400px" }
, onChange \e -> dispatch $ SetSearchTerm (unsafeCoerce e).target.value
]
searchbar = ul [ className "nav navbar pull-left" ]
[ div [className "navbar-form"] [ search, go ] ]
-- TODO:
-- render differently based on whether we are open or not
-- tidy up css
-- subtle css animation
renderSpec :: Spec State {} Action
renderSpec = simpleSpec performAction render
----------------------------
overState :: (State' -> State') -> State -> State
overState = N.over State
_open :: Lens' State Boolean
_open = lens (_.open <<< N.unwrap) $ \s o -> overState (_ { open = o }) s
_searchTerm :: Lens' State String
_searchTerm = lens (_.searchTerm <<< N.unwrap) $ \s t -> overState (_ { searchTerm = t }) s
......@@ -11,19 +11,20 @@ import Gargantext.Pages.Corpus.Document as D
import Gargantext.Pages.Corpus.Graph as GE
import Gargantext.Pages.Layout.Specs.AddCorpus as AC
import Gargantext.Pages.Layout.Specs.Search as S
import Gargantext.Pages.Layout.Specs.SearchBar as SB
import Gargantext.Router (Routes(..))
type AppState =
{ currentRoute :: Maybe Routes
, loginState :: LN.State
, addCorpusState :: AC.State
, searchState :: S.State
, documentState :: D.State
, search :: String
, showLogin :: Boolean
, showCorpus :: Boolean
, graphExplorerState :: GE.State
, showTree :: Boolean
{ currentRoute :: Maybe Routes
, loginState :: LN.State
, addCorpusState :: AC.State
, searchState :: S.State
, documentState :: D.State
, searchBarState :: SB.State
, showLogin :: Boolean
, showCorpus :: Boolean
, graphExplorerState :: GE.State
, showTree :: Boolean
}
initAppState :: Effect AppState
......@@ -35,14 +36,16 @@ initAppState = do
, addCorpusState : AC.initialState
, searchState : S.initialState
, documentState : D.initialState {}
, search : ""
, searchBarState : SB.initialState
, showLogin : false
, showCorpus : false
, graphExplorerState : GE.initialState
, showTree : false
}
---------------------------------------------------------
_loginState :: Lens' AppState LN.State
_loginState = lens (\s -> s.loginState) (\s ss -> s{loginState = ss})
......@@ -52,8 +55,12 @@ _addCorpusState = lens (\s -> s.addCorpusState) (\s ss -> s{addCorpusState = ss}
_searchState :: Lens' AppState S.State
_searchState = lens (\s -> s.searchState) (\s ss -> s{searchState = ss})
_searchBarState :: Lens' AppState SB.State
_searchBarState = lens (\s -> s.searchBarState) (\s ss -> s{searchBarState = ss})
_documentViewState :: Lens' AppState D.State
_documentViewState = lens (\s -> s.documentState) (\s ss -> s{documentState = ss})
_graphExplorerState :: Lens' AppState GE.State
_graphExplorerState = lens (\s -> s.graphExplorerState) (\s ss -> s{graphExplorerState = ss})
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