Feat: Add reading_time component (#388)

lib/beacon_web/components/components.ex

@@ -32,6 +32,26 @@ defmodule BeaconWeb.Components do
     """
   end
 
+  @doc """
+  Renders a the amount in minutes for a page to be read.
+
+  ## Examples
+
+      <BeaconWeb.Components.reading_time />
+  """
+
+  def reading_time(assigns) do
+    %{template: content} = Beacon.Content.get_page_by(Process.get(:__beacon_site__), path: Process.get(:__beacon_page_path__))
+    content_without_html_tags = String.replace(content, ~r/(<[^>]*>|\n|\s{2,})/, "", global: true)
+    words_per_minute = 270
+    estimated_time_in_minutes = Kernel.trunc((String.split(content_without_html_tags, " ") |> length()) / words_per_minute)
+    assigns = Map.put(assigns, :estimated_time_in_minutes, estimated_time_in_minutes)
+
+    ~H"""
+    <%= @estimated_time_in_minutes %>
+    """
+  end
+
   @doc """
   Renders a image previously uploaded in Admin Media Library with srcset.
 

lib/beacon_web/live/page_live.ex

@@ -78,9 +78,10 @@ defmodule BeaconWeb.PageLive do
     %{"path" => path} = params
     %{__site__: site} = socket.assigns
     live_data = Beacon.DataSource.live_data(site, path, Map.drop(params, ["path"]))
-    {{_site, _path}, {page_id, layout_id, _format, page_module, component_module}} = lookup_route!(site, path)
+    {{_site, beacon_page_path}, {page_id, layout_id, _format, page_module, component_module}} = lookup_route!(site, path)
 
     Process.put(:__beacon_site__, site)
+    Process.put(:__beacon_page_path__, beacon_page_path)
 
     socket =
       socket

mix.exs

@@ -62,6 +62,7 @@ defmodule Beacon.MixProject do
       {:safe_code, github: "TheFirstAvenger/safe_code"},
       {:tailwind, "~> 0.2"},
       {:rustler, ">= 0.0.0", optional: true},
+      {:faker, "~> 0.17", only: :test},
       live_monaco_editor_dep(),
       mdex_dep()
     ]

mix.lock

@@ -23,6 +23,7 @@
   "ex_brotli": {:hex, :ex_brotli, "0.3.0", "69d5f3720df70d5c89d1395d8fbe49ba37466b626834aaf6d77c72e0c93cf975", [:mix], [{:phoenix, ">= 0.0.0", [hex: :phoenix, repo: "hexpm", optional: false]}, {:rustler, "~> 0.29", [hex: :rustler, repo: "hexpm", optional: true]}, {:rustler_precompiled, "~> 0.6", [hex: :rustler_precompiled, repo: "hexpm", optional: false]}], "hexpm", "8e46982f7d20069419ca8c8c54f9f3ebd9fa0e1d094c54cbf8ce3d636d84dfa7"},
   "ex_doc": {:hex, :ex_doc, "0.29.4", "6257ecbb20c7396b1fe5accd55b7b0d23f44b6aa18017b415cb4c2b91d997729", [:mix], [{:earmark_parser, "~> 1.4.31", [hex: :earmark_parser, repo: "hexpm", optional: false]}, {:makeup_elixir, "~> 0.14", [hex: :makeup_elixir, repo: "hexpm", optional: false]}, {:makeup_erlang, "~> 0.1", [hex: :makeup_erlang, repo: "hexpm", optional: false]}], "hexpm", "2c6699a737ae46cb61e4ed012af931b57b699643b24dabe2400a8168414bc4f5"},
   "expo": {:hex, :expo, "0.4.1", "1c61d18a5df197dfda38861673d392e642649a9cef7694d2f97a587b2cfb319b", [:mix], [], "hexpm", "2ff7ba7a798c8c543c12550fa0e2cbc81b95d4974c65855d8d15ba7b37a1ce47"},
+  "faker": {:hex, :faker, "0.17.0", "671019d0652f63aefd8723b72167ecdb284baf7d47ad3a82a15e9b8a6df5d1fa", [:mix], [], "hexpm", "a7d4ad84a93fd25c5f5303510753789fc2433ff241bf3b4144d3f6f291658a6a"},
   "file_system": {:hex, :file_system, "0.2.10", "fb082005a9cd1711c05b5248710f8826b02d7d1784e7c3451f9c1231d4fc162d", [:mix], [], "hexpm", "41195edbfb562a593726eda3b3e8b103a309b733ad25f3d642ba49696bf715dc"},
   "floki": {:hex, :floki, "0.34.3", "5e2dcaec5d7c228ce5b1d3501502e308b2d79eb655e4191751a1fe491c37feac", [:mix], [], "hexpm", "9577440eea5b97924b4bf3c7ea55f7b8b6dce589f9b28b096cc294a8dc342341"},
   "gettext": {:hex, :gettext, "0.22.2", "6bfca374de34ecc913a28ba391ca184d88d77810a3e427afa8454a71a51341ac", [:mix], [{:expo, "~> 0.4.0", [hex: :expo, repo: "hexpm", optional: false]}], "hexpm", "8a2d389673aea82d7eae387e6a2ccc12660610080ae7beb19452cfdc1ec30f60"},

test/beacon_web/components/components_test.exs

@@ -0,0 +1,46 @@
+defmodule BeaconWeb.ComponentsTest do
+  use BeaconWeb.ConnCase, async: false
+
+  import Phoenix.LiveViewTest
+  import Phoenix.ConnTest
+  import Beacon.Fixtures
+
+  setup_all do
+    start_supervised!({Beacon.Loader, Beacon.Config.fetch!(:my_site)})
+    :ok
+  end
+
+  describe "image" do
+    setup context do
+      create_page_with_component("""
+      <main>
+        <p>
+        #{Faker.Lorem.words(901) |> Enum.join(" ")}
+        </p>
+        <BeaconWeb.Components.reading_time /> min to read
+      </main>
+      """)
+
+      context
+    end
+
+    test "SUCCESS: reading_time should show 1 min to read the page", %{conn: conn} do
+      {:ok, view, _html} = live(conn, "/home")
+
+      assert render(view) =~ "3 min to read"
+    end
+  end
+
+  defp create_page_with_component(template) do
+    layout = published_layout_fixture()
+
+    published_page_fixture(
+      layout_id: layout.id,
+      path: "home",
+      template: template
+    )
+
+    Beacon.Loader.load_components(:my_site)
+    Beacon.Loader.load_pages(:my_site)
+  end
+end