js: packages: Correctly handle searches that yield no results.

* js/controller/packages.js (guix.packages.controller): Do not render
  pagination where there are no search results.
  [emptyPages]: New variable.
  [pages]: Don't chunk when there are no packages.  Return emptyPackages
  instead.

1 files changed, 42 insertions, 31 deletions

diff --git a/js/controller/packages.js b/js/controller/packages.js
index cacfad0..8beeca3 100644
--- a/js/controller/packages.js
+++ b/js/controller/packages.js
@@ -70,9 +70,10 @@
       return sorter.reverse ? sorted.reverse() : sorted;
     });
 
+    var emptyPages = [[]];
     var pages = sortedPackages.map(function(packages) {
-      return guix.chunk(packages, PAGE_SIZE);
-    }).toProperty([[]]);
+      return _.isEmpty(packages) ? emptyPages : guix.chunk(packages, PAGE_SIZE);
+    }).toProperty(emptyPages);
 
     var page = K.combine([
       pages,
@@ -152,8 +153,44 @@
         }, "install");
       }
 
-      var pagination = guix.ui.paginate(page.index, pages.length,
-                                        10, pageIndex);
+      function renderPackageTable() {
+        var pagination = guix.ui.paginate(page.index, pages.length,
+                                          10, pageIndex);
+
+        return [
+          pagination,
+          // Package table
+          m("table.table", [
+            m("thead", [
+              m("tr", [
+                renderHeader("Name", "name"),
+                renderHeader("Version", "version"),
+                renderHeader("Synopsis", "synopsis"),
+                renderHeader("Home page", "homepage"),
+                renderHeader("License", "license"),
+                m("th", "")
+              ])
+            ]),
+            m("tbody", [
+              page.packages.map(function(package) {
+                return m("tr", [
+                  m("td", renderName(package)),
+                  m("td", package.version),
+                  m("td", package.synopsis),
+                  m("td", renderHomepage(package)),
+                  m("td", guix.ui.licenseList(package)),
+                  m("td", renderInstallLink(package))
+                ]);
+              })
+            ])
+          ]),
+          pagination
+        ];
+      }
+
+      function renderNoResults() {
+        return m(".alert.alert-info.text-center", m("strong", "No results"));
+      }
 
       return [
         guix.ui.headerWithBadge("Packages", packages.length),
@@ -165,33 +202,7 @@
           placeholder: "Search",
           oninput: guix.withEmitAttr("value", searchTerm)
         }),
-        pagination,
-        // Package table
-        m("table.table", [
-          m("thead", [
-            m("tr", [
-              renderHeader("Name", "name"),
-              renderHeader("Version", "version"),
-              renderHeader("Synopsis", "synopsis"),
-              renderHeader("Home page", "homepage"),
-              renderHeader("License", "license"),
-              m("th", "")
-            ])
-          ]),
-          m("tbody", [
-            page.packages.map(function(package) {
-              return m("tr", [
-                m("td", renderName(package)),
-                m("td", package.version),
-                m("td", package.synopsis),
-                m("td", renderHomepage(package)),
-                m("td", guix.ui.licenseList(package)),
-                m("td", renderInstallLink(package))
-              ]);
-            })
-          ])
-        ]),
-        pagination
+        _.isEmpty(page.packages) ? renderNoResults() : renderPackageTable()
       ];
     })).map(guix.withLayout);
   };