Skip to content
Permalink

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also or learn more about diff comparisons.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also . Learn more about diff comparisons here.
base repository: NixOS/nixos-search
Failed to load repositories. Confirm that selected base ref is valid, then try again.
Loading
base: b2b1d59a7293
Choose a base ref
...
head repository: NixOS/nixos-search
Failed to load repositories. Confirm that selected head ref is valid, then try again.
Loading
compare: 3dcbd4db626f
Choose a head ref
  • 1 commit
  • 4 files changed
  • 1 contributor

Commits on Jan 17, 2021

  1. faceted search trap click (#262) 

    * search results trap click events to avoid double actions

* trap and improve options

* Few small improvements

* apply styles to packages
    @turboMaCk
    turboMaCk authored Jan 17, 2021
    Copy the full SHA
    3dcbd4d View commit details
Showing with 79 additions and 52 deletions.
  1. +7 −9 src/Page/Options.elm
  2. +31 −41 src/Page/Packages.elm
  3. +22 −0 src/Search.elm
  4. +19 −2 src/index.less
16 changes: 7 additions & 9 deletions src/Page/Options.elm
View file
Original file line number Diff line number Diff line change
@@ -136,7 +136,7 @@ viewSuccess :
-> Html Msg
viewSuccess channel showNixOSDetails show hits =
ul []
(List.concatMap
(List.map
(viewResultItem channel showNixOSDetails show)
hits
)
@@ -147,7 +147,7 @@ viewResultItem :
-> Bool
-> Maybe String
-> Search.ResultItem ResultItemSource
-> List (Html Msg)
-> Html Msg
viewResultItem channel _ show item =
let
showHtml value =
@@ -167,7 +167,7 @@ viewResultItem channel _ show item =
pre [] [ text value ]

asPreCode value =
div [] [ pre [] [ code [] [ text value ] ] ]
div [] [ pre [] [ code [ class "code-block" ] [ text value ] ] ]

githubUrlPrefix branch =
"https://github.com/NixOS/nixpkgs/blob/" ++ branch ++ "/"
@@ -186,7 +186,7 @@ viewResultItem channel _ show item =
[ href <| githubUrlPrefix channelDetails.branch ++ (value |> String.replace ":" "#L")
, target "_blank"
]
[ text <| value ]
[ text value ]

Nothing ->
text <| cleanPosition value
@@ -212,7 +212,7 @@ viewResultItem channel _ show item =

showDetails =
if Just item.source.name == show then
[ div []
[ div [ Html.Attributes.map SearchMsg Search.trapClick ]
[ div [] [ text "Default value" ]
, div [] [ withEmpty (wrapped asPreCode) item.source.default ]
, div [] [ text "Type" ]
@@ -230,13 +230,12 @@ viewResultItem channel _ show item =
open =
SearchMsg (Search.ShowDetails item.source.name)
in
[ li
li
[ class "option"
, onClick open
, Search.elementId item.source.name
]
([]
|> List.append showDetails
(showDetails
|> List.append
(item.source.description
|> Maybe.map showHtml
@@ -248,7 +247,6 @@ viewResultItem channel _ show item =
[ text item.source.name ]
]
)
]



72 changes: 31 additions & 41 deletions src/Page/Packages.elm
View file
Original file line number Diff line number Diff line change
@@ -32,10 +32,7 @@ import Html.Attributes
, id
, target
)
import Html.Events
exposing
( onClick
)
import Html.Events exposing (onClick)
import Json.Decode
import Json.Decode.Pipeline
import Json.Encode
@@ -294,7 +291,7 @@ viewSuccess :
-> Html Msg
viewSuccess channel showNixOSDetails show hits =
ul []
(List.concatMap
(List.map
(viewResultItem channel showNixOSDetails show)
hits
)
@@ -305,17 +302,9 @@ viewResultItem :
-> Bool
-> Maybe String
-> Search.ResultItem ResultItemSource
-> List (Html Msg)
-> Html Msg
viewResultItem channel showNixOSDetails show item =
let
onClickStop message =
Html.Events.custom "click" <|
Json.Decode.succeed
{ message = message
, stopPropagation = True
, preventDefault = True
}

cleanPosition =
Regex.fromString "^[0-9a-f]+\\.tar\\.gz\\/"
|> Maybe.withDefault Regex.never
@@ -331,7 +320,7 @@ viewResultItem channel showNixOSDetails show item =
"https://github.com/NixOS/nixpkgs/blob/" ++ branch ++ "/" ++ uri

createShortDetailsItem title url =
[ li []
[ li [ Html.Attributes.map SearchMsg Search.trapClick ]
[ a
[ href url
, target "_blank"
@@ -342,22 +331,20 @@ viewResultItem channel showNixOSDetails show item =

shortPackageDetails =
ul []
([]
|> List.append
(item.source.position
|> Maybe.map
(\position ->
case Search.channelDetailsFromId channel of
Nothing ->
[]

Just channelDetails ->
createShortDetailsItem
"source"
(createGithubUrl channelDetails.branch position)
)
|> Maybe.withDefault []
((item.source.position
|> Maybe.map
(\position ->
case Search.channelDetailsFromId channel of
Nothing ->
[]

Just channelDetails ->
createShortDetailsItem
"source"
(createGithubUrl channelDetails.branch position)
)
|> Maybe.withDefault []
)
|> List.append
(item.source.homepage
|> List.head
@@ -448,9 +435,8 @@ viewResultItem channel showNixOSDetails show item =

longerPackageDetails =
if Just item.source.attr_name == show then
[ div []
([]
|> List.append maintainersAndPlatforms
[ div [ Html.Attributes.map SearchMsg Search.trapClick ]
(maintainersAndPlatforms
|> List.append
(item.source.longDescription
|> Maybe.map (\desc -> [ p [] [ text desc ] ])
@@ -472,7 +458,9 @@ viewResultItem channel showNixOSDetails show item =
]
[ a
[ href "#"
, onClickStop <| SearchMsg (Search.ShowNixOSDetails True)
, Search.onClickStop <|
SearchMsg <|
Search.ShowNixOSDetails True
]
[ text "On NixOS" ]
]
@@ -484,20 +472,23 @@ viewResultItem channel showNixOSDetails show item =
]
[ a
[ href "#"
, onClickStop <| SearchMsg (Search.ShowNixOSDetails False)
, Search.onClickStop <|
SearchMsg <|
Search.ShowNixOSDetails False
]
[ text "On non-NixOS" ]
]
]
, div [ class "tab-content" ]
, div
[ class "tab-content" ]
[ div
[ classList
[ ( "tab-pane", True )
, ( "active", not showNixOSDetails )
[ ( "active", not showNixOSDetails )
]
, class "tab-pane"
, id "package-details-nixpkgs"
]
[ pre []
[ pre [ class "code-block" ]
[ text "nix-env -iA nixpkgs."
, strong [] [ text item.source.attr_name ]
]
@@ -525,7 +516,7 @@ viewResultItem channel showNixOSDetails show item =
open =
SearchMsg (Search.ShowDetails item.source.attr_name)
in
[ li
li
[ class "package"
, onClick open
, Search.elementId item.source.attr_name
@@ -540,7 +531,6 @@ viewResultItem channel showNixOSDetails show item =
, shortPackageDetails
]
)
]



22 changes: 22 additions & 0 deletions src/Search.elm
View file
Original file line number Diff line number Diff line change
@@ -16,7 +16,9 @@ module Search exposing
, init
, makeRequest
, makeRequestBody
, onClickStop
, shouldLoad
, trapClick
, update
, view
)
@@ -1164,3 +1166,23 @@ decodeAggregationBucketItem =
Json.Decode.map2 AggregationsBucketItem
(Json.Decode.field "doc_count" Json.Decode.int)
(Json.Decode.field "key" Json.Decode.string)



-- Html Event Helpers


onClickStop : msg -> Html.Attribute msg
onClickStop message =
Html.Events.custom "click" <|
Json.Decode.succeed
{ message = message
, stopPropagation = True
, preventDefault = True
}


trapClick : Html.Attribute (Msg a b)
trapClick =
Html.Events.stopPropagationOn "click" <|
Json.Decode.succeed ( NoOp, True )
21 changes: 19 additions & 2 deletions src/index.less
View file
Original file line number Diff line number Diff line change
@@ -12,6 +12,16 @@
}
}

.search-result-item() {
&:hover {
cursor: pointer;

.search-result-button {
text-decoration: underline;
}
}
}

/* ------------------------------------------------------------------------- */
/* -- Layout --------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
@@ -27,6 +37,11 @@ body {
}
}

.code-block {
display: block;
cursor: text;
}

#content {
padding-bottom: 4rem;
}
@@ -298,6 +313,7 @@ header .navbar.navbar-static-top {
}

&.package {
.search-result-item();

// short details of a pacakge
& > :nth-child(3) {
@@ -341,7 +357,7 @@ header .navbar.navbar-static-top {

div.tab-content {
padding: 1em;
border: 1px solid #ddd;
border: 1px solid #ddd;
border-top: 0;
}

@@ -366,13 +382,14 @@ header .navbar.navbar-static-top {
}

&.option {
.search-result-item();

// short details of a pacakge
& > :nth-child(3) {
margin-top: 1em;
margin-left: 1em;
display: grid;
grid-template-columns: 100px max-content;
grid-template-columns: 100px 1fr;
column-gap: 1em;
row-gap: 0.5em;