From 3dceb17085a6e16487d6c9c952b8fe70aa332689 Mon Sep 17 00:00:00 2001
From: shibao <shibao@bubbletea.dev>
Date: Sat, 26 Nov 2022 16:36:30 -0500
Subject: [PATCH] display note backlinks in contexts

---
 lib/memex_web/components/context_content.ex   | 44 +++++++++++++++++++
 lib/memex_web/components/note_card.ex         | 29 ------------
 .../context_live/form_component.html.heex     |  2 +-
 lib/memex_web/live/context_live/show.ex       |  2 +-
 .../live/context_live/show.html.heex          |  9 +---
 priv/gettext/actions.pot                      |  6 +--
 priv/gettext/default.pot                      | 13 +++---
 priv/gettext/prompts.pot                      |  2 +-
 test/memex_web/live/context_live_test.exs     | 26 ++++++++++-
 9 files changed, 81 insertions(+), 52 deletions(-)
 create mode 100644 lib/memex_web/components/context_content.ex
 delete mode 100644 lib/memex_web/components/note_card.ex

diff --git a/lib/memex_web/components/context_content.ex b/lib/memex_web/components/context_content.ex
new file mode 100644
index 0000000..1eac146
--- /dev/null
+++ b/lib/memex_web/components/context_content.ex
@@ -0,0 +1,44 @@
+defmodule MemexWeb.Components.ContextContent do
+  @moduledoc """
+  Display the content for a context
+  """
+  use MemexWeb, :component
+  alias Memex.Contexts.Context
+  alias Phoenix.HTML
+
+  attr :context, Context, required: true
+
+  def context_content(assigns) do
+    ~H"""
+    <div
+      id={"show-context-content-#{@context.id}"}
+      class="input input-primary h-128 min-h-128 inline-block"
+      phx-hook="MaintainAttrs"
+      phx-update="ignore"
+      readonly
+      phx-no-format
+    ><p class="inline"><%= add_links_to_content(@context.content) %></p></div>
+    """
+  end
+
+  defp add_links_to_content(content) do
+    Regex.replace(
+      ~r/\[\[([\p{L}\p{N}\-]+)\]\]/,
+      content,
+      fn _whole_match, slug ->
+        link =
+          HTML.Link.link(
+            "[[#{slug}]]",
+            to: Routes.note_show_path(Endpoint, :show, slug),
+            class: "link inline",
+            data: [qa: "context-note-#{slug}"]
+          )
+          |> HTML.Safe.to_iodata()
+          |> IO.iodata_to_binary()
+
+        "</p>#{link}<p class=\"inline\">"
+      end
+    )
+    |> HTML.raw()
+  end
+end
diff --git a/lib/memex_web/components/note_card.ex b/lib/memex_web/components/note_card.ex
deleted file mode 100644
index 3f306e0..0000000
--- a/lib/memex_web/components/note_card.ex
+++ /dev/null
@@ -1,29 +0,0 @@
-defmodule MemexWeb.Components.NoteCard do
-  @moduledoc """
-  Display card for an note
-  """
-
-  use MemexWeb, :component
-
-  def note_card(assigns) do
-    ~H"""
-    <div class="mx-4 my-2 px-8 py-4 flex flex-col justify-center items-center space-y-4
-      border border-gray-400 rounded-lg shadow-lg hover:shadow-md
-      transition-all duration-300 ease-in-out">
-      <h1 class="title text-xl">
-        <%= @note.name %>
-      </h1>
-
-      <h2 class="title text-md">
-        <%= gettext("visibility: %{visibility}", visibility: @note.visibility) %>
-      </h2>
-
-      <%= if @inner_block do %>
-        <div class="flex space-x-4 justify-center items-center">
-          <%= render_slot(@inner_block) %>
-        </div>
-      <% end %>
-    </div>
-    """
-  end
-end
diff --git a/lib/memex_web/live/context_live/form_component.html.heex b/lib/memex_web/live/context_live/form_component.html.heex
index 65c209a..9c7aa91 100644
--- a/lib/memex_web/live/context_live/form_component.html.heex
+++ b/lib/memex_web/live/context_live/form_component.html.heex
@@ -20,7 +20,7 @@
       class: "input input-primary h-64 min-h-64",
       phx_hook: "MaintainAttrs",
       phx_update: "ignore",
-      placeholder: gettext("content")
+      placeholder: gettext("use [[note-slug]] to link to a note")
     ) %>
     <%= error_tag(f, :content) %>
 
diff --git a/lib/memex_web/live/context_live/show.ex b/lib/memex_web/live/context_live/show.ex
index f478022..c1d7809 100644
--- a/lib/memex_web/live/context_live/show.ex
+++ b/lib/memex_web/live/context_live/show.ex
@@ -1,6 +1,6 @@
 defmodule MemexWeb.ContextLive.Show do
   use MemexWeb, :live_view
-
+  import MemexWeb.Components.ContextContent
   alias Memex.{Accounts.User, Contexts, Contexts.Context}
 
   @impl true
diff --git a/lib/memex_web/live/context_live/show.html.heex b/lib/memex_web/live/context_live/show.html.heex
index ac7000e..0b88abf 100644
--- a/lib/memex_web/live/context_live/show.html.heex
+++ b/lib/memex_web/live/context_live/show.html.heex
@@ -5,14 +5,7 @@
 
   <p><%= if @context.tags, do: @context.tags |> Enum.join(", ") %></p>
 
-  <textarea
-    id="show-context-content"
-    class="input input-primary h-128 min-h-128"
-    phx-hook="MaintainAttrs"
-    phx-update="ignore"
-    readonly
-    phx-no-format
-  ><%= @context.content %></textarea>
+  <.context_content context={@context} />
 
   <p class="self-end">
     <%= gettext("Visibility: %{visibility}", visibility: @context.visibility) %>
diff --git a/priv/gettext/actions.pot b/priv/gettext/actions.pot
index ac59067..4500be4 100644
--- a/priv/gettext/actions.pot
+++ b/priv/gettext/actions.pot
@@ -68,7 +68,7 @@ msgid "create invite"
 msgstr ""
 
 #: lib/memex_web/live/context_live/index.html.heex:49
-#: lib/memex_web/live/context_live/show.html.heex:41
+#: lib/memex_web/live/context_live/show.html.heex:34
 #: lib/memex_web/live/note_live/index.html.heex:49
 #: lib/memex_web/live/note_live/show.html.heex:38
 #: lib/memex_web/live/pipeline_live/index.html.heex:49
@@ -83,7 +83,7 @@ msgid "delete user"
 msgstr ""
 
 #: lib/memex_web/live/context_live/index.html.heex:38
-#: lib/memex_web/live/context_live/show.html.heex:30
+#: lib/memex_web/live/context_live/show.html.heex:23
 #: lib/memex_web/live/note_live/index.html.heex:38
 #: lib/memex_web/live/note_live/show.html.heex:27
 #: lib/memex_web/live/pipeline_live/index.html.heex:38
@@ -141,7 +141,7 @@ msgstr ""
 msgid "save"
 msgstr ""
 
-#: lib/memex_web/live/context_live/show.html.heex:23
+#: lib/memex_web/live/context_live/show.html.heex:16
 #: lib/memex_web/live/note_live/show.html.heex:23
 #: lib/memex_web/live/pipeline_live/show.html.heex:23
 #, elixir-autogen, elixir-format
diff --git a/priv/gettext/default.pot b/priv/gettext/default.pot
index 02cc8af..718afde 100644
--- a/priv/gettext/default.pot
+++ b/priv/gettext/default.pot
@@ -80,7 +80,7 @@ msgstr ""
 msgid "Uses left"
 msgstr ""
 
-#: lib/memex_web/live/context_live/show.html.heex:18
+#: lib/memex_web/live/context_live/show.html.heex:11
 #: lib/memex_web/live/note_live/show.html.heex:18
 #: lib/memex_web/live/pipeline_live/show.html.heex:18
 #, elixir-autogen, elixir-format
@@ -109,7 +109,6 @@ msgstr ""
 
 #: lib/memex_web/components/contexts_table_component.ex:48
 #: lib/memex_web/components/notes_table_component.ex:48
-#: lib/memex_web/live/context_live/form_component.html.heex:23
 #: lib/memex_web/live/note_live/form_component.html.heex:23
 #, elixir-autogen, elixir-format
 msgid "content"
@@ -385,11 +384,6 @@ msgstr ""
 msgid "visibility"
 msgstr ""
 
-#: lib/memex_web/components/note_card.ex:18
-#, elixir-autogen, elixir-format
-msgid "visibility: %{visibility}"
-msgstr ""
-
 #: lib/memex_web/live/note_live/index.ex:29
 #, elixir-autogen, elixir-format
 msgid "new note"
@@ -483,3 +477,8 @@ msgstr ""
 #, elixir-autogen, elixir-format
 msgid "home"
 msgstr ""
+
+#: lib/memex_web/live/context_live/form_component.html.heex:23
+#, elixir-autogen, elixir-format
+msgid "use [[note-slug]] to link to a note"
+msgstr ""
diff --git a/priv/gettext/prompts.pot b/priv/gettext/prompts.pot
index 00fbc40..3217299 100644
--- a/priv/gettext/prompts.pot
+++ b/priv/gettext/prompts.pot
@@ -142,7 +142,7 @@ msgid "are you sure you want to make %{invite_name} unlimited?"
 msgstr ""
 
 #: lib/memex_web/live/context_live/index.html.heex:46
-#: lib/memex_web/live/context_live/show.html.heex:38
+#: lib/memex_web/live/context_live/show.html.heex:31
 #: lib/memex_web/live/note_live/index.html.heex:46
 #: lib/memex_web/live/note_live/show.html.heex:35
 #: lib/memex_web/live/pipeline_live/index.html.heex:46
diff --git a/test/memex_web/live/context_live_test.exs b/test/memex_web/live/context_live_test.exs
index 5837cd7..782b714 100644
--- a/test/memex_web/live/context_live_test.exs
+++ b/test/memex_web/live/context_live_test.exs
@@ -1,8 +1,8 @@
 defmodule MemexWeb.ContextLiveTest do
   use MemexWeb.ConnCase
-
   import Phoenix.LiveViewTest
-  import Memex.ContextsFixtures
+  import Memex.{ContextsFixtures, NotesFixtures}
+  alias MemexWeb.Endpoint
 
   @create_attrs %{
     "content" => "some content",
@@ -132,4 +132,26 @@ defmodule MemexWeb.ContextLiveTest do
       refute has_element?(index_live, "#context-#{context.id}")
     end
   end
+
+  describe "show with note" do
+    setup [:register_and_log_in_user]
+
+    setup %{user: user} do
+      %{slug: note_slug} = note = note_fixture(user)
+
+      [
+        note: note,
+        context:
+          context_fixture(%{content: "example with backlink to [[#{note_slug}]] note"}, user)
+      ]
+    end
+
+    test "displays context", %{conn: conn, context: context, note: %{slug: note_slug}} do
+      {:ok, show_live, html} = live(conn, Routes.context_show_path(conn, :show, context.slug))
+
+      assert html =~ "context"
+      assert html =~ Routes.note_show_path(Endpoint, :show, note_slug)
+      assert has_element?(show_live, "[data-qa=\"context-note-#{note_slug}\"]")
+    end
+  end
 end