Commit b8c1e90b authored by Alexandre Delanoë's avatar Alexandre Delanoë

Merge branch 'feature/search-input-component' of...

Merge branch 'feature/search-input-component' of ssh://gitlab.iscpif.fr:20022/gargantext/purescript-gargantext into feature/search-input-component
parents 70de2df8 22fbfd96
...@@ -19,17 +19,20 @@ import Reactix as R ...@@ -19,17 +19,20 @@ import Reactix as R
import Reactix.DOM.HTML as HTML import Reactix.DOM.HTML as HTML
import Reactix.DOM.HTML (text, button, div, input, option) import Reactix.DOM.HTML (text, button, div, input, option)
import Reactix.SyntheticEvent as E import Reactix.SyntheticEvent as E
import Gargantext.Components.Search.Types
select = R.createElement "select" select = R.createElement "select"
type Search = { term :: String } type Search = { database :: Maybe Database, term :: String }
defaultSearch :: Search defaultSearch :: Search
defaultSearch = { term: "" } defaultSearch = { database: Nothing, term: "" }
type Props = type Props =
-- list of databases to search, or parsers to use on uploads
( databases :: Array Database
-- State hook for a search, how we get data in and out -- State hook for a search, how we get data in and out
( search :: R.State (Maybe Search) , search :: R.State (Maybe Search)
) )
searchField :: Record Props -> R.Element searchField :: Record Props -> R.Element
...@@ -44,12 +47,21 @@ searchFieldComponent = R.memo (R.hooksComponent "SearchField" cpt) hasChanged ...@@ -44,12 +47,21 @@ searchFieldComponent = R.memo (R.hooksComponent "SearchField" cpt) hasChanged
cpt props _ = do cpt props _ = do
let search = maybe defaultSearch identity (fst props.search) let search = maybe defaultSearch identity (fst props.search)
term <- R.useState $ \_ -> pure search.term term <- R.useState $ \_ -> pure search.term
db <- R.useState $ \_ -> pure Nothing
pure $ pure $
div { className: "search-field" } div { className: "search-field" }
[ searchInput term [ databaseInput db props.databases
, submitButton term props.search , searchInput term
, submitButton db term props.search
] ]
hasChanged p p' = fst p.search /= fst p'.search hasChanged p p' = (fst p.search /= fst p'.search) || (p.databases /= p'.databases)
databaseInput :: R.State (Maybe Database) -> Array Database -> R.Element
databaseInput (db /\ setDB) dbs =
select { className: "database", onChange } (item <$> dbs)
where
onChange = mkEffectFn1 $ \e -> setDB (readDatabase (e .. "target" .. "value"))
item db = option { value: (show db) } [ text (show db) ]
searchInput :: R.State String -> R.Element searchInput :: R.State String -> R.Element
searchInput (term /\ setTerm) = searchInput (term /\ setTerm) =
...@@ -60,11 +72,11 @@ searchInput (term /\ setTerm) = ...@@ -60,11 +72,11 @@ searchInput (term /\ setTerm) =
where onChange = mkEffectFn1 $ \e -> setTerm $ e .. "target" .. "value" where onChange = mkEffectFn1 $ \e -> setTerm $ e .. "target" .. "value"
submitButton :: R.State String -> R.State (Maybe Search) -> R.Element submitButton :: R.State (Maybe Database) -> R.State String -> R.State (Maybe Search) -> R.Element
submitButton (term /\ _) (_ /\ setSearch) = button { onClick: click } [ text "Search" ] submitButton (database /\ _) (term /\ _) (_ /\ setSearch) = button { onClick: click } [ text "Search" ]
where where
click = mkEffectFn1 $ \_ -> do click = mkEffectFn1 $ \_ -> do
case term of case term of
"" -> setSearch Nothing "" -> setSearch Nothing
_ -> setSearch $ Just { term: term } _ -> setSearch $ Just { database, term }
...@@ -19,6 +19,22 @@ import Gargantext.Pages.Layout.Specs.AddCorpus.States (Response, State) ...@@ -19,6 +19,22 @@ import Gargantext.Pages.Layout.Specs.AddCorpus.States (Response, State)
import Gargantext.Utils (id) import Gargantext.Utils (id)
import URI.Extra.QueryPairs as QP import URI.Extra.QueryPairs as QP
data Database = PubMed | HAL
instance showDatabase :: Show Database where
show PubMed = "PubMed"
show HAL = "HAL"
readDatabase :: String -> Maybe Database
readDatabase "PubMed" = Just PubMed
readDatabase "HAL" = Just HAL
readDatabase _ = Nothing
derive instance eqDatabase :: Eq Database
allDatabases :: Array Database
allDatabases = [PubMed, HAL]
data SearchOrder data SearchOrder
= DateAsc = DateAsc
| DateDesc | DateDesc
...@@ -37,6 +53,7 @@ instance showSearchOrder :: Show SearchOrder where ...@@ -37,6 +53,7 @@ instance showSearchOrder :: Show SearchOrder where
newtype SearchQuery = SearchQuery newtype SearchQuery = SearchQuery
{ query :: Array String { query :: Array String
, databases :: Array Database
, corpus_id :: Maybe Int , corpus_id :: Maybe Int
, offset :: Maybe Int , offset :: Maybe Int
, limit :: Maybe Int , limit :: Maybe Int
...@@ -47,6 +64,7 @@ derive instance newtypeSearchQuery :: Newtype SearchQuery _ ...@@ -47,6 +64,7 @@ derive instance newtypeSearchQuery :: Newtype SearchQuery _
defaultSearchQuery :: SearchQuery defaultSearchQuery :: SearchQuery
defaultSearchQuery = SearchQuery defaultSearchQuery = SearchQuery
{ query: [] { query: []
, databases: allDatabases
, corpus_id: Nothing , corpus_id: Nothing
, offset: Nothing , offset: Nothing
, limit: Nothing , limit: Nothing
......
...@@ -23,13 +23,10 @@ import Gargantext.Components.Modals.Modal (modalShow) ...@@ -23,13 +23,10 @@ import Gargantext.Components.Modals.Modal (modalShow)
import Gargantext.Components.Search.SearchField (Search, searchField) import Gargantext.Components.Search.SearchField (Search, searchField)
import Gargantext.Utils (id) import Gargantext.Utils (id)
type Props = ( open :: Boolean ) type Props = ( open :: Boolean, databases :: Array Database )
defaultCategories :: Array String
defaultCategories = ["PubMed", "HAL"]
defaultProps :: Record Props defaultProps :: Record Props
defaultProps = { open: true } --, categories: defaultCategories } defaultProps = { open: true, databases: allDatabases }
searchBar :: Record Props -> R.Element searchBar :: Record Props -> R.Element
searchBar p = R.createElement searchBarComponent p [] searchBar p = R.createElement searchBarComponent p []
...@@ -43,12 +40,12 @@ searchBarComponent = R.hooksComponent "SearchBar" cpt ...@@ -43,12 +40,12 @@ searchBarComponent = R.hooksComponent "SearchBar" cpt
onSearchChange search onSearchChange search
pure $ H.div { className: "search-bar-container" } pure $ H.div { className: "search-bar-container" }
[ toggleButton open [ toggleButton open
, searchFieldContainer open search ] , searchFieldContainer open props.databases search ]
searchFieldContainer :: R.State Boolean -> R.State (Maybe Search) -> R.Element searchFieldContainer :: R.State Boolean -> Array Database -> R.State (Maybe Search) -> R.Element
searchFieldContainer (true /\ _) search = searchFieldContainer (true /\ _) databases search =
H.div { className: "search-bar open" } [ searchField { search } ] H.div { className: "search-bar open" } [ searchField { databases, search } ]
searchFieldContainer (false /\ _) _ = H.div {className: "search-bar closed"} [] searchFieldContainer (false /\ _) _ _ = H.div {className: "search-bar closed"} []
onSearchChange :: R.State (Maybe Search) -> R.Hooks Unit onSearchChange :: R.State (Maybe Search) -> R.Hooks Unit
onSearchChange (search /\ setSearch) = onSearchChange (search /\ setSearch) =
......
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