backlink to other notes in notes

changelog.md

@@ -1,3 +1,6 @@
+# v0.1.3
+- backlink to other notes in notes
+
 # v0.1.2
 - fix more typos
 - add to faq

lib/memex_web/components/note_content.ex

@@ -0,0 +1,44 @@
+defmodule MemexWeb.Components.NoteContent do
+  @moduledoc """
+  Display the content for a note
+  """
+  use MemexWeb, :component
+  alias Memex.Notes.Note
+  alias Phoenix.HTML
+
+  attr :note, Note, required: true
+
+  def note_content(assigns) do
+    ~H"""
+    <div
+      id={"show-note-content-#{@note.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(@note.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: "note-link-#{slug}"]
+          )
+          |> HTML.Safe.to_iodata()
+          |> IO.iodata_to_binary()
+
+        "</p>#{link}<p class=\"inline\">"
+      end
+    )
+    |> HTML.raw()
+  end
+end

lib/memex_web/live/note_live/show.ex

@@ -1,6 +1,6 @@
 defmodule MemexWeb.NoteLive.Show do
   use MemexWeb, :live_view
-
+  import MemexWeb.Components.NoteContent
   alias Memex.{Accounts.User, Notes, Notes.Note}
 
   @impl true

lib/memex_web/live/note_live/show.html.heex

@@ -5,14 +5,7 @@
 
   <p><%= if @note.tags, do: @note.tags |> Enum.join(", ") %></p>
 
-  <textarea
+  <.note_content note={@note} />
-    id="show-note-content"
-    class="input input-primary h-128 min-h-128"
-    phx-hook="MaintainAttrs"
-    phx-update="ignore"
-    readonly
-    phx-no-format
-  ><%= @note.content %></textarea>
 
   <p class="self-end">
     <%= gettext("Visibility: %{visibility}", visibility: @note.visibility) %>

priv/gettext/actions.pot

@@ -58,7 +58,7 @@ msgstr ""
 #: lib/memex_web/live/context_live/index.html.heex:49
 #: 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/note_live/show.html.heex:31
 #: lib/memex_web/live/pipeline_live/index.html.heex:49
 #: lib/memex_web/live/pipeline_live/show.html.heex:43
 #: lib/memex_web/live/pipeline_live/show.html.heex:113
@@ -74,7 +74,7 @@ msgstr ""
 #: lib/memex_web/live/context_live/index.html.heex:38
 #: 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/note_live/show.html.heex:20
 #: lib/memex_web/live/pipeline_live/index.html.heex:38
 #: lib/memex_web/live/pipeline_live/show.html.heex:32
 #: lib/memex_web/live/pipeline_live/show.html.heex:102
@@ -133,7 +133,7 @@ msgid "save"
 msgstr ""
 
 #: lib/memex_web/live/context_live/show.html.heex:16
-#: lib/memex_web/live/note_live/show.html.heex:23
+#: lib/memex_web/live/note_live/show.html.heex:16
 #: lib/memex_web/live/pipeline_live/show.html.heex:25
 #, elixir-autogen, elixir-format
 msgid "back"

priv/gettext/de/LC_MESSAGES/actions.po

@@ -59,7 +59,7 @@ msgstr ""
 #: lib/memex_web/live/context_live/index.html.heex:49
 #: 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/note_live/show.html.heex:31
 #: lib/memex_web/live/pipeline_live/index.html.heex:49
 #: lib/memex_web/live/pipeline_live/show.html.heex:43
 #: lib/memex_web/live/pipeline_live/show.html.heex:113
@@ -75,7 +75,7 @@ msgstr ""
 #: lib/memex_web/live/context_live/index.html.heex:38
 #: 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/note_live/show.html.heex:20
 #: lib/memex_web/live/pipeline_live/index.html.heex:38
 #: lib/memex_web/live/pipeline_live/show.html.heex:32
 #: lib/memex_web/live/pipeline_live/show.html.heex:102
@@ -134,7 +134,7 @@ msgid "save"
 msgstr ""
 
 #: lib/memex_web/live/context_live/show.html.heex:16
-#: lib/memex_web/live/note_live/show.html.heex:23
+#: lib/memex_web/live/note_live/show.html.heex:16
 #: lib/memex_web/live/pipeline_live/show.html.heex:25
 #, elixir-autogen, elixir-format
 msgid "back"

priv/gettext/de/LC_MESSAGES/default.po

@@ -82,7 +82,7 @@ msgid "Uses left"
 msgstr ""
 
 #: lib/memex_web/live/context_live/show.html.heex:11
-#: lib/memex_web/live/note_live/show.html.heex:18
+#: lib/memex_web/live/note_live/show.html.heex:11
 #: lib/memex_web/live/pipeline_live/show.html.heex:20
 #, elixir-autogen, elixir-format
 msgid "Visibility: %{visibility}"

priv/gettext/de/LC_MESSAGES/prompts.po

@@ -140,7 +140,7 @@ msgstr ""
 #: lib/memex_web/live/context_live/index.html.heex:46
 #: 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/note_live/show.html.heex:28
 #: lib/memex_web/live/pipeline_live/index.html.heex:46
 #: lib/memex_web/live/pipeline_live/show.html.heex:40
 #: lib/memex_web/live/pipeline_live/show.html.heex:110

priv/gettext/default.pot

@@ -71,7 +71,7 @@ msgid "Uses left"
 msgstr ""
 
 #: lib/memex_web/live/context_live/show.html.heex:11
-#: lib/memex_web/live/note_live/show.html.heex:18
+#: lib/memex_web/live/note_live/show.html.heex:11
 #: lib/memex_web/live/pipeline_live/show.html.heex:20
 #, elixir-autogen, elixir-format
 msgid "Visibility: %{visibility}"

priv/gettext/prompts.pot

@@ -139,7 +139,7 @@ msgstr ""
 #: lib/memex_web/live/context_live/index.html.heex:46
 #: 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/note_live/show.html.heex:28
 #: lib/memex_web/live/pipeline_live/index.html.heex:46
 #: lib/memex_web/live/pipeline_live/show.html.heex:40
 #: lib/memex_web/live/pipeline_live/show.html.heex:110

test/memex_web/live/note_live_test.exs

@@ -3,6 +3,7 @@ defmodule MemexWeb.NoteLiveTest do
 
   import Phoenix.LiveViewTest
   import Memex.NotesFixtures
+  alias MemexWeb.Endpoint
 
   @create_attrs %{
     "content" => "some content",
@@ -132,4 +133,31 @@ defmodule MemexWeb.NoteLiveTest do
       refute has_element?(index_live, "#note-#{note.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,
+        backlinked_note:
+          note_fixture(%{content: "example with backlink to [[#{note_slug}]] note"}, user)
+      ]
+    end
+
+    test "displays context", %{
+      conn: conn,
+      backlinked_note: %{slug: backlinked_note_slug},
+      note: %{slug: note_slug}
+    } do
+      {:ok, show_live, html} =
+        live(conn, Routes.note_show_path(conn, :show, backlinked_note_slug))
+
+      assert html =~ "context"
+      assert html =~ Routes.note_show_path(Endpoint, :show, note_slug)
+      assert has_element?(show_live, "[data-qa=\"note-link-#{note_slug}\"]")
+    end
+  end
 end