dillonkearns/elm-pages-v3-beta
1
1
Fork 0
mirror of https://github.com/dillonkearns/elm-pages-v3-beta.git synced 2024-12-25 12:52:27 +03:00
Code Issues Packages Projects Releases Wiki Activity

Use client-side onSubmit for search page.

Browse Source
This commit is contained in:
Dillon Kearns 2022-05-18 10:49:50 -07:00
parent 3952e895ab
commit e032836b72
1 changed files with 23 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
examples/trails/app/Route/Search.elm
View File

@ -9,7 +9,7 @@ import Effect exposing (Effect)
import ErrorPage exposing (ErrorPage)
import Graphql.Operation exposing (RootQuery)
import Graphql.OptionalArgument exposing (OptionalArgument(..))
import Graphql.SelectionSet exposing (SelectionSet)
import Graphql.SelectionSet as SelectionSet exposing (SelectionSet)
import Head
import Head.Seo as Seo
import Html exposing (Html)
@ -82,7 +82,13 @@ subscriptions maybePageUrl routeParams path sharedModel model =
type alias SearchResults =
{ query : String
, results : List String
, results : List SearchResult
}
type alias SearchResult =
{ name : String
, coverImage : String
}
@ -165,7 +171,9 @@ view maybeUrl sharedModel model static =
{ title = "Search"
, body =
[ Html.h2 [] [ Html.text "Search" ]
, Html.form []
, Html.form
[ Pages.Msg.onSubmit
]
[ Html.label []
[ Html.text "Query "
, Html.input [ Attr.name "q" ] []
@ -187,14 +195,20 @@ resultsView results =
|> List.map
(\result ->
Html.li []
[ Html.text result
[ Html.img
[ Attr.src result.coverImage
, Attr.style "width" "200px"
, Attr.style "border-radius" "10px"
]
[]
, Html.text result.name
]
)
|> Html.ul []
]
search : String -> SelectionSet (List String) RootQuery
search : String -> SelectionSet (List SearchResult) RootQuery
search query =
Api.Query.trails
(\optionals ->
@ -215,4 +229,7 @@ search query =
)
}
)
Api.Object.Trails.name
(SelectionSet.map2 SearchResult
Api.Object.Trails.name
Api.Object.Trails.coverImage
)