UI

Author: josevalim

src/hexdocs.gleam

@@ -314,7 +314,13 @@ fn user_submitted_packages_filter(model: Model) {
   model.find_matching_package_version(model, package, version)
   |> result.map(fn(_) {
     let search_packages_filters =
-      [version.Package(name: package, version: version, resolved: True)]
+      [
+        version.Package(
+          name: package,
+          version: version,
+          status: version.Found(version),
+        ),
+      ]
       |> list.append(model.search_packages_filters, _)
       |> list.unique
 

src/hexdocs/data/model.gleam

@@ -238,29 +238,51 @@ pub fn update_route(model: Model, route: uri.Uri) {
     route.Home | route.NotFound -> #(model, effect.none())
     route.Search(q:, packages:) -> {
       let packages = {
-        use #(package, version) <- list.map(packages)
+        use #(package, ver) <- list.map(packages)
         use <- bool.guard(
-          when: version != "latest",
-          return: version.Package(package, version, resolved: True),
+          when: ver != "latest",
+          return: version.Package(
+            name: package,
+            version: ver,
+            status: version.Found(ver),
+          ),
         )
         case dict.get(model.packages_versions, package) {
           // We didn't index it yet
-          Error(_) -> version.Package(package, version, resolved: False)
+          Error(_) ->
+            version.Package(
+              name: package,
+              version: ver,
+              status: version.Loading,
+            )
           // We tried but we could not find it
-          Ok(None) -> version.Package(package, version, resolved: True)
+          Ok(None) ->
+            version.Package(
+              name: package,
+              version: ver,
+              status: version.NotFound,
+            )
           // We found the packages
           Ok(Some(hex_package)) -> {
             case hex_package.releases {
-              [] -> version.Package(package, version, resolved: True)
+              [] ->
+                version.Package(
+                  name: package,
+                  version: ver,
+                  status: version.NotFound,
+                )
               [release, ..] ->
-                version.Package(package, release.version, resolved: True)
+                version.Package(
+                  name: package,
+                  version: ver,
+                  status: version.Found(release.version),
+                )
             }
           }
         }
       }
 
-      let latest =
-        list.filter(packages, fn(p) { p.version == "latest" && !p.resolved })
+      let latest = list.filter(packages, fn(p) { p.status == version.Loading })
 
       let model =
         Model(..model, search_input: q, search_packages_filters: packages)
@@ -417,9 +439,13 @@ fn extract_packages_filters_or_fetches(model: Model) {
     let is_existing_package = list.contains(model.packages, package)
     use <- bool.guard(when: !is_existing_package, return: acc)
     case version {
-      Some(version) -> #(
+      Some(ver) -> #(
         [
-          version.Package(name: package, version: version, resolved: True),
+          version.Package(
+            name: package,
+            version: ver,
+            status: version.Found(ver),
+          ),
           ..filters
         ],
         packages_to_fetch,
@@ -436,7 +462,11 @@ fn extract_packages_filters_or_fetches(model: Model) {
                 let ver = release.version
                 #(
                   [
-                    version.Package(name: package, version: ver, resolved: True),
+                    version.Package(
+                      name: package,
+                      version: ver,
+                      status: version.Found(ver),
+                    ),
                     ..filters
                   ],
                   packages_to_fetch,

src/hexdocs/data/model/version.gleam

@@ -3,9 +3,16 @@ import gleam/regexp
 
 const input_regexp = "^#(\\w+)(:([0-9]+\\.[\\w+.-]+))?"
 
+/// Status of a package version resolution.
+pub type Status {
+  Loading
+  NotFound
+  Found(String)
+}
+
 /// Represents a package filter with its name, version, and resolution status.
 pub type Package {
-  Package(name: String, version: String, resolved: Bool)
+  Package(name: String, version: String, status: Status)
 }
 
 pub fn input_match_package(

src/hexdocs/services/hexdocs.gleam

@@ -174,8 +174,12 @@ fn add_filter_by_packages_param(
 ) -> List(#(String, String)) {
   use <- bool.guard(when: list.is_empty(packages), return: query)
   packages
-  |> list.filter(fn(p) { p.resolved })
-  |> list.map(fn(p) { p.name <> "-" <> p.version })
+  |> list.filter_map(fn(p) {
+    case p.status {
+      version.Found(ver) -> Ok(p.name <> "-" <> ver)
+      _ -> Error(Nil)
+    }
+  })
   |> list.map(string.append("package:=", _))
   |> string.join("||")
   |> list.key_set(query, "filter_by", _)

src/hexdocs/view/search.gleam

@@ -235,7 +235,11 @@ pub fn search(model: Model) {
                   use filter <- list.map(sorted_filters)
                   html.div([class("flex justify-between items-center mt-4")], [
                     html.div(
-                      [class("inline-flex flex-col justify-start items-start")],
+                      [
+                        class(
+                          "inline-flex flex-col justify-start items-start gap-1",
+                        ),
+                      ],
                       [
                         html.div(
                           [
@@ -251,14 +255,24 @@ pub fn search(model: Model) {
                               "self-stretch justify-start text-slate-700 dark:text-slate-400 text-sm font-normal leading-none",
                             ),
                           ],
-                          // You can add any loader you want here.
-                          case filter.version {
-                            "latest" ->
-                              case filter.resolved {
-                                True -> [html.text("Loading…")]
-                                False -> [html.text("Not found")]
+                          case filter.status {
+                            version.Loading -> [
+                              html.text("latest (loading…)"),
+                            ]
+
+                            version.NotFound -> [
+                              html.text("latest "),
+                              html.span([class("text-red-700")], [
+                                html.text("(not found)"),
+                              ]),
+                            ]
+                            version.Found(ver) ->
+                              case filter.version {
+                                "latest" -> [
+                                  html.text("latest (" <> ver <> ")"),
+                                ]
+                                _ -> [html.text(ver)]
                               }
-                            version -> [html.text(version)]
                           },
                         ),
                       ],