Commit d420de8b authored by Vlad Dumitru's avatar Vlad Dumitru
Browse files

hide/show tag filters

parent 5d2fc8a8
......@@ -39,6 +39,7 @@ type alias ShowingTiersState =
, selected : Dict ( String, String ) Key -- ( uuid, version -> key )
, allTags : Dict String Int
, selectedTags : Set String
, tagFilterShown : Bool
}
type State
......@@ -65,6 +66,8 @@ type Msg
| PrepareCheckout
| GotStoredSelection (Result JD.Error CheckoutRequest.CheckoutStorage)
| ToggleTagFilter String Bool
| HideTagFilter
| ShowTagFilter
......@@ -79,8 +82,8 @@ init flags path =
-- VIEW -----------------------------------------------------------------------
viewHeader : List String -> Dict ( String, String ) Key -> Dict String Int -> Set String -> Html Msg
viewHeader path selectedTiers allTags selectedTags =
viewHeader : Bool -> List String -> Dict ( String, String ) Key -> Dict String Int -> Set String -> Html Msg
viewHeader tagFilterShown path selectedTiers allTags selectedTags =
let
name =
case List.reverse path |> List.head of
......@@ -91,12 +94,18 @@ viewHeader path selectedTiers allTags selectedTags =
Dict.size selectedTiers
search_ =
input
[ type_ "text"
, onInput SetSearchBase
, placeholder "search for a tier"
div [ class "row" ]
[ input
[ type_ "text"
, onInput SetSearchBase
, placeholder "search for a tier"
]
[]
, if tagFilterShown then
button [ onClick HideTagFilter, class "active" ] [ text "⋯" ]
else
button [ onClick ShowTagFilter ] [ text "⋯" ]
]
[]
tagCheckbox ( tag, count ) =
let
......@@ -116,11 +125,15 @@ viewHeader path selectedTiers allTags selectedTags =
]
tagFilter =
div [ class "container" ] <|
List.map tagCheckbox (Dict.toList allTags)
if tagFilterShown then
[ div [ class "container" ] <|
List.map tagCheckbox (Dict.toList allTags)
]
else
[]
in
header []
header [] <|
[ div [ class "box" ]
[ viewTierPath path
, h1 []
......@@ -138,13 +151,12 @@ viewHeader path selectedTiers allTags selectedTags =
]
]
, search_
, tagFilter
]
] ++ tagFilter
viewTierListing
: Dict ( String, String ) Key -> Dict String (Dict String Version) -> TierListing
: Bool -> Dict ( String, String ) Key -> Dict String (Dict String Version) -> TierListing
-> Maybe String -> Dict String Int -> Set String -> Document Msg
viewTierListing selected expanded tierListing search allTags selectedTags =
viewTierListing tagFilterShown selected expanded tierListing search allTags selectedTags =
let
version : Uuid -> Key -> ( String, Version ) -> Html Msg
version uuid key ( versionId, data ) =
......@@ -245,7 +257,7 @@ viewTierListing selected expanded tierListing search allTags selectedTags =
tier (Uuid.fromString uuid) key tags Nothing )
header_ =
viewHeader tierListing.prefix selected allTags selectedTags
viewHeader tagFilterShown tierListing.prefix selected allTags selectedTags
content =
main_ [ class "no-border" ] tiers
......@@ -259,7 +271,7 @@ view model =
case model.state of
Empty path ->
{ title = "loading"
, body = [ viewHeader path Dict.empty Dict.empty Set.empty, viewSpinner ]
, body = [ viewHeader False path Dict.empty Dict.empty Set.empty, viewSpinner ]
}
Error e ->
......@@ -267,8 +279,8 @@ view model =
, body = [ div [] [ text <| Error.errorToString e ] ]
}
ShowingTiers { tierListing, expanded, selected, search, allTags, selectedTags } ->
viewTierListing selected expanded tierListing search allTags selectedTags
ShowingTiers { tierListing, expanded, selected, search, allTags, selectedTags, tagFilterShown } ->
viewTierListing tagFilterShown selected expanded tierListing search allTags selectedTags
......@@ -283,6 +295,16 @@ incrementTagCount maybeInt =
update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
case ( msg, model.state ) of
( ShowTagFilter, ShowingTiers showingTiersState ) ->
( { model | state = ShowingTiers { showingTiersState | tagFilterShown = True } }
, Cmd.none
)
( HideTagFilter, ShowingTiers showingTiersState ) ->
( { model | state = ShowingTiers { showingTiersState | tagFilterShown = False } }
, Cmd.none
)
( GotTiers result, Empty _ ) ->
case result of
Ok tierListing ->
......@@ -300,6 +322,7 @@ update msg model =
Dict.update tag incrementTagCount acc)
Dict.empty
, selectedTags = Set.empty
, tagFilterShown = False
}
}
, LocalStorage.get "checkout-tiers"
......
......@@ -35,6 +35,9 @@ html {
font-family: $base-font-stack;
font-size: $base-font-size;
font-weight: $base-font-weight;
overflow-y: scroll;
scrollbar-width: thin;
scrollbar-color: $blue $base-bg-color;
}
body {
......@@ -400,9 +403,10 @@ button, a.button {
}
}
&:active {
&:active, &.active {
top: 0;
left: 0;
border-color: transparentize($blue, 0.25);
box-shadow: none;
}
......@@ -558,7 +562,7 @@ a {
width: 100%;
display: flex;
flex-flow: row nowrap;
align-items: center;
align-items: baseline;
justify-content: space-between;
}
......
Supports Markdown
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