Add npm downloads

Author: RoyalIcing

apps/components_guide/lib/components_guide/research/spec.ex

@@ -24,6 +24,23 @@ defmodule ComponentsGuide.Research.Spec do
     end
   end
 
+  def search_for(:npm_downloads_last_month, query) when is_binary(query) do
+    query = String.trim(query)
+    url = "https://api.npmjs.org/downloads/point/last-month/#{query}"
+    {:ok, data} = Source.json_at(url)
+
+    case data do
+      %{"downloads" => downloads_count, "package" => name} ->
+        %{downloads_count: downloads_count, name: name}
+
+      %{"error" => _error_message} ->
+        nil
+
+      _ ->
+        nil
+    end
+  end
+
   def search_for(:whatwg_html_spec, query) when is_binary(query) do
     # url = "https://html.spec.whatwg.org/"
     url = "https://html.spec.whatwg.org/dev/"

apps/components_guide_web/lib/components_guide_web/controllers/research_controller.ex

@@ -84,6 +84,28 @@ defmodule ComponentsGuideWeb.ResearchController do
     end
   end
 
+  defp npm_downloads(query) do
+    case Spec.search_for(:npm_downloads_last_month, query) do
+      %{downloads_count: downloads_count, name: name} ->
+        content_tag(:article, [
+          h2("NPM packages"),
+          Section.card([
+            content_tag(:h3, link(name, to: "https://www.npmjs.com/package/#{name}"), class: "text-2xl"),
+            content_tag(
+              :dl,
+              [
+                content_tag(:dt, "Monthly downloads", class: "text-base font-bold"),
+                content_tag(:dd, "#{downloads_count}")
+              ]
+            )
+          ])
+        ])
+
+      _ ->
+        []
+    end
+  end
+
   defmodule CanIUse do
     alias ComponentsGuideWeb.ResearchController.Section
 
@@ -109,7 +131,9 @@ defmodule ComponentsGuideWeb.ResearchController do
             content_tag(:dt, "Description", class: "font-bold"),
             content_tag(:dd, "#{description}"),
             case notes do
-              "" -> []
+              "" ->
+                []
+
               notes ->
                 [
                   content_tag(:dt, "Notes", class: "font-bold"),
@@ -198,6 +222,7 @@ defmodule ComponentsGuideWeb.ResearchController do
     # ComponentsGuide.Research.Source.clear_cache()
     [
       bundlephobia(query),
+      npm_downloads(query),
       caniuse(query),
       html_spec(query),
       aria_practices(query),