From 5cde99de909ff2dc1bf16089285745791e11380b Mon Sep 17 00:00:00 2001
From: shibao <shibao@bubbletea.dev>
Date: Thu, 16 Mar 2023 19:49:19 -0400
Subject: [PATCH] use core components

---
 lib/memex_web.ex                              |   5 +-
 lib/memex_web/components/context_content.ex   |  44 ----
 lib/memex_web/components/core_components.ex   | 204 ++++++++++++++++++
 .../core_components/modal.html.heex           |  41 ++++
 .../core_components/toggle_button.html.heex   |  30 +++
 .../core_components/topbar.html.heex          | 113 ++++++++++
 .../core_components/user_card.html.heex       |  37 ++++
 lib/memex_web/components/invite_card.ex       |  72 -------
 lib/memex_web/components/note_content.ex      |  44 ----
 lib/memex_web/components/step_content.ex      |  44 ----
 lib/memex_web/components/topbar.ex            | 131 -----------
 lib/memex_web/components/user_card.ex         |  53 -----
 .../live/context_live/index.html.heex         |   3 +-
 lib/memex_web/live/context_live/show.ex       |   1 -
 lib/memex_web/live/invite_live/index.ex       |   1 -
 lib/memex_web/live/live_helpers.ex            | 135 ------------
 lib/memex_web/live/note_live/index.html.heex  |   3 +-
 lib/memex_web/live/note_live/show.ex          |   1 -
 .../live/pipeline_live/index.html.heex        |   3 +-
 lib/memex_web/live/pipeline_live/show.ex      |   1 -
 .../templates/user_confirmation/new.html.heex |   3 +-
 .../user_reset_password/new.html.heex         |   3 +-
 lib/memex_web/views/error_view.ex             |   1 -
 lib/memex_web/views/layout_view.ex            |   1 -
 mix.exs                                       |   4 +-
 mix.lock                                      |  33 +--
 priv/gettext/actions.pot                      |  34 +--
 priv/gettext/de/LC_MESSAGES/actions.po        |  34 +--
 priv/gettext/de/LC_MESSAGES/default.po        |  84 ++++----
 priv/gettext/de/LC_MESSAGES/errors.po         |   8 +-
 priv/gettext/de/LC_MESSAGES/prompts.po        |  20 +-
 priv/gettext/default.pot                      |  84 ++++----
 priv/gettext/en/LC_MESSAGES/actions.po        |  34 +--
 priv/gettext/en/LC_MESSAGES/default.po        |  84 ++++----
 priv/gettext/en/LC_MESSAGES/errors.po         |   8 +-
 priv/gettext/en/LC_MESSAGES/prompts.po        |  20 +-
 priv/gettext/errors.pot                       |   8 +-
 priv/gettext/prompts.pot                      |  20 +-
 38 files changed, 675 insertions(+), 774 deletions(-)
 delete mode 100644 lib/memex_web/components/context_content.ex
 create mode 100644 lib/memex_web/components/core_components.ex
 create mode 100644 lib/memex_web/components/core_components/modal.html.heex
 create mode 100644 lib/memex_web/components/core_components/toggle_button.html.heex
 create mode 100644 lib/memex_web/components/core_components/topbar.html.heex
 create mode 100644 lib/memex_web/components/core_components/user_card.html.heex
 delete mode 100644 lib/memex_web/components/invite_card.ex
 delete mode 100644 lib/memex_web/components/note_content.ex
 delete mode 100644 lib/memex_web/components/step_content.ex
 delete mode 100644 lib/memex_web/components/topbar.ex
 delete mode 100644 lib/memex_web/components/user_card.ex
 delete mode 100644 lib/memex_web/live/live_helpers.ex

diff --git a/lib/memex_web.ex b/lib/memex_web.ex
index 130239d..9b5a8c1 100644
--- a/lib/memex_web.ex
+++ b/lib/memex_web.ex
@@ -45,8 +45,7 @@ defmodule MemexWeb do
 
   def live_view do
     quote do
-      use Phoenix.LiveView,
-        layout: {MemexWeb.LayoutView, "live.html"}
+      use Phoenix.LiveView, layout: {MemexWeb.LayoutView, :live}
 
       on_mount MemexWeb.InitAssigns
       unquote(view_helpers())
@@ -96,7 +95,7 @@ defmodule MemexWeb do
       # Import LiveView and .heex helpers (live_render, link, <.form>, etc)
       # Import basic rendering functionality (render, render_layout, etc)
       import Phoenix.{Component, View}
-      import MemexWeb.{ErrorHelpers, Gettext, LiveHelpers, ViewHelpers}
+      import MemexWeb.{ErrorHelpers, Gettext, CoreComponents, ViewHelpers}
 
       # credo:disable-for-next-line Credo.Check.Consistency.MultiAliasImportRequireUse
       alias MemexWeb.Endpoint
diff --git a/lib/memex_web/components/context_content.ex b/lib/memex_web/components/context_content.ex
deleted file mode 100644
index 86052e0..0000000
--- a/lib/memex_web/components/context_content.ex
+++ /dev/null
@@ -1,44 +0,0 @@
-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 whitespace-pre-wrap overflow-x-hidden overflow-y-auto"
-      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/core_components.ex b/lib/memex_web/components/core_components.ex
new file mode 100644
index 0000000..1f9e36b
--- /dev/null
+++ b/lib/memex_web/components/core_components.ex
@@ -0,0 +1,204 @@
+defmodule MemexWeb.CoreComponents do
+  @moduledoc """
+  Provides core UI components.
+  """
+  use Phoenix.Component
+  import MemexWeb.{Gettext, ViewHelpers}
+  alias Memex.{Accounts, Accounts.Invite, Accounts.Invites, Accounts.User}
+  alias Memex.Contexts.Context
+  alias Memex.Notes.Note
+  alias Memex.Pipelines.Steps.Step
+  alias MemexWeb.{Endpoint, HomeLive}
+  alias MemexWeb.Router.Helpers, as: Routes
+  alias Phoenix.HTML
+  alias Phoenix.LiveView.JS
+
+  embed_templates("core_components/*")
+
+  attr :title_content, :string, default: nil
+  attr :current_user, User, default: nil
+
+  def topbar(assigns)
+
+  attr :return_to, :string, required: true
+  slot(:inner_block)
+
+  @doc """
+  Renders a live component inside a modal.
+
+  The rendered modal receives a `:return_to` option to properly update
+  the URL when the modal is closed.
+
+  ## Examples
+
+      <.modal return_to={Routes.<%= schema.singular %>_index_path(Endpoint, :index)}>
+        <.live_component
+          module={<%= inspect context.web_module %>.<%= inspect Module.concat(schema.web_namespace, schema.alias) %>Live.FormComponent}
+          id={@<%= schema.singular %>.id || :new}
+          title={@page_title}
+          action={@live_action}
+          return_to={Routes.<%= schema.singular %>_index_path(Endpoint, :index)}
+          <%= schema.singular %>: @<%= schema.singular %>
+        />
+      </.modal>
+  """
+  def modal(assigns)
+
+  defp hide_modal(js \\ %JS{}) do
+    js
+    |> JS.hide(to: "#modal", transition: "fade-out")
+    |> JS.hide(to: "#modal-bg", transition: "fade-out")
+    |> JS.hide(to: "#modal-content", transition: "fade-out-scale")
+  end
+
+  attr :action, :string, required: true
+  attr :value, :boolean, required: true
+  attr :id, :string, default: nil
+  slot(:inner_block)
+
+  @doc """
+  A toggle button element that can be directed to a liveview or a
+  live_component's `handle_event/3`.
+
+  ## Examples
+
+  <.toggle_button action="my_liveview_action" value={@some_value}>
+    <span>Toggle me!</span>
+  </.toggle_button>
+  <.toggle_button action="my_live_component_action" target={@myself} value={@some_value}>
+    <span>Whatever you want</span>
+  </.toggle_button>
+  """
+  def toggle_button(assigns)
+
+  attr :user, User, required: true
+  slot(:inner_block, required: true)
+
+  def user_card(assigns)
+
+  attr :invite, Invite, required: true
+  attr :current_user, User, required: true
+  slot(:inner_block)
+  slot(:code_actions)
+
+  def invite_card(%{invite: invite, current_user: current_user} = assigns) do
+    assigns = assigns |> assign(:use_count, Invites.get_use_count(invite, current_user))
+
+    ~H"""
+    <div class="px-8 py-4 flex flex-col justify-center items-center space-y-4
+      bg-primary-900
+      border border-gray-400 rounded-lg shadow-lg hover:shadow-md
+      transition-all duration-300 ease-in-out">
+      <h1 class="title text-xl">
+        <%= @invite.name %>
+      </h1>
+
+      <%= if @invite.disabled_at |> is_nil() do %>
+        <h2 class="title text-md">
+          <%= if @invite.uses_left do %>
+            <%= gettext(
+              "uses left: %{uses_left_count}",
+              uses_left_count: @invite.uses_left
+            ) %>
+          <% else %>
+            <%= gettext("uses left: unlimited") %>
+          <% end %>
+        </h2>
+      <% else %>
+        <h2 class="title text-md">
+          <%= gettext("invite disabled") %>
+        </h2>
+      <% end %>
+
+      <.qr_code
+        content={Routes.user_registration_url(Endpoint, :new, invite: @invite.token)}
+        filename={@invite.name}
+      />
+
+      <h2 :if={@use_count != 0} class="title text-md">
+        <%= gettext("uses: %{uses_count}", uses_count: @use_count) %>
+      </h2>
+
+      <div class="flex flex-row flex-wrap justify-center items-center">
+        <code
+          id={"code-#{@invite.id}"}
+          class="mx-2 my-1 text-xs px-4 py-2 rounded-lg text-center break-all
+            text-primary-400 bg-primary-800"
+          phx-no-format
+        ><%= Routes.user_registration_url(Endpoint, :new, invite: @invite.token) %></code>
+        <%= if @code_actions, do: render_slot(@code_actions) %>
+      </div>
+
+      <div :if={@inner_block} class="flex space-x-4 justify-center items-center">
+        <%= render_slot(@inner_block) %>
+      </div>
+    </div>
+    """
+  end
+
+  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 whitespace-pre-wrap overflow-x-hidden overflow-y-auto"
+      phx-hook="MaintainAttrs"
+      phx-update="ignore"
+      readonly
+      phx-no-format
+    ><p class="inline"><%= add_links_to_content(@note.content, "note-link") %></p></div>
+    """
+  end
+
+  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 whitespace-pre-wrap overflow-x-hidden overflow-y-auto"
+      phx-hook="MaintainAttrs"
+      phx-update="ignore"
+      readonly
+      phx-no-format
+    ><p class="inline"><%= add_links_to_content(@context.content, "context-note") %></p></div>
+    """
+  end
+
+  attr :step, Step, required: true
+
+  def step_content(assigns) do
+    ~H"""
+    <div
+      id={"show-step-content-#{@step.id}"}
+      class="input input-primary h-32 min-h-32 inline-block whitespace-pre-wrap overflow-x-hidden overflow-y-auto"
+      phx-hook="MaintainAttrs"
+      phx-update="ignore"
+      readonly
+      phx-no-format
+    ><p class="inline"><%= add_links_to_content(@step.content, "step-context") %></p></div>
+    """
+  end
+
+  defp add_links_to_content(content, data_qa_prefix) 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: "#{data_qa_prefix}-#{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/core_components/modal.html.heex b/lib/memex_web/components/core_components/modal.html.heex
new file mode 100644
index 0000000..13376d0
--- /dev/null
+++ b/lib/memex_web/components/core_components/modal.html.heex
@@ -0,0 +1,41 @@
+<.link
+  id="modal-bg"
+  patch={@return_to}
+  class="fade-in fixed z-10 left-0 top-0
+    w-full h-full overflow-hidden
+    p-8 flex flex-col justify-center items-center cursor-auto"
+  style="background-color: rgba(0,0,0,0.4);"
+  phx-remove={hide_modal()}
+>
+  <span class="hidden"></span>
+</.link>
+
+<div
+  id="modal"
+  class="fixed z-10 left-0 top-0 pointer-events-none
+    w-full h-full overflow-hidden
+    p-4 sm:p-8 flex flex-col justify-center items-center"
+>
+  <div
+    id="modal-content"
+    class="fade-in-scale max-w-3xl max-h-3xl relative w-full
+      pointer-events-auto overflow-hidden
+      px-8 py-4 sm:py-8 flex flex-col justify-start items-stretch
+      bg-primary-800 text-primary-400 border-primary-900 border-2 rounded-lg"
+  >
+    <.link
+      patch={@return_to}
+      id="close"
+      class="absolute top-8 right-10
+        text-gray-500 hover:text-gray-800
+        transition-all duration-500 ease-in-out"
+      phx-remove={hide_modal()}
+    >
+      <i class="fa-fw fa-lg fas fa-times"></i>
+    </.link>
+
+    <div class="overflow-x-hidden overflow-y-auto w-full p-8 flex flex-col space-y-4 justify-start items-stretch">
+      <%= render_slot(@inner_block) %>
+    </div>
+  </div>
+</div>
diff --git a/lib/memex_web/components/core_components/toggle_button.html.heex b/lib/memex_web/components/core_components/toggle_button.html.heex
new file mode 100644
index 0000000..89ff665
--- /dev/null
+++ b/lib/memex_web/components/core_components/toggle_button.html.heex
@@ -0,0 +1,30 @@
+<label for={@id || @action} class="inline-flex relative items-center cursor-pointer">
+  <input
+    id={@id || @action}
+    type="checkbox"
+    value={@value}
+    checked={@value}
+    class="sr-only peer"
+    aria-labelledby={"#{@id || @action}-label"}
+    {
+      if assigns |> Map.has_key?(:target),
+        do: %{"phx-click": @action, "phx-value-value": @value, "phx-target": @target},
+        else: %{"phx-click": @action, "phx-value-value": @value}
+    }
+  />
+  <div class="w-11 h-6 bg-gray-300 rounded-full peer
+    peer-focus:ring-4 peer-focus:ring-teal-300 dark:peer-focus:ring-teal-800
+    peer-checked:bg-gray-600
+    peer-checked:after:translate-x-full peer-checked:after:border-white
+    after:content-[''] after:absolute after:top-1 after:left-[2px] after:bg-white after:border-gray-300
+    after:border after:rounded-full after:h-5 after:w-5
+    after:transition-all after:duration-250 after:ease-in-out
+    transition-colors duration-250 ease-in-out">
+  </div>
+  <span
+    id={"#{@id || @action}-label"}
+    class="ml-3 text-sm font-medium text-gray-900 dark:text-gray-300"
+  >
+    <%= render_slot(@inner_block) %>
+  </span>
+</label>
diff --git a/lib/memex_web/components/core_components/topbar.html.heex b/lib/memex_web/components/core_components/topbar.html.heex
new file mode 100644
index 0000000..970e607
--- /dev/null
+++ b/lib/memex_web/components/core_components/topbar.html.heex
@@ -0,0 +1,113 @@
+<nav role="navigation" class="mb-8 px-8 py-4 w-full bg-primary-900 text-primary-400">
+  <div class="flex flex-col sm:flex-row justify-between items-center">
+    <div class="mb-4 sm:mb-0 sm:mr-8 flex flex-row justify-start items-center space-x-2">
+      <.link
+        navigate={Routes.live_path(Endpoint, HomeLive)}
+        class="mx-2 my-1 leading-5 text-xl text-primary-400 hover:underline"
+      >
+        <%= gettext("memEx") %>
+      </.link>
+
+      <%= if @title_content do %>
+        <span class="mx-2 my-1">
+          |
+        </span>
+        <%= @title_content %>
+      <% end %>
+    </div>
+
+    <hr class="mb-2 sm:hidden hr-light" />
+
+    <ul class="flex flex-row flex-wrap justify-center items-center
+      text-lg text-primary-400 text-ellipsis">
+      <li class="mx-2 my-1">
+        <.link
+          navigate={Routes.note_index_path(Endpoint, :index)}
+          class="text-primary-400 hover:underline truncate"
+        >
+          <%= gettext("notes") %>
+        </.link>
+      </li>
+
+      <li class="mx-2 my-1">
+        <.link
+          navigate={Routes.context_index_path(Endpoint, :index)}
+          class="text-primary-400 hover:underline truncate"
+        >
+          <%= gettext("contexts") %>
+        </.link>
+      </li>
+
+      <li class="mx-2 my-1">
+        <.link
+          navigate={Routes.pipeline_index_path(Endpoint, :index)}
+          class="text-primary-400 hover:underline truncate"
+        >
+          <%= gettext("pipelines") %>
+        </.link>
+      </li>
+
+      <li class="mx-2 my-1 border-left border border-primary-700">​</li>
+
+      <%= if @current_user do %>
+        <li :if={@current_user |> Accounts.is_already_admin?()} class="mx-2 my-1">
+          <.link
+            navigate={Routes.invite_index_path(Endpoint, :index)}
+            class="text-primary-400 hover:underline"
+          >
+            <%= gettext("invites") %>
+          </.link>
+        </li>
+
+        <li class="mx-2 my-1">
+          <.link
+            navigate={Routes.user_settings_path(Endpoint, :edit)}
+            class="text-primary-400 hover:underline truncate"
+          >
+            <%= @current_user.email %>
+          </.link>
+        </li>
+        <li class="mx-2 my-1">
+          <.link
+            href={Routes.user_session_path(Endpoint, :delete)}
+            method="delete"
+            data-confirm={dgettext("prompts", "are you sure you want to log out?")}
+          >
+            <i class="fas fa-sign-out-alt"></i>
+          </.link>
+        </li>
+        <li
+          :if={
+            @current_user.role == :admin and function_exported?(Routes, :live_dashboard_path, 2)
+          }
+          class="mx-2 my-1"
+        >
+          <.link
+            navigate={Routes.live_dashboard_path(Endpoint, :home)}
+            class="text-primary-400 hover:underline"
+          >
+            <i class="fas fa-gauge"></i>
+          </.link>
+        </li>
+      <% else %>
+        <li :if={Accounts.allow_registration?()} class="mx-2 my-1">
+          <.link
+            href={Routes.user_registration_path(Endpoint, :new)}
+            class="text-primary-400 hover:underline truncate"
+          >
+            <%= dgettext("actions", "register") %>
+          </.link>
+        </li>
+
+        <li class="mx-2 my-1">
+          <.link
+            href={Routes.user_session_path(Endpoint, :new)}
+            class="text-primary-400 hover:underline truncate"
+          >
+            <%= dgettext("actions", "log in") %>
+          </.link>
+        </li>
+      <% end %>
+    </ul>
+  </div>
+</nav>
diff --git a/lib/memex_web/components/core_components/user_card.html.heex b/lib/memex_web/components/core_components/user_card.html.heex
new file mode 100644
index 0000000..6da4b13
--- /dev/null
+++ b/lib/memex_web/components/core_components/user_card.html.heex
@@ -0,0 +1,37 @@
+<div
+  id={"user-#{@user.id}"}
+  class="px-8 py-4 flex flex-col justify-center items-center text-center
+    bg-primary-900
+    border border-gray-400 rounded-lg shadow-lg hover:shadow-md
+    transition-all duration-300 ease-in-out"
+>
+  <h1 class="px-4 py-2 rounded-lg title text-xl break-all">
+    <%= @user.email %>
+  </h1>
+
+  <h3 class="px-4 py-2 rounded-lg title text-lg">
+    <p>
+      <%= if @user.confirmed_at do %>
+        <%= gettext(
+          "user confirmed on%{confirmed_datetime}",
+          confirmed_datetime: ""
+        ) %>
+        <.datetime datetime={@user.confirmed_at} />
+      <% else %>
+        <%= gettext("email unconfirmed") %>
+      <% end %>
+    </p>
+
+    <p>
+      <%= gettext(
+        "user registered on%{registered_datetime}",
+        registered_datetime: ""
+      ) %>
+      <.datetime datetime={@user.inserted_at} />
+    </p>
+  </h3>
+
+  <div :if={@inner_block} class="px-4 py-2 flex space-x-4 justify-center items-center">
+    <%= render_slot(@inner_block) %>
+  </div>
+</div>
diff --git a/lib/memex_web/components/invite_card.ex b/lib/memex_web/components/invite_card.ex
deleted file mode 100644
index c1fd915..0000000
--- a/lib/memex_web/components/invite_card.ex
+++ /dev/null
@@ -1,72 +0,0 @@
-defmodule MemexWeb.Components.InviteCard do
-  @moduledoc """
-  Display card for an invite
-  """
-
-  use MemexWeb, :component
-  alias Memex.Accounts.{Invite, Invites, User}
-  alias MemexWeb.Endpoint
-
-  attr :invite, Invite, required: true
-  attr :current_user, User, required: true
-  slot(:inner_block)
-  slot(:code_actions)
-
-  def invite_card(%{invite: invite, current_user: current_user} = assigns) do
-    assigns =
-      assigns
-      |> assign(:use_count, Invites.get_use_count(invite, current_user))
-      |> assign_new(:code_actions, fn -> [] end)
-
-    ~H"""
-    <div class="px-8 py-4 flex flex-col justify-center items-center space-y-4
-      bg-primary-900
-      border border-gray-400 rounded-lg shadow-lg hover:shadow-md
-      transition-all duration-300 ease-in-out">
-      <h1 class="title text-xl">
-        <%= @invite.name %>
-      </h1>
-
-      <%= if @invite.disabled_at |> is_nil() do %>
-        <h2 class="title text-md">
-          <%= if @invite.uses_left do %>
-            <%= gettext(
-              "uses left: %{uses_left_count}",
-              uses_left_count: @invite.uses_left
-            ) %>
-          <% else %>
-            <%= gettext("uses left: unlimited") %>
-          <% end %>
-        </h2>
-      <% else %>
-        <h2 class="title text-md">
-          <%= gettext("invite disabled") %>
-        </h2>
-      <% end %>
-
-      <.qr_code
-        content={Routes.user_registration_url(Endpoint, :new, invite: @invite.token)}
-        filename={@invite.name}
-      />
-
-      <h2 :if={@use_count != 0} class="title text-md">
-        <%= gettext("uses: %{uses_count}", uses_count: @use_count) %>
-      </h2>
-
-      <div class="flex flex-row flex-wrap justify-center items-center">
-        <code
-          id={"code-#{@invite.id}"}
-          class="mx-2 my-1 text-xs px-4 py-2 rounded-lg text-center break-all
-            text-primary-400 bg-primary-800"
-          phx-no-format
-        ><%= Routes.user_registration_url(Endpoint, :new, invite: @invite.token) %></code>
-        <%= render_slot(@code_actions) %>
-      </div>
-
-      <div :if={@inner_block} class="flex space-x-4 justify-center items-center">
-        <%= render_slot(@inner_block) %>
-      </div>
-    </div>
-    """
-  end
-end
diff --git a/lib/memex_web/components/note_content.ex b/lib/memex_web/components/note_content.ex
deleted file mode 100644
index ea77f50..0000000
--- a/lib/memex_web/components/note_content.ex
+++ /dev/null
@@ -1,44 +0,0 @@
-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 whitespace-pre-wrap overflow-x-hidden overflow-y-auto"
-      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
diff --git a/lib/memex_web/components/step_content.ex b/lib/memex_web/components/step_content.ex
deleted file mode 100644
index f1c240f..0000000
--- a/lib/memex_web/components/step_content.ex
+++ /dev/null
@@ -1,44 +0,0 @@
-defmodule MemexWeb.Components.StepContent do
-  @moduledoc """
-  Display the content for a step
-  """
-  use MemexWeb, :component
-  alias Memex.Pipelines.Steps.Step
-  alias Phoenix.HTML
-
-  attr :step, Step, required: true
-
-  def step_content(assigns) do
-    ~H"""
-    <div
-      id={"show-step-content-#{@step.id}"}
-      class="input input-primary h-32 min-h-32 inline-block whitespace-pre-wrap overflow-x-hidden overflow-y-auto"
-      phx-hook="MaintainAttrs"
-      phx-update="ignore"
-      readonly
-      phx-no-format
-    ><p class="inline"><%= add_links_to_content(@step.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.context_show_path(Endpoint, :show, slug),
-            class: "link inline",
-            data: [qa: "step-context-#{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/topbar.ex b/lib/memex_web/components/topbar.ex
deleted file mode 100644
index 93e9be9..0000000
--- a/lib/memex_web/components/topbar.ex
+++ /dev/null
@@ -1,131 +0,0 @@
-defmodule MemexWeb.Components.Topbar do
-  @moduledoc """
-  Component that renders a topbar with user functions/links
-  """
-
-  use MemexWeb, :component
-
-  alias Memex.Accounts
-  alias MemexWeb.HomeLive
-
-  def topbar(assigns) do
-    assigns =
-      %{results: [], title_content: nil, flash: nil, current_user: nil} |> Map.merge(assigns)
-
-    ~H"""
-    <nav role="navigation" class="mb-8 px-8 py-4 w-full bg-primary-900 text-primary-400">
-      <div class="flex flex-col sm:flex-row justify-between items-center">
-        <div class="mb-4 sm:mb-0 sm:mr-8 flex flex-row justify-start items-center space-x-2">
-          <.link
-            navigate={Routes.live_path(Endpoint, HomeLive)}
-            class="mx-2 my-1 leading-5 text-xl text-primary-400 hover:underline"
-          >
-            <%= gettext("memEx") %>
-          </.link>
-
-          <%= if @title_content do %>
-            <span class="mx-2 my-1">
-              |
-            </span>
-            <%= @title_content %>
-          <% end %>
-        </div>
-
-        <hr class="mb-2 sm:hidden hr-light" />
-
-        <ul class="flex flex-row flex-wrap justify-center items-center
-          text-lg text-primary-400 text-ellipsis">
-          <li class="mx-2 my-1">
-            <.link
-              navigate={Routes.note_index_path(Endpoint, :index)}
-              class="text-primary-400 text-primary-400 hover:underline truncate"
-            >
-              <%= gettext("notes") %>
-            </.link>
-          </li>
-
-          <li class="mx-2 my-1">
-            <.link
-              navigate={Routes.context_index_path(Endpoint, :index)}
-              class="text-primary-400 text-primary-400 hover:underline truncate"
-            >
-              <%= gettext("contexts") %>
-            </.link>
-          </li>
-
-          <li class="mx-2 my-1">
-            <.link
-              navigate={Routes.pipeline_index_path(Endpoint, :index)}
-              class="text-primary-400 text-primary-400 hover:underline truncate"
-            >
-              <%= gettext("pipelines") %>
-            </.link>
-          </li>
-
-          <li class="mx-2 my-1 border-left border border-primary-700">​</li>
-
-          <%= if @current_user do %>
-            <li :if={@current_user |> Accounts.is_already_admin?()} class="mx-2 my-1">
-              <.link
-                navigate={Routes.invite_index_path(Endpoint, :index)}
-                class="text-primary-400 text-primary-400 hover:underline"
-              >
-                <%= gettext("invites") %>
-              </.link>
-            </li>
-
-            <li class="mx-2 my-1">
-              <.link
-                navigate={Routes.user_settings_path(Endpoint, :edit)}
-                class="text-primary-400 text-primary-400 hover:underline truncate"
-              >
-                <%= @current_user.email %>
-              </.link>
-            </li>
-            <li class="mx-2 my-1">
-              <.link
-                href={Routes.user_session_path(Endpoint, :delete)}
-                method="delete"
-                data-confirm={dgettext("prompts", "are you sure you want to log out?")}
-              >
-                <i class="fas fa-sign-out-alt"></i>
-              </.link>
-            </li>
-            <li
-              :if={
-                @current_user.role == :admin and function_exported?(Routes, :live_dashboard_path, 2)
-              }
-              class="mx-2 my-1"
-            >
-              <.link
-                navigate={Routes.live_dashboard_path(Endpoint, :home)}
-                class="text-primary-400 text-primary-400 hover:underline"
-              >
-                <i class="fas fa-gauge"></i>
-              </.link>
-            </li>
-          <% else %>
-            <li :if={Accounts.allow_registration?()} class="mx-2 my-1">
-              <.link
-                href={Routes.user_registration_path(Endpoint, :new)}
-                class="text-primary-400 text-primary-400 hover:underline truncate"
-              >
-                <%= dgettext("actions", "register") %>
-              </.link>
-            </li>
-
-            <li class="mx-2 my-1">
-              <.link
-                href={Routes.user_session_path(Endpoint, :new)}
-                class="text-primary-400 text-primary-400 hover:underline truncate"
-              >
-                <%= dgettext("actions", "log in") %>
-              </.link>
-            </li>
-          <% end %>
-        </ul>
-      </div>
-    </nav>
-    """
-  end
-end
diff --git a/lib/memex_web/components/user_card.ex b/lib/memex_web/components/user_card.ex
deleted file mode 100644
index 3eebeba..0000000
--- a/lib/memex_web/components/user_card.ex
+++ /dev/null
@@ -1,53 +0,0 @@
-defmodule MemexWeb.Components.UserCard do
-  @moduledoc """
-  Display card for a user
-  """
-
-  use MemexWeb, :component
-  alias Memex.Accounts.User
-
-  attr :user, User, required: true
-  slot(:inner_block, required: true)
-
-  def user_card(assigns) do
-    ~H"""
-    <div
-      id={"user-#{@user.id}"}
-      class="px-8 py-4 flex flex-col justify-center items-center text-center
-        bg-primary-900
-        border border-gray-400 rounded-lg shadow-lg hover:shadow-md
-        transition-all duration-300 ease-in-out"
-    >
-      <h1 class="px-4 py-2 rounded-lg title text-xl break-all">
-        <%= @user.email %>
-      </h1>
-
-      <h3 class="px-4 py-2 rounded-lg title text-lg">
-        <p>
-          <%= if @user.confirmed_at do %>
-            <%= gettext(
-              "user confirmed on%{confirmed_datetime}",
-              confirmed_datetime: ""
-            ) %>
-            <.datetime datetime={@user.confirmed_at} />
-          <% else %>
-            <%= gettext("email unconfirmed") %>
-          <% end %>
-        </p>
-
-        <p>
-          <%= gettext(
-            "user registered on%{registered_datetime}",
-            registered_datetime: ""
-          ) %>
-          <.datetime datetime={@user.inserted_at} />
-        </p>
-      </h3>
-
-      <div :if={@inner_block} class="px-4 py-2 flex space-x-4 justify-center items-center">
-        <%= render_slot(@inner_block) %>
-      </div>
-    </div>
-    """
-  end
-end
diff --git a/lib/memex_web/live/context_live/index.html.heex b/lib/memex_web/live/context_live/index.html.heex
index 6fb9ce5..96a7016 100644
--- a/lib/memex_web/live/context_live/index.html.heex
+++ b/lib/memex_web/live/context_live/index.html.heex
@@ -5,7 +5,8 @@
 
   <.form
     :let={f}
-    for={:search}
+    for={%{}}
+    as={:search}
     phx-change="search"
     phx-submit="search"
     class="self-stretch flex flex-col items-stretch"
diff --git a/lib/memex_web/live/context_live/show.ex b/lib/memex_web/live/context_live/show.ex
index 7f3e0c5..e2d557b 100644
--- a/lib/memex_web/live/context_live/show.ex
+++ b/lib/memex_web/live/context_live/show.ex
@@ -1,6 +1,5 @@
 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/invite_live/index.ex b/lib/memex_web/live/invite_live/index.ex
index 95759e1..66fdecd 100644
--- a/lib/memex_web/live/invite_live/index.ex
+++ b/lib/memex_web/live/invite_live/index.ex
@@ -4,7 +4,6 @@ defmodule MemexWeb.InviteLive.Index do
   """
 
   use MemexWeb, :live_view
-  import MemexWeb.Components.{InviteCard, UserCard}
   alias Memex.Accounts
   alias Memex.Accounts.{Invite, Invites}
   alias MemexWeb.HomeLive
diff --git a/lib/memex_web/live/live_helpers.ex b/lib/memex_web/live/live_helpers.ex
deleted file mode 100644
index 7c24845..0000000
--- a/lib/memex_web/live/live_helpers.ex
+++ /dev/null
@@ -1,135 +0,0 @@
-defmodule MemexWeb.LiveHelpers do
-  @moduledoc """
-  Contains common helper functions for liveviews
-  """
-
-  use Phoenix.Component
-  alias Phoenix.LiveView.JS
-
-  attr :return_to, :string, required: true
-  slot(:inner_block)
-
-  @doc """
-  Renders a live component inside a modal.
-
-  The rendered modal receives a `:return_to` option to properly update
-  the URL when the modal is closed.
-
-  ## Examples
-
-      <.modal return_to={Routes.<%= schema.singular %>_index_path(Endpoint, :index)}>
-        <.live_component
-          module={<%= inspect context.web_module %>.<%= inspect Module.concat(schema.web_namespace, schema.alias) %>Live.FormComponent}
-          id={@<%= schema.singular %>.id || :new}
-          title={@page_title}
-          action={@live_action}
-          return_to={Routes.<%= schema.singular %>_index_path(Endpoint, :index)}
-          <%= schema.singular %>: @<%= schema.singular %>
-        />
-      </.modal>
-  """
-  def modal(assigns) do
-    ~H"""
-    <.link
-      id="modal-bg"
-      patch={@return_to}
-      class="fade-in fixed z-10 left-0 top-0
-        w-full h-full overflow-hidden
-        p-8 flex flex-col justify-center items-center cursor-auto"
-      style="background-color: rgba(0,0,0,0.4);"
-      phx-remove={hide_modal()}
-    >
-      <span class="hidden"></span>
-    </.link>
-
-    <div
-      id="modal"
-      class="fixed z-10 left-0 top-0 pointer-events-none
-        w-full h-full overflow-hidden
-        p-4 sm:p-8 flex flex-col justify-center items-center"
-    >
-      <div
-        id="modal-content"
-        class="fade-in-scale max-w-3xl max-h-3xl relative w-full
-          pointer-events-auto overflow-hidden
-          px-8 py-4 sm:py-8 flex flex-col justify-start items-stretch
-          bg-primary-800 text-primary-400 border-primary-900 border-2 rounded-lg"
-      >
-        <.link
-          patch={@return_to}
-          id="close"
-          class="absolute top-8 right-10
-            text-gray-500 hover:text-gray-800
-            transition-all duration-500 ease-in-out"
-          phx-remove={hide_modal()}
-        >
-          <i class="fa-fw fa-lg fas fa-times"></i>
-        </.link>
-
-        <div class="overflow-x-hidden overflow-y-auto w-full p-8 flex flex-col space-y-4 justify-start items-stretch">
-          <%= render_slot(@inner_block) %>
-        </div>
-      </div>
-    </div>
-    """
-  end
-
-  defp hide_modal(js \\ %JS{}) do
-    js
-    |> JS.hide(to: "#modal", transition: "fade-out")
-    |> JS.hide(to: "#modal-bg", transition: "fade-out")
-    |> JS.hide(to: "#modal-content", transition: "fade-out-scale")
-  end
-
-  attr :action, :string, required: true
-  attr :value, :boolean, required: true
-  attr :id, :string
-  slot(:inner_block)
-
-  @doc """
-  A toggle button element that can be directed to a liveview or a
-  live_component's `handle_event/3`.
-
-  ## Examples
-
-  <.toggle_button action="my_liveview_action" value={@some_value}>
-    <span>Toggle me!</span>
-  </.toggle_button>
-  <.toggle_button action="my_live_component_action" target={@myself} value={@some_value}>
-    <span>Whatever you want</span>
-  </.toggle_button>
-  """
-  def toggle_button(assigns) do
-    assigns = assigns |> assign_new(:id, fn -> assigns.action end)
-
-    ~H"""
-    <label for={@id} class="inline-flex relative items-center cursor-pointer">
-      <input
-        id={@id}
-        type="checkbox"
-        value={@value}
-        checked={@value}
-        class="sr-only peer"
-        aria-labelledby={"#{@id}-label"}
-        {
-          if assigns |> Map.has_key?(:target),
-            do: %{"phx-click": @action, "phx-value-value": @value, "phx-target": @target},
-            else: %{"phx-click": @action, "phx-value-value": @value}
-        }
-      />
-      <div class="w-11 h-6 bg-gray-300 rounded-full peer
-        peer-focus:ring-4 peer-focus:ring-teal-300 dark:peer-focus:ring-teal-800
-        peer-checked:bg-gray-600
-        peer-checked:after:translate-x-full peer-checked:after:border-white
-        after:content-[''] after:absolute after:top-1 after:left-[2px] after:bg-white after:border-gray-300
-        after:border after:rounded-full after:h-5 after:w-5
-        after:transition-all after:duration-250 after:ease-in-out
-        transition-colors duration-250 ease-in-out">
-      </div>
-      <span id={"#{@id}-label"} class="ml-3 text-sm font-medium text-gray-900 dark:text-gray-300">
-        <%= render_slot(@inner_block) %>
-      </span>
-    </label>
-    """
-  end
-end
diff --git a/lib/memex_web/live/note_live/index.html.heex b/lib/memex_web/live/note_live/index.html.heex
index 860ed06..1976fd8 100644
--- a/lib/memex_web/live/note_live/index.html.heex
+++ b/lib/memex_web/live/note_live/index.html.heex
@@ -5,7 +5,8 @@
 
   <.form
     :let={f}
-    for={:search}
+    for={%{}}
+    as={:search}
     phx-change="search"
     phx-submit="search"
     class="self-stretch flex flex-col items-stretch"
diff --git a/lib/memex_web/live/note_live/show.ex b/lib/memex_web/live/note_live/show.ex
index b5b69b4..7c8b050 100644
--- a/lib/memex_web/live/note_live/show.ex
+++ b/lib/memex_web/live/note_live/show.ex
@@ -1,6 +1,5 @@
 defmodule MemexWeb.NoteLive.Show do
   use MemexWeb, :live_view
-  import MemexWeb.Components.NoteContent
   alias Memex.{Accounts.User, Notes, Notes.Note}
 
   @impl true
diff --git a/lib/memex_web/live/pipeline_live/index.html.heex b/lib/memex_web/live/pipeline_live/index.html.heex
index 56f0b86..a9d6562 100644
--- a/lib/memex_web/live/pipeline_live/index.html.heex
+++ b/lib/memex_web/live/pipeline_live/index.html.heex
@@ -5,7 +5,8 @@
 
   <.form
     :let={f}
-    for={:search}
+    for={%{}}
+    as={:search}
     phx-change="search"
     phx-submit="search"
     class="self-stretch flex flex-col items-stretch"
diff --git a/lib/memex_web/live/pipeline_live/show.ex b/lib/memex_web/live/pipeline_live/show.ex
index e9b94b9..7bfd27c 100644
--- a/lib/memex_web/live/pipeline_live/show.ex
+++ b/lib/memex_web/live/pipeline_live/show.ex
@@ -1,6 +1,5 @@
 defmodule MemexWeb.PipelineLive.Show do
   use MemexWeb, :live_view
-  import MemexWeb.Components.StepContent
   alias Memex.{Accounts.User, Pipelines}
   alias Memex.Pipelines.{Pipeline, Steps, Steps.Step}
 
diff --git a/lib/memex_web/templates/user_confirmation/new.html.heex b/lib/memex_web/templates/user_confirmation/new.html.heex
index 7ee1889..1c9e6dd 100644
--- a/lib/memex_web/templates/user_confirmation/new.html.heex
+++ b/lib/memex_web/templates/user_confirmation/new.html.heex
@@ -5,7 +5,8 @@
 
   <.form
     :let={f}
-    for={:user}
+    for={%{}}
+    as={:user}
     action={Routes.user_confirmation_path(@conn, :create)}
     class="flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
   >
diff --git a/lib/memex_web/templates/user_reset_password/new.html.heex b/lib/memex_web/templates/user_reset_password/new.html.heex
index 4d476de..49ab65c 100644
--- a/lib/memex_web/templates/user_reset_password/new.html.heex
+++ b/lib/memex_web/templates/user_reset_password/new.html.heex
@@ -5,7 +5,8 @@
 
   <.form
     :let={f}
-    for={:user}
+    for={%{}}
+    as={:user}
     action={Routes.user_reset_password_path(@conn, :create)}
     class="flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
   >
diff --git a/lib/memex_web/views/error_view.ex b/lib/memex_web/views/error_view.ex
index cedd150..bda670a 100644
--- a/lib/memex_web/views/error_view.ex
+++ b/lib/memex_web/views/error_view.ex
@@ -1,6 +1,5 @@
 defmodule MemexWeb.ErrorView do
   use MemexWeb, :view
-  import MemexWeb.Components.Topbar
   alias MemexWeb.HomeLive
 
   def template_not_found(error_path, _assigns) do
diff --git a/lib/memex_web/views/layout_view.ex b/lib/memex_web/views/layout_view.ex
index 7d52142..7d2dc82 100644
--- a/lib/memex_web/views/layout_view.ex
+++ b/lib/memex_web/views/layout_view.ex
@@ -1,6 +1,5 @@
 defmodule MemexWeb.LayoutView do
   use MemexWeb, :view
-  import MemexWeb.Components.Topbar
   alias MemexWeb.HomeLive
 
   # Phoenix LiveDashboard is available only in development by default,
diff --git a/mix.exs b/mix.exs
index 3c6529e..e26b49e 100644
--- a/mix.exs
+++ b/mix.exs
@@ -47,13 +47,13 @@ defmodule Memex.MixProject do
   # Type `mix help deps` for examples and options.
   defp deps do
     [
-      {:bcrypt_elixir, "~> 2.0"},
+      {:bcrypt_elixir, "~> 3.0"},
       {:phoenix, "~> 1.6.0"},
       {:phoenix_ecto, "~> 4.4"},
       {:phoenix_html, "~> 3.0"},
       {:phoenix_live_reload, "~> 1.2", only: :dev},
       {:phoenix_live_view, "~> 0.18.0"},
-      {:phoenix_view, "~> 1.1"},
+      {:phoenix_view, "~> 2.0"},
       {:phoenix_live_dashboard, "~> 0.6"},
       {:ecto_sql, "~> 3.6"},
       {:postgrex, ">= 0.0.0"},
diff --git a/mix.lock b/mix.lock
index a20a311..b6d82dc 100644
--- a/mix.lock
+++ b/mix.lock
@@ -1,5 +1,5 @@
 %{
-  "bcrypt_elixir": {:hex, :bcrypt_elixir, "2.3.1", "5114d780459a04f2b4aeef52307de23de961b69e13a5cd98a911e39fda13f420", [:make, :mix], [{:comeonin, "~> 5.3", [hex: :comeonin, repo: "hexpm", optional: false]}, {:elixir_make, "~> 0.6", [hex: :elixir_make, repo: "hexpm", optional: false]}], "hexpm", "42182d5f46764def15bf9af83739e3bf4ad22661b1c34fc3e88558efced07279"},
+  "bcrypt_elixir": {:hex, :bcrypt_elixir, "3.0.1", "9be815469e6bfefec40fa74658ecbbe6897acfb57614df1416eeccd4903f602c", [:make, :mix], [{:comeonin, "~> 5.3", [hex: :comeonin, repo: "hexpm", optional: false]}, {:elixir_make, "~> 0.6", [hex: :elixir_make, repo: "hexpm", optional: false]}], "hexpm", "486bb95efb645d1efc6794c1ddd776a186a9a713abf06f45708a6ce324fb96cf"},
   "bunt": {:hex, :bunt, "0.2.1", "e2d4792f7bc0ced7583ab54922808919518d0e57ee162901a16a1b6664ef3b14", [:mix], [], "hexpm", "a330bfb4245239787b15005e66ae6845c9cd524a288f0d141c148b02603777a5"},
   "castore": {:hex, :castore, "0.1.22", "4127549e411bedd012ca3a308dede574f43819fe9394254ca55ab4895abfa1a2", [:mix], [], "hexpm", "c17576df47eb5aa1ee40cc4134316a99f5cad3e215d5c77b8dd3cfef12a22cac"},
   "comeonin": {:hex, :comeonin, "5.3.3", "2c564dac95a35650e9b6acfe6d2952083d8a08e4a89b93a481acb552b325892e", [:mix], [], "hexpm", "3e38c9c2cb080828116597ca8807bb482618a315bfafd98c90bc22a821cc84df"},
@@ -11,38 +11,39 @@
   "db_connection": {:hex, :db_connection, "2.4.3", "3b9aac9f27347ec65b271847e6baeb4443d8474289bd18c1d6f4de655b70c94d", [:mix], [{:connection, "~> 1.0", [hex: :connection, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "c127c15b0fa6cfb32eed07465e05da6c815b032508d4ed7c116122871df73c12"},
   "decimal": {:hex, :decimal, "2.0.0", "a78296e617b0f5dd4c6caf57c714431347912ffb1d0842e998e9792b5642d697", [:mix], [], "hexpm", "34666e9c55dea81013e77d9d87370fe6cb6291d1ef32f46a1600230b1d44f577"},
   "dialyxir": {:hex, :dialyxir, "1.2.0", "58344b3e87c2e7095304c81a9ae65cb68b613e28340690dfe1a5597fd08dec37", [:mix], [{:erlex, ">= 0.2.6", [hex: :erlex, repo: "hexpm", optional: false]}], "hexpm", "61072136427a851674cab81762be4dbeae7679f85b1272b6d25c3a839aff8463"},
-  "earmark_parser": {:hex, :earmark_parser, "1.4.29", "149d50dcb3a93d9f3d6f3ecf18c918fb5a2d3c001b5d3305c926cddfbd33355b", [:mix], [], "hexpm", "4902af1b3eb139016aed210888748db8070b8125c2342ce3dcae4f38dcc63503"},
+  "earmark_parser": {:hex, :earmark_parser, "1.4.31", "a93921cdc6b9b869f519213d5bc79d9e218ba768d7270d46fdcf1c01bacff9e2", [:mix], [], "hexpm", "317d367ee0335ef037a87e46c91a2269fef6306413f731e8ec11fc45a7efd059"},
   "ecto": {:hex, :ecto, "3.9.4", "3ee68e25dbe0c36f980f1ba5dd41ee0d3eb0873bccae8aeaf1a2647242bffa35", [:mix], [{:decimal, "~> 1.6 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "de5f988c142a3aa4ec18b85a4ec34a2390b65b24f02385c1144252ff6ff8ee75"},
   "ecto_psql_extras": {:hex, :ecto_psql_extras, "0.7.10", "e14d400930f401ca9f541b3349212634e44027d7f919bbb71224d7ac0d0e8acd", [:mix], [{:ecto_sql, "~> 3.4", [hex: :ecto_sql, repo: "hexpm", optional: false]}, {:postgrex, "~> 0.15.7 or ~> 0.16.0", [hex: :postgrex, repo: "hexpm", optional: false]}, {:table_rex, "~> 3.1.1", [hex: :table_rex, repo: "hexpm", optional: false]}], "hexpm", "505e8cd81e4f17c090be0f99e92b1b3f0fd915f98e76965130b8ccfb891e7088"},
   "ecto_sql": {:hex, :ecto_sql, "3.9.2", "34227501abe92dba10d9c3495ab6770e75e79b836d114c41108a4bf2ce200ad5", [:mix], [{:db_connection, "~> 2.4.1 or ~> 2.5", [hex: :db_connection, repo: "hexpm", optional: false]}, {:ecto, "~> 3.9.2", [hex: :ecto, repo: "hexpm", optional: false]}, {:myxql, "~> 0.6.0", [hex: :myxql, repo: "hexpm", optional: true]}, {:postgrex, "~> 0.16.0 or ~> 1.0", [hex: :postgrex, repo: "hexpm", optional: true]}, {:tds, "~> 2.1.1 or ~> 2.2", [hex: :tds, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.0 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "1eb5eeb4358fdbcd42eac11c1fbd87e3affd7904e639d77903c1358b2abd3f70"},
-  "elixir_make": {:hex, :elixir_make, "0.7.3", "c37fdae1b52d2cc51069713a58c2314877c1ad40800a57efb213f77b078a460d", [:mix], [{:castore, "~> 0.1", [hex: :castore, repo: "hexpm", optional: true]}], "hexpm", "24ada3e3996adbed1fa024ca14995ef2ba3d0d17b678b0f3f2b1f66e6ce2b274"},
+  "elixir_make": {:hex, :elixir_make, "0.7.5", "784cc00f5fa24239067cc04d449437dcc5f59353c44eb08f188b2b146568738a", [:mix], [{:castore, "~> 0.1", [hex: :castore, repo: "hexpm", optional: true]}], "hexpm", "c3d63e8d5c92fa3880d89ecd41de59473fa2e83eeb68148155e25e8b95aa2887"},
   "eqrcode": {:hex, :eqrcode, "0.1.10", "6294fece9d68ad64eef1c3c92cf111cfd6469f4fbf230a2d4cc905a682178f3f", [:mix], [], "hexpm", "da30e373c36a0fd37ab6f58664b16029919896d6c45a68a95cc4d713e81076f1"},
   "erlex": {:hex, :erlex, "0.2.6", "c7987d15e899c7a2f34f5420d2a2ea0d659682c06ac607572df55a43753aa12e", [:mix], [], "hexpm", "2ed2e25711feb44d52b17d2780eabf998452f6efda104877a3881c2f8c0c0c75"},
-  "ex_doc": {:hex, :ex_doc, "0.29.1", "b1c652fa5f92ee9cf15c75271168027f92039b3877094290a75abcaac82a9f77", [:mix], [{:earmark_parser, "~> 1.4.19", [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", "b7745fa6374a36daf484e2a2012274950e084815b936b1319aeebcf7809574f6"},
-  "expo": {:hex, :expo, "0.3.0", "13127c1d5f653b2927f2616a4c9ace5ae372efd67c7c2693b87fd0fdc30c6feb", [:mix], [], "hexpm", "fb3cd4bf012a77bc1608915497dae2ff684a06f0fa633c7afa90c4d72b881823"},
+  "ex_doc": {:hex, :ex_doc, "0.29.2", "dfa97532ba66910b2a3016a4bbd796f41a86fc71dd5227e96f4c8581fdf0fdf0", [:mix], [{:earmark_parser, "~> 1.4.19", [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", "6b5d7139eda18a753e3250e27e4a929f8d2c880dd0d460cb9986305dea3e03af"},
+  "expo": {:hex, :expo, "0.4.0", "bbe4bf455e2eb2ebd2f1e7d83530ce50fb9990eb88fc47855c515bfdf1c6626f", [:mix], [], "hexpm", "a8ed1683ec8b7c7fa53fd7a41b2c6935f539168a6bb0616d7fd6b58a36f3abf2"},
   "file_system": {:hex, :file_system, "0.2.10", "fb082005a9cd1711c05b5248710f8826b02d7d1784e7c3451f9c1231d4fc162d", [:mix], [], "hexpm", "41195edbfb562a593726eda3b3e8b103a309b733ad25f3d642ba49696bf715dc"},
-  "floki": {:hex, :floki, "0.34.0", "002d0cc194b48794d74711731db004fafeb328fe676976f160685262d43706a8", [:mix], [], "hexpm", "9c3a9f43f40dde00332a589bd9d389b90c1f518aef500364d00636acc5ebc99c"},
+  "floki": {:hex, :floki, "0.34.2", "5fad07ef153b3b8ec110b6b155ec3780c4b2c4906297d0b4be1a7162d04a7e02", [:mix], [], "hexpm", "26b9d50f0f01796bc6be611ca815c5e0de034d2128e39cc9702eee6b66a4d1c8"},
   "gen_smtp": {:hex, :gen_smtp, "1.2.0", "9cfc75c72a8821588b9b9fe947ae5ab2aed95a052b81237e0928633a13276fd3", [:rebar3], [{:ranch, ">= 1.8.0", [hex: :ranch, repo: "hexpm", optional: false]}], "hexpm", "5ee0375680bca8f20c4d85f58c2894441443a743355430ff33a783fe03296779"},
-  "gettext": {:hex, :gettext, "0.22.0", "a25d71ec21b1848957d9207b81fd61cb25161688d282d58bdafef74c2270bdc4", [:mix], [{:expo, "~> 0.3.0", [hex: :expo, repo: "hexpm", optional: false]}], "hexpm", "cb0675141576f73720c8e49b4f0fd3f2c69f0cd8c218202724d4aebab8c70ace"},
+  "gettext": {:hex, :gettext, "0.22.1", "e7942988383c3d9eed4bdc22fc63e712b655ae94a672a27e4900e3d4a2c43581", [:mix], [{:expo, "~> 0.4.0", [hex: :expo, repo: "hexpm", optional: false]}], "hexpm", "ad105b8dab668ee3f90c0d3d94ba75e9aead27a62495c101d94f2657a190ac5d"},
   "jason": {:hex, :jason, "1.4.0", "e855647bc964a44e2f67df589ccf49105ae039d4179db7f6271dfd3843dc27e6", [:mix], [{:decimal, "~> 1.0 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: true]}], "hexpm", "79a3791085b2a0f743ca04cec0f7be26443738779d09302e01318f97bdb82121"},
   "makeup": {:hex, :makeup, "1.1.0", "6b67c8bc2882a6b6a445859952a602afc1a41c2e08379ca057c0f525366fc3ca", [:mix], [{:nimble_parsec, "~> 1.2.2 or ~> 1.3", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "0a45ed501f4a8897f580eabf99a2e5234ea3e75a4373c8a52824f6e873be57a6"},
   "makeup_elixir": {:hex, :makeup_elixir, "0.16.0", "f8c570a0d33f8039513fbccaf7108c5d750f47d8defd44088371191b76492b0b", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}, {:nimble_parsec, "~> 1.2.3", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "28b2cbdc13960a46ae9a8858c4bebdec3c9a6d7b4b9e7f4ed1502f8159f338e7"},
   "makeup_erlang": {:hex, :makeup_erlang, "0.1.1", "3fcb7f09eb9d98dc4d208f49cc955a34218fc41ff6b84df7c75b3e6e533cc65f", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}], "hexpm", "174d0809e98a4ef0b3309256cbf97101c6ec01c4ab0b23e926a9e17df2077cbb"},
   "mime": {:hex, :mime, "2.0.3", "3676436d3d1f7b81b5a2d2bd8405f412c677558c81b1c92be58c00562bb59095", [:mix], [], "hexpm", "27a30bf0db44d25eecba73755acf4068cbfe26a4372f9eb3e4ea3a45956bff6b"},
   "nimble_parsec": {:hex, :nimble_parsec, "1.2.3", "244836e6e3f1200c7f30cb56733fd808744eca61fd182f731eac4af635cc6d0b", [:mix], [], "hexpm", "c8d789e39b9131acf7b99291e93dae60ab48ef14a7ee9d58c6964f59efb570b0"},
-  "oban": {:hex, :oban, "2.13.6", "a0cb1bce3bd393770512231fb5a3695fa19fd3af10d7575bf73f837aee7abf43", [:mix], [{:ecto_sql, "~> 3.6", [hex: :ecto_sql, repo: "hexpm", optional: false]}, {:jason, "~> 1.1", [hex: :jason, repo: "hexpm", optional: false]}, {:postgrex, "~> 0.16", [hex: :postgrex, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "3c1c5eb16f377b3cbbf2ea14be24d20e3d91285af9d1ac86260b7c2af5464887"},
-  "phoenix": {:hex, :phoenix, "1.6.15", "0a1d96bbc10747fd83525370d691953cdb6f3ccbac61aa01b4acb012474b047d", [:mix], [{:castore, ">= 0.0.0", [hex: :castore, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix_pubsub, "~> 2.0", [hex: :phoenix_pubsub, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 1.0 or ~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: false]}, {:plug, "~> 1.10", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 2.2", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:plug_crypto, "~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "d70ab9fbf6b394755ea88b644d34d79d8b146e490973151f248cacd122d20672"},
+  "oban": {:hex, :oban, "2.14.2", "ae925d9a33e110addaa59ff7ec1b2fd84270ac7eb00fbb4b4a179d74c407bba3", [:mix], [{:ecto_sql, "~> 3.6", [hex: :ecto_sql, repo: "hexpm", optional: false]}, {:ecto_sqlite3, "~> 0.9", [hex: :ecto_sqlite3, repo: "hexpm", optional: true]}, {:jason, "~> 1.1", [hex: :jason, repo: "hexpm", optional: false]}, {:postgrex, "~> 0.16", [hex: :postgrex, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "32bf30127c8c44ac42f05f229a50fadc2177b3e799c29499f5daf90d5e5b5d3c"},
+  "phoenix": {:hex, :phoenix, "1.6.16", "e5bdd18c7a06da5852a25c7befb72246de4ddc289182285f8685a40b7b5f5451", [:mix], [{:castore, ">= 0.0.0", [hex: :castore, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix_pubsub, "~> 2.0", [hex: :phoenix_pubsub, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 1.0 or ~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: false]}, {:plug, "~> 1.10", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 2.2", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:plug_crypto, "~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "e15989ff34f670a96b95ef6d1d25bad0d9c50df5df40b671d8f4a669e050ac39"},
   "phoenix_ecto": {:hex, :phoenix_ecto, "4.4.0", "0672ed4e4808b3fbed494dded89958e22fb882de47a97634c0b13e7b0b5f7720", [:mix], [{:ecto, "~> 3.3", [hex: :ecto, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 2.14.2 or ~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}, {:plug, "~> 1.9", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm", "09864e558ed31ee00bd48fcc1d4fc58ae9678c9e81649075431e69dbabb43cc1"},
-  "phoenix_html": {:hex, :phoenix_html, "3.2.0", "1c1219d4b6cb22ac72f12f73dc5fad6c7563104d083f711c3fcd8551a1f4ae11", [:mix], [{:plug, "~> 1.5", [hex: :plug, repo: "hexpm", optional: true]}], "hexpm", "36ec97ba56d25c0136ef1992c37957e4246b649d620958a1f9fa86165f8bc54f"},
-  "phoenix_live_dashboard": {:hex, :phoenix_live_dashboard, "0.7.1", "b0bf8f3348dec4910907a2ad1453e642f6fe4d444376c1c9b26222d63c73cf97", [:mix], [{:ecto, "~> 3.6.2 or ~> 3.7", [hex: :ecto, repo: "hexpm", optional: true]}, {:ecto_mysql_extras, "~> 0.5", [hex: :ecto_mysql_extras, repo: "hexpm", optional: true]}, {:ecto_psql_extras, "~> 0.7", [hex: :ecto_psql_extras, repo: "hexpm", optional: true]}, {:mime, "~> 1.6 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:phoenix_live_view, "~> 0.18.0", [hex: :phoenix_live_view, repo: "hexpm", optional: false]}, {:telemetry_metrics, "~> 0.6 or ~> 1.0", [hex: :telemetry_metrics, repo: "hexpm", optional: false]}], "hexpm", "b6c5d744bf4b40692b1b361d3608bdfd05aeab83e17c7bc217d730f007f31abf"},
+  "phoenix_html": {:hex, :phoenix_html, "3.3.1", "4788757e804a30baac6b3fc9695bf5562465dd3f1da8eb8460ad5b404d9a2178", [:mix], [{:plug, "~> 1.5", [hex: :plug, repo: "hexpm", optional: true]}], "hexpm", "bed1906edd4906a15fd7b412b85b05e521e1f67c9a85418c55999277e553d0d3"},
+  "phoenix_live_dashboard": {:hex, :phoenix_live_dashboard, "0.7.2", "97cc4ff2dba1ebe504db72cb45098cb8e91f11160528b980bd282cc45c73b29c", [:mix], [{:ecto, "~> 3.6.2 or ~> 3.7", [hex: :ecto, repo: "hexpm", optional: true]}, {:ecto_mysql_extras, "~> 0.5", [hex: :ecto_mysql_extras, repo: "hexpm", optional: true]}, {:ecto_psql_extras, "~> 0.7", [hex: :ecto_psql_extras, repo: "hexpm", optional: true]}, {:mime, "~> 1.6 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:phoenix_live_view, "~> 0.18.3", [hex: :phoenix_live_view, repo: "hexpm", optional: false]}, {:telemetry_metrics, "~> 0.6 or ~> 1.0", [hex: :telemetry_metrics, repo: "hexpm", optional: false]}], "hexpm", "0e5fdf063c7a3b620c566a30fcf68b7ee02e5e46fe48ee46a6ec3ba382dc05b7"},
   "phoenix_live_reload": {:hex, :phoenix_live_reload, "1.4.1", "2aff698f5e47369decde4357ba91fc9c37c6487a512b41732818f2204a8ef1d3", [:mix], [{:file_system, "~> 0.2.1 or ~> 0.3", [hex: :file_system, repo: "hexpm", optional: false]}, {:phoenix, "~> 1.4", [hex: :phoenix, repo: "hexpm", optional: false]}], "hexpm", "9bffb834e7ddf08467fe54ae58b5785507aaba6255568ae22b4d46e2bb3615ab"},
-  "phoenix_live_view": {:hex, :phoenix_live_view, "0.18.2", "635cf07de947235deb030cd6b776c71a3b790ab04cebf526aa8c879fe17c7784", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix, "~> 1.6", [hex: :phoenix, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 3.1", [hex: :phoenix_html, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4.2 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "da287a77327e996cc166e4c440c3ad5ab33ccdb151b91c793209b39ebbce5b75"},
+  "phoenix_live_view": {:hex, :phoenix_live_view, "0.18.18", "1f38fbd7c363723f19aad1a04b5490ff3a178e37daaf6999594d5f34796c47fc", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix, "~> 1.6.15 or ~> 1.7.0", [hex: :phoenix, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 3.3", [hex: :phoenix_html, repo: "hexpm", optional: false]}, {:phoenix_template, "~> 1.0", [hex: :phoenix_template, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.2 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "a5810d0472f3189ede6d2a95bda7f31c6113156b91784a3426cb0ab6a6d85214"},
   "phoenix_pubsub": {:hex, :phoenix_pubsub, "2.1.1", "ba04e489ef03763bf28a17eb2eaddc2c20c6d217e2150a61e3298b0f4c2012b5", [:mix], [], "hexpm", "81367c6d1eea5878ad726be80808eb5a787a23dee699f96e72b1109c57cdd8d9"},
-  "phoenix_swoosh": {:hex, :phoenix_swoosh, "1.1.0", "f8e4780705c9f254cc853f7a40e25f7198ba4d91102bcfad2226669b69766b35", [:mix], [{:finch, "~> 0.8", [hex: :finch, repo: "hexpm", optional: true]}, {:hackney, "~> 1.10", [hex: :hackney, repo: "hexpm", optional: true]}, {:phoenix, "~> 1.6", [hex: :phoenix, repo: "hexpm", optional: true]}, {:phoenix_html, "~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}, {:phoenix_view, "~> 1.0 or ~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: false]}, {:swoosh, "~> 1.5", [hex: :swoosh, repo: "hexpm", optional: false]}], "hexpm", "aa82f10afd9a4b6080fdf3274dbb9432b25b210d42b4b6b55308f6e59cd87c3d"},
-  "phoenix_view": {:hex, :phoenix_view, "1.1.2", "1b82764a065fb41051637872c7bd07ed2fdb6f5c3bd89684d4dca6e10115c95a", [:mix], [{:phoenix_html, "~> 2.14.2 or ~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}], "hexpm", "7ae90ad27b09091266f6adbb61e1d2516a7c3d7062c6789d46a7554ec40f3a56"},
+  "phoenix_swoosh": {:hex, :phoenix_swoosh, "1.2.0", "a544d83fde4a767efb78f45404a74c9e37b2a9c5ea3339692e65a6966731f935", [:mix], [{:finch, "~> 0.8", [hex: :finch, repo: "hexpm", optional: true]}, {:hackney, "~> 1.10", [hex: :hackney, repo: "hexpm", optional: true]}, {:phoenix, "~> 1.6", [hex: :phoenix, repo: "hexpm", optional: true]}, {:phoenix_html, "~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}, {:phoenix_view, "~> 1.0 or ~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: false]}, {:swoosh, "~> 1.5", [hex: :swoosh, repo: "hexpm", optional: false]}], "hexpm", "e88d117251e89a16b92222415a6d87b99a96747ddf674fc5c7631de734811dba"},
+  "phoenix_template": {:hex, :phoenix_template, "1.0.1", "85f79e3ad1b0180abb43f9725973e3b8c2c3354a87245f91431eec60553ed3ef", [:mix], [{:phoenix_html, "~> 2.14.2 or ~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}], "hexpm", "157dc078f6226334c91cb32c1865bf3911686f8bcd6bcff86736f6253e6993ee"},
+  "phoenix_view": {:hex, :phoenix_view, "2.0.2", "6bd4d2fd595ef80d33b439ede6a19326b78f0f1d8d62b9a318e3d9c1af351098", [:mix], [{:phoenix_html, "~> 2.14.2 or ~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}, {:phoenix_template, "~> 1.0", [hex: :phoenix_template, repo: "hexpm", optional: false]}], "hexpm", "a929e7230ea5c7ee0e149ffcf44ce7cf7f4b6d2bfe1752dd7c084cdff152d36f"},
   "plug": {:hex, :plug, "1.14.0", "ba4f558468f69cbd9f6b356d25443d0b796fbdc887e03fa89001384a9cac638f", [:mix], [{:mime, "~> 1.0 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_crypto, "~> 1.1.1 or ~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4.3 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "bf020432c7d4feb7b3af16a0c2701455cbbbb95e5b6866132cb09eb0c29adc14"},
-  "plug_cowboy": {:hex, :plug_cowboy, "2.6.0", "d1cf12ff96a1ca4f52207c5271a6c351a4733f413803488d75b70ccf44aebec2", [:mix], [{:cowboy, "~> 2.7", [hex: :cowboy, repo: "hexpm", optional: false]}, {:cowboy_telemetry, "~> 0.3", [hex: :cowboy_telemetry, repo: "hexpm", optional: false]}, {:plug, "~> 1.14", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm", "073cf20b753ce6682ed72905cd62a2d4bd9bad1bf9f7feb02a1b8e525bd94fa6"},
-  "plug_crypto": {:hex, :plug_crypto, "1.2.3", "8f77d13aeb32bfd9e654cb68f0af517b371fb34c56c9f2b58fe3df1235c1251a", [:mix], [], "hexpm", "b5672099c6ad5c202c45f5a403f21a3411247f164e4a8fab056e5cd8a290f4a2"},
+  "plug_cowboy": {:hex, :plug_cowboy, "2.6.1", "9a3bbfceeb65eff5f39dab529e5cd79137ac36e913c02067dba3963a26efe9b2", [:mix], [{:cowboy, "~> 2.7", [hex: :cowboy, repo: "hexpm", optional: false]}, {:cowboy_telemetry, "~> 0.3", [hex: :cowboy_telemetry, repo: "hexpm", optional: false]}, {:plug, "~> 1.14", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm", "de36e1a21f451a18b790f37765db198075c25875c64834bcc82d90b309eb6613"},
+  "plug_crypto": {:hex, :plug_crypto, "1.2.5", "918772575e48e81e455818229bf719d4ab4181fcbf7f85b68a35620f78d89ced", [:mix], [], "hexpm", "26549a1d6345e2172eb1c233866756ae44a9609bd33ee6f99147ab3fd87fd842"},
   "postgrex": {:hex, :postgrex, "0.16.5", "fcc4035cc90e23933c5d69a9cd686e329469446ef7abba2cf70f08e2c4b69810", [:mix], [{:connection, "~> 1.1", [hex: :connection, repo: "hexpm", optional: false]}, {:db_connection, "~> 2.1", [hex: :db_connection, repo: "hexpm", optional: false]}, {:decimal, "~> 1.5 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:table, "~> 0.1.0", [hex: :table, repo: "hexpm", optional: true]}], "hexpm", "edead639dc6e882618c01d8fc891214c481ab9a3788dfe38dd5e37fd1d5fb2e8"},
   "ranch": {:hex, :ranch, "1.8.0", "8c7a100a139fd57f17327b6413e4167ac559fbc04ca7448e9be9057311597a1d", [:make, :rebar3], [], "hexpm", "49fbcfd3682fab1f5d109351b61257676da1a2fdbe295904176d5e521a2ddfe5"},
   "swoosh": {:hex, :swoosh, "1.9.1", "0a5d7bf9954eb41d7e55525bc0940379982b090abbaef67cd8e1fd2ed7f8ca1a", [:mix], [{:cowboy, "~> 1.1 or ~> 2.4", [hex: :cowboy, repo: "hexpm", optional: true]}, {:ex_aws, "~> 2.1", [hex: :ex_aws, repo: "hexpm", optional: true]}, {:finch, "~> 0.6", [hex: :finch, repo: "hexpm", optional: true]}, {:gen_smtp, "~> 0.13 or ~> 1.0", [hex: :gen_smtp, repo: "hexpm", optional: true]}, {:hackney, "~> 1.9", [hex: :hackney, repo: "hexpm", optional: true]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}, {:mail, "~> 0.2", [hex: :mail, repo: "hexpm", optional: true]}, {:mime, "~> 1.1 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_cowboy, ">= 1.0.0", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.2 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "76dffff3ffcab80f249d5937a592eaef7cc49ac6f4cdd27e622868326ed6371e"},
diff --git a/priv/gettext/actions.pot b/priv/gettext/actions.pot
index 15f295c..3fb0636 100644
--- a/priv/gettext/actions.pot
+++ b/priv/gettext/actions.pot
@@ -11,7 +11,7 @@ msgid ""
 msgstr ""
 
 #: lib/memex_web/templates/user_confirmation/new.html.heex:3
-#: lib/memex_web/templates/user_confirmation/new.html.heex:15
+#: lib/memex_web/templates/user_confirmation/new.html.heex:16
 #, elixir-autogen, elixir-format
 msgid "Resend confirmation instructions"
 msgstr ""
@@ -50,11 +50,11 @@ msgstr ""
 msgid "create invite"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:48
+#: lib/memex_web/live/context_live/index.html.heex:49
 #: lib/memex_web/live/context_live/show.html.heex:41
-#: lib/memex_web/live/note_live/index.html.heex:48
+#: lib/memex_web/live/note_live/index.html.heex:49
 #: lib/memex_web/live/note_live/show.html.heex:41
-#: lib/memex_web/live/pipeline_live/index.html.heex:48
+#: lib/memex_web/live/pipeline_live/index.html.heex:49
 #: lib/memex_web/live/pipeline_live/show.html.heex:49
 #: lib/memex_web/live/pipeline_live/show.html.heex:118
 #, elixir-autogen, elixir-format
@@ -66,11 +66,11 @@ msgstr ""
 msgid "delete user"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:38
+#: lib/memex_web/live/context_live/index.html.heex:39
 #: lib/memex_web/live/context_live/show.html.heex:31
-#: lib/memex_web/live/note_live/index.html.heex:38
+#: lib/memex_web/live/note_live/index.html.heex:39
 #: lib/memex_web/live/note_live/show.html.heex:31
-#: lib/memex_web/live/pipeline_live/index.html.heex:38
+#: lib/memex_web/live/pipeline_live/index.html.heex:39
 #: lib/memex_web/live/pipeline_live/show.html.heex:39
 #: lib/memex_web/live/pipeline_live/show.html.heex:107
 #, elixir-autogen, elixir-format
@@ -82,38 +82,38 @@ msgstr ""
 msgid "invite someone new!"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:122
-#: lib/memex_web/templates/user_confirmation/new.html.heex:31
+#: lib/memex_web/components/core_components/topbar.html.heex:107
+#: lib/memex_web/templates/user_confirmation/new.html.heex:32
 #: lib/memex_web/templates/user_registration/new.html.heex:44
 #: lib/memex_web/templates/user_reset_password/edit.html.heex:45
-#: lib/memex_web/templates/user_reset_password/new.html.heex:31
+#: lib/memex_web/templates/user_reset_password/new.html.heex:32
 #: lib/memex_web/templates/user_session/new.html.heex:3
 #: lib/memex_web/templates/user_session/new.html.heex:28
 #, elixir-autogen, elixir-format
 msgid "log in"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:59
+#: lib/memex_web/live/context_live/index.html.heex:60
 #, elixir-autogen, elixir-format
 msgid "new context"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:59
+#: lib/memex_web/live/note_live/index.html.heex:60
 #, elixir-autogen, elixir-format
 msgid "new note"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:59
+#: lib/memex_web/live/pipeline_live/index.html.heex:60
 #, elixir-autogen, elixir-format
 msgid "new pipeline"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:113
-#: lib/memex_web/templates/user_confirmation/new.html.heex:28
+#: lib/memex_web/components/core_components/topbar.html.heex:98
+#: lib/memex_web/templates/user_confirmation/new.html.heex:29
 #: lib/memex_web/templates/user_registration/new.html.heex:3
 #: lib/memex_web/templates/user_registration/new.html.heex:37
 #: lib/memex_web/templates/user_reset_password/edit.html.heex:42
-#: lib/memex_web/templates/user_reset_password/new.html.heex:28
+#: lib/memex_web/templates/user_reset_password/new.html.heex:29
 #: lib/memex_web/templates/user_session/new.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "register"
@@ -146,7 +146,7 @@ msgstr ""
 msgid "forgot your password?"
 msgstr ""
 
-#: lib/memex_web/templates/user_reset_password/new.html.heex:15
+#: lib/memex_web/templates/user_reset_password/new.html.heex:16
 #, elixir-autogen, elixir-format
 msgid "send instructions to reset password"
 msgstr ""
diff --git a/priv/gettext/de/LC_MESSAGES/actions.po b/priv/gettext/de/LC_MESSAGES/actions.po
index d6d710f..77a5ed0 100644
--- a/priv/gettext/de/LC_MESSAGES/actions.po
+++ b/priv/gettext/de/LC_MESSAGES/actions.po
@@ -11,7 +11,7 @@ msgstr ""
 "Language: de\n"
 
 #: lib/memex_web/templates/user_confirmation/new.html.heex:3
-#: lib/memex_web/templates/user_confirmation/new.html.heex:15
+#: lib/memex_web/templates/user_confirmation/new.html.heex:16
 #, elixir-autogen, elixir-format
 msgid "Resend confirmation instructions"
 msgstr ""
@@ -50,11 +50,11 @@ msgstr ""
 msgid "create invite"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:48
+#: lib/memex_web/live/context_live/index.html.heex:49
 #: lib/memex_web/live/context_live/show.html.heex:41
-#: lib/memex_web/live/note_live/index.html.heex:48
+#: lib/memex_web/live/note_live/index.html.heex:49
 #: lib/memex_web/live/note_live/show.html.heex:41
-#: lib/memex_web/live/pipeline_live/index.html.heex:48
+#: lib/memex_web/live/pipeline_live/index.html.heex:49
 #: lib/memex_web/live/pipeline_live/show.html.heex:49
 #: lib/memex_web/live/pipeline_live/show.html.heex:118
 #, elixir-autogen, elixir-format
@@ -66,11 +66,11 @@ msgstr ""
 msgid "delete user"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:38
+#: lib/memex_web/live/context_live/index.html.heex:39
 #: lib/memex_web/live/context_live/show.html.heex:31
-#: lib/memex_web/live/note_live/index.html.heex:38
+#: lib/memex_web/live/note_live/index.html.heex:39
 #: lib/memex_web/live/note_live/show.html.heex:31
-#: lib/memex_web/live/pipeline_live/index.html.heex:38
+#: lib/memex_web/live/pipeline_live/index.html.heex:39
 #: lib/memex_web/live/pipeline_live/show.html.heex:39
 #: lib/memex_web/live/pipeline_live/show.html.heex:107
 #, elixir-autogen, elixir-format
@@ -82,38 +82,38 @@ msgstr ""
 msgid "invite someone new!"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:122
-#: lib/memex_web/templates/user_confirmation/new.html.heex:31
+#: lib/memex_web/components/core_components/topbar.html.heex:107
+#: lib/memex_web/templates/user_confirmation/new.html.heex:32
 #: lib/memex_web/templates/user_registration/new.html.heex:44
 #: lib/memex_web/templates/user_reset_password/edit.html.heex:45
-#: lib/memex_web/templates/user_reset_password/new.html.heex:31
+#: lib/memex_web/templates/user_reset_password/new.html.heex:32
 #: lib/memex_web/templates/user_session/new.html.heex:3
 #: lib/memex_web/templates/user_session/new.html.heex:28
 #, elixir-autogen, elixir-format
 msgid "log in"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:59
+#: lib/memex_web/live/context_live/index.html.heex:60
 #, elixir-autogen, elixir-format
 msgid "new context"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:59
+#: lib/memex_web/live/note_live/index.html.heex:60
 #, elixir-autogen, elixir-format
 msgid "new note"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:59
+#: lib/memex_web/live/pipeline_live/index.html.heex:60
 #, elixir-autogen, elixir-format
 msgid "new pipeline"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:113
-#: lib/memex_web/templates/user_confirmation/new.html.heex:28
+#: lib/memex_web/components/core_components/topbar.html.heex:98
+#: lib/memex_web/templates/user_confirmation/new.html.heex:29
 #: lib/memex_web/templates/user_registration/new.html.heex:3
 #: lib/memex_web/templates/user_registration/new.html.heex:37
 #: lib/memex_web/templates/user_reset_password/edit.html.heex:42
-#: lib/memex_web/templates/user_reset_password/new.html.heex:28
+#: lib/memex_web/templates/user_reset_password/new.html.heex:29
 #: lib/memex_web/templates/user_session/new.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "register"
@@ -146,7 +146,7 @@ msgstr ""
 msgid "forgot your password?"
 msgstr ""
 
-#: lib/memex_web/templates/user_reset_password/new.html.heex:15
+#: lib/memex_web/templates/user_reset_password/new.html.heex:16
 #, elixir-autogen, elixir-format, fuzzy
 msgid "send instructions to reset password"
 msgstr ""
diff --git a/priv/gettext/de/LC_MESSAGES/default.po b/priv/gettext/de/LC_MESSAGES/default.po
index 2bffbcc..860f56a 100644
--- a/priv/gettext/de/LC_MESSAGES/default.po
+++ b/priv/gettext/de/LC_MESSAGES/default.po
@@ -60,7 +60,7 @@ msgstr ""
 msgid "content"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:52
+#: lib/memex_web/components/core_components/topbar.html.heex:37
 #: lib/memex_web/live/context_live/index.ex:35
 #: lib/memex_web/live/context_live/index.ex:43
 #: lib/memex_web/live/context_live/index.html.heex:3
@@ -99,20 +99,20 @@ msgstr ""
 msgid "document your processes, attaching contexts to each step"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:34
+#: lib/memex_web/live/invite_live/index.ex:33
 #, elixir-autogen, elixir-format
 msgid "edit invite"
 msgstr ""
 
 #: lib/memex_web/templates/user_registration/new.html.heex:20
-#: lib/memex_web/templates/user_reset_password/new.html.heex:12
+#: lib/memex_web/templates/user_reset_password/new.html.heex:13
 #: lib/memex_web/templates/user_session/new.html.heex:17
 #: lib/memex_web/templates/user_settings/edit.html.heex:27
 #, elixir-autogen, elixir-format
 msgid "email"
 msgstr ""
 
-#: lib/memex_web/components/user_card.ex:34
+#: lib/memex_web/components/core_components/user_card.html.heex:21
 #, elixir-autogen, elixir-format
 msgid "email unconfirmed"
 msgstr ""
@@ -143,7 +143,7 @@ msgstr ""
 msgid "instance information"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:43
+#: lib/memex_web/components/core_components.ex:109
 #, elixir-autogen, elixir-format
 msgid "invite disabled"
 msgstr ""
@@ -153,8 +153,8 @@ msgstr ""
 msgid "invite only"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:73
-#: lib/memex_web/live/invite_live/index.ex:42
+#: lib/memex_web/components/core_components/topbar.html.heex:58
+#: lib/memex_web/live/invite_live/index.ex:41
 #: lib/memex_web/live/invite_live/index.html.heex:3
 #, elixir-autogen, elixir-format
 msgid "invites"
@@ -170,7 +170,7 @@ msgstr ""
 msgid "multi-user:"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:38
+#: lib/memex_web/live/invite_live/index.ex:37
 #, elixir-autogen, elixir-format
 msgid "new invite"
 msgstr ""
@@ -186,12 +186,12 @@ msgstr ""
 msgid "no invites 😔"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:23
+#: lib/memex_web/live/note_live/index.html.heex:24
 #, elixir-autogen, elixir-format
 msgid "no notes found"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:43
+#: lib/memex_web/components/core_components/topbar.html.heex:28
 #: lib/memex_web/live/note_live/index.ex:35
 #: lib/memex_web/live/note_live/index.ex:43
 #: lib/memex_web/live/note_live/index.html.heex:3
@@ -204,7 +204,7 @@ msgstr ""
 msgid "notes:"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:61
+#: lib/memex_web/components/core_components/topbar.html.heex:46
 #: lib/memex_web/live/pipeline_live/index.ex:35
 #: lib/memex_web/live/pipeline_live/index.ex:43
 #: lib/memex_web/live/pipeline_live/index.html.heex:3
@@ -319,9 +319,9 @@ msgstr ""
 msgid "new note"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:17
-#: lib/memex_web/live/note_live/index.html.heex:17
-#: lib/memex_web/live/pipeline_live/index.html.heex:17
+#: lib/memex_web/live/context_live/index.html.heex:18
+#: lib/memex_web/live/note_live/index.html.heex:18
+#: lib/memex_web/live/pipeline_live/index.html.heex:18
 #, elixir-autogen, elixir-format
 msgid "search"
 msgstr ""
@@ -331,7 +331,7 @@ msgstr ""
 msgid "new context"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:23
+#: lib/memex_web/live/context_live/index.html.heex:24
 #, elixir-autogen, elixir-format
 msgid "no contexts found"
 msgstr ""
@@ -347,7 +347,7 @@ msgstr ""
 msgid "new pipeline"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:23
+#: lib/memex_web/live/pipeline_live/index.html.heex:24
 #, elixir-autogen, elixir-format
 msgid "no pipelines found"
 msgstr ""
@@ -360,11 +360,11 @@ msgid "%{slug} created"
 msgstr ""
 
 #: lib/memex_web/live/context_live/index.ex:57
-#: lib/memex_web/live/context_live/show.ex:41
+#: lib/memex_web/live/context_live/show.ex:40
 #: lib/memex_web/live/note_live/index.ex:57
-#: lib/memex_web/live/note_live/show.ex:41
+#: lib/memex_web/live/note_live/show.ex:40
 #: lib/memex_web/live/pipeline_live/index.ex:57
-#: lib/memex_web/live/pipeline_live/show.ex:77
+#: lib/memex_web/live/pipeline_live/show.ex:76
 #, elixir-autogen, elixir-format
 msgid "%{slug} deleted"
 msgstr ""
@@ -377,11 +377,11 @@ msgid "%{slug} saved"
 msgstr ""
 
 #: lib/memex_web/live/context_live/index.ex:23
-#: lib/memex_web/live/context_live/show.ex:48
+#: lib/memex_web/live/context_live/show.ex:47
 #: lib/memex_web/live/note_live/index.ex:23
-#: lib/memex_web/live/note_live/show.ex:48
+#: lib/memex_web/live/note_live/show.ex:47
 #: lib/memex_web/live/pipeline_live/index.ex:23
-#: lib/memex_web/live/pipeline_live/show.ex:123
+#: lib/memex_web/live/pipeline_live/show.ex:122
 #, elixir-autogen, elixir-format
 msgid "edit %{slug}"
 msgstr ""
@@ -396,9 +396,9 @@ msgstr ""
 msgid "slug"
 msgstr ""
 
-#: lib/memex_web/live/context_live/show.ex:19
-#: lib/memex_web/live/note_live/show.ex:19
-#: lib/memex_web/live/pipeline_live/show.ex:20
+#: lib/memex_web/live/context_live/show.ex:18
+#: lib/memex_web/live/note_live/show.ex:18
+#: lib/memex_web/live/pipeline_live/show.ex:19
 #, elixir-autogen, elixir-format
 msgid "%{slug} could not be found"
 msgstr ""
@@ -419,12 +419,12 @@ msgstr ""
 msgid "faq"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:23
+#: lib/memex_web/components/core_components/topbar.html.heex:8
 #: lib/memex_web/live/home_live.html.heex:3
 #: lib/memex_web/templates/error/error.html.heex:8
 #: lib/memex_web/templates/layout/root.html.heex:8
 #: lib/memex_web/templates/layout/root.html.heex:9
-#: lib/memex_web/views/layout_view.ex:15
+#: lib/memex_web/views/layout_view.ex:14
 #, elixir-autogen, elixir-format
 msgid "memEx"
 msgstr ""
@@ -444,7 +444,7 @@ msgstr ""
 msgid "%{title} created"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/show.ex:95
+#: lib/memex_web/live/pipeline_live/show.ex:94
 #, elixir-autogen, elixir-format
 msgid "%{title} deleted"
 msgstr ""
@@ -454,7 +454,7 @@ msgstr ""
 msgid "%{title} saved"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/show.ex:125
+#: lib/memex_web/live/pipeline_live/show.ex:124
 #, elixir-autogen, elixir-format
 msgid "add step to %{slug}"
 msgstr ""
@@ -569,7 +569,7 @@ msgstr ""
 msgid "zettelkasten"
 msgstr ""
 
-#: lib/memex_web/views/layout_view.ex:11
+#: lib/memex_web/views/layout_view.ex:10
 #, elixir-autogen, elixir-format
 msgid "memEx | %{title}"
 msgstr ""
@@ -604,17 +604,17 @@ msgstr ""
 msgid "language"
 msgstr ""
 
-#: lib/memex_web/components/user_card.ex:28
+#: lib/memex_web/components/core_components/user_card.html.heex:15
 #, elixir-autogen, elixir-format, fuzzy
 msgid "user confirmed on%{confirmed_datetime}"
 msgstr ""
 
-#: lib/memex_web/components/user_card.ex:39
+#: lib/memex_web/components/core_components/user_card.html.heex:26
 #, elixir-autogen, elixir-format, fuzzy
 msgid "user registered on%{registered_datetime}"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:38
+#: lib/memex_web/components/core_components.ex:104
 #, elixir-autogen, elixir-format
 msgid "uses left: unlimited"
 msgstr ""
@@ -624,12 +624,12 @@ msgstr ""
 msgid "read more on how to use memEx"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:33
+#: lib/memex_web/components/core_components.ex:99
 #, elixir-autogen, elixir-format, fuzzy
 msgid "uses left: %{uses_left_count}"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:53
+#: lib/memex_web/components/core_components.ex:119
 #, elixir-autogen, elixir-format
 msgid "uses: %{uses_count}"
 msgstr ""
@@ -639,7 +639,7 @@ msgstr ""
 msgid "get involved"
 msgstr ""
 
-#: lib/memex_web/templates/user_confirmation/new.html.heex:12
+#: lib/memex_web/templates/user_confirmation/new.html.heex:13
 #, elixir-autogen, elixir-format, fuzzy
 msgid "Email"
 msgstr ""
@@ -680,19 +680,19 @@ msgstr ""
 msgid "copy invite link for %{invite_name}"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:46
+#: lib/memex_web/live/context_live/index.html.heex:47
 #: lib/memex_web/live/context_live/show.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "delete %{context_slug}"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:46
+#: lib/memex_web/live/note_live/index.html.heex:47
 #: lib/memex_web/live/note_live/show.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "delete %{note_slug}"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:46
+#: lib/memex_web/live/pipeline_live/index.html.heex:47
 #: lib/memex_web/live/pipeline_live/show.html.heex:47
 #, elixir-autogen, elixir-format
 msgid "delete %{pipeline_slug}"
@@ -708,17 +708,17 @@ msgstr ""
 msgid "delete invite for %{invite_name}"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:36
+#: lib/memex_web/live/context_live/index.html.heex:37
 #, elixir-autogen, elixir-format, fuzzy
 msgid "edit %{context_slug}"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:36
+#: lib/memex_web/live/note_live/index.html.heex:37
 #, elixir-autogen, elixir-format, fuzzy
 msgid "edit %{note_slug}"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:36
+#: lib/memex_web/live/pipeline_live/index.html.heex:37
 #, elixir-autogen, elixir-format, fuzzy
 msgid "edit %{pipeline_slug}"
 msgstr ""
diff --git a/priv/gettext/de/LC_MESSAGES/errors.po b/priv/gettext/de/LC_MESSAGES/errors.po
index f51e698..e775d41 100644
--- a/priv/gettext/de/LC_MESSAGES/errors.po
+++ b/priv/gettext/de/LC_MESSAGES/errors.po
@@ -88,17 +88,17 @@ msgstr ""
 msgid "go back home"
 msgstr ""
 
-#: lib/memex_web/views/error_view.ex:11
+#: lib/memex_web/views/error_view.ex:10
 #, elixir-autogen, elixir-format
 msgid "internal server error"
 msgstr ""
 
-#: lib/memex_web/views/error_view.ex:9
+#: lib/memex_web/views/error_view.ex:8
 #, elixir-autogen, elixir-format
 msgid "not found"
 msgstr ""
 
-#: lib/memex_web/views/error_view.ex:10
+#: lib/memex_web/views/error_view.ex:9
 #, elixir-autogen, elixir-format
 msgid "unauthorized"
 msgstr ""
@@ -122,7 +122,7 @@ msgstr ""
 msgid "sorry, this invite was not found or expired"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:19
+#: lib/memex_web/live/invite_live/index.ex:18
 #, elixir-autogen, elixir-format, fuzzy
 msgid "you are not authorized to view this page"
 msgstr ""
diff --git a/priv/gettext/de/LC_MESSAGES/prompts.po b/priv/gettext/de/LC_MESSAGES/prompts.po
index 6b6057f..fc5f77f 100644
--- a/priv/gettext/de/LC_MESSAGES/prompts.po
+++ b/priv/gettext/de/LC_MESSAGES/prompts.po
@@ -15,27 +15,27 @@ msgstr ""
 msgid "%{email} confirmed successfully."
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:54
+#: lib/memex_web/live/invite_live/index.ex:53
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} deleted succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:115
+#: lib/memex_web/live/invite_live/index.ex:114
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} disabled succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:91
+#: lib/memex_web/live/invite_live/index.ex:90
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} enabled succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:69
+#: lib/memex_web/live/invite_live/index.ex:68
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} updated succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:138
+#: lib/memex_web/live/invite_live/index.ex:137
 #, elixir-autogen, elixir-format
 msgid "%{user_email} deleted succesfully"
 msgstr ""
@@ -75,7 +75,7 @@ msgstr ""
 msgid "are you sure you want to delete your account?"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:89
+#: lib/memex_web/components/core_components/topbar.html.heex:74
 #, elixir-autogen, elixir-format
 msgid "are you sure you want to log out?"
 msgstr ""
@@ -85,11 +85,11 @@ msgstr ""
 msgid "are you sure you want to make %{invite_name} unlimited?"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:45
+#: lib/memex_web/live/context_live/index.html.heex:46
 #: lib/memex_web/live/context_live/show.html.heex:38
-#: lib/memex_web/live/note_live/index.html.heex:45
+#: lib/memex_web/live/note_live/index.html.heex:46
 #: lib/memex_web/live/note_live/show.html.heex:38
-#: lib/memex_web/live/pipeline_live/index.html.heex:45
+#: lib/memex_web/live/pipeline_live/index.html.heex:46
 #: lib/memex_web/live/pipeline_live/show.html.heex:46
 #: lib/memex_web/live/pipeline_live/show.html.heex:115
 #, elixir-autogen, elixir-format
@@ -121,7 +121,7 @@ msgstr ""
 msgid "%{name} updated successfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:127
+#: lib/memex_web/live/invite_live/index.ex:126
 #, elixir-autogen, elixir-format, fuzzy
 msgid "copied to clipboard"
 msgstr ""
diff --git a/priv/gettext/default.pot b/priv/gettext/default.pot
index 1a51efb..0a3c39a 100644
--- a/priv/gettext/default.pot
+++ b/priv/gettext/default.pot
@@ -58,7 +58,7 @@ msgstr ""
 msgid "content"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:52
+#: lib/memex_web/components/core_components/topbar.html.heex:37
 #: lib/memex_web/live/context_live/index.ex:35
 #: lib/memex_web/live/context_live/index.ex:43
 #: lib/memex_web/live/context_live/index.html.heex:3
@@ -97,20 +97,20 @@ msgstr ""
 msgid "document your processes, attaching contexts to each step"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:34
+#: lib/memex_web/live/invite_live/index.ex:33
 #, elixir-autogen, elixir-format
 msgid "edit invite"
 msgstr ""
 
 #: lib/memex_web/templates/user_registration/new.html.heex:20
-#: lib/memex_web/templates/user_reset_password/new.html.heex:12
+#: lib/memex_web/templates/user_reset_password/new.html.heex:13
 #: lib/memex_web/templates/user_session/new.html.heex:17
 #: lib/memex_web/templates/user_settings/edit.html.heex:27
 #, elixir-autogen, elixir-format
 msgid "email"
 msgstr ""
 
-#: lib/memex_web/components/user_card.ex:34
+#: lib/memex_web/components/core_components/user_card.html.heex:21
 #, elixir-autogen, elixir-format
 msgid "email unconfirmed"
 msgstr ""
@@ -141,7 +141,7 @@ msgstr ""
 msgid "instance information"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:43
+#: lib/memex_web/components/core_components.ex:109
 #, elixir-autogen, elixir-format
 msgid "invite disabled"
 msgstr ""
@@ -151,8 +151,8 @@ msgstr ""
 msgid "invite only"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:73
-#: lib/memex_web/live/invite_live/index.ex:42
+#: lib/memex_web/components/core_components/topbar.html.heex:58
+#: lib/memex_web/live/invite_live/index.ex:41
 #: lib/memex_web/live/invite_live/index.html.heex:3
 #, elixir-autogen, elixir-format
 msgid "invites"
@@ -168,7 +168,7 @@ msgstr ""
 msgid "multi-user:"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:38
+#: lib/memex_web/live/invite_live/index.ex:37
 #, elixir-autogen, elixir-format
 msgid "new invite"
 msgstr ""
@@ -184,12 +184,12 @@ msgstr ""
 msgid "no invites 😔"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:23
+#: lib/memex_web/live/note_live/index.html.heex:24
 #, elixir-autogen, elixir-format
 msgid "no notes found"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:43
+#: lib/memex_web/components/core_components/topbar.html.heex:28
 #: lib/memex_web/live/note_live/index.ex:35
 #: lib/memex_web/live/note_live/index.ex:43
 #: lib/memex_web/live/note_live/index.html.heex:3
@@ -202,7 +202,7 @@ msgstr ""
 msgid "notes:"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:61
+#: lib/memex_web/components/core_components/topbar.html.heex:46
 #: lib/memex_web/live/pipeline_live/index.ex:35
 #: lib/memex_web/live/pipeline_live/index.ex:43
 #: lib/memex_web/live/pipeline_live/index.html.heex:3
@@ -317,9 +317,9 @@ msgstr ""
 msgid "new note"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:17
-#: lib/memex_web/live/note_live/index.html.heex:17
-#: lib/memex_web/live/pipeline_live/index.html.heex:17
+#: lib/memex_web/live/context_live/index.html.heex:18
+#: lib/memex_web/live/note_live/index.html.heex:18
+#: lib/memex_web/live/pipeline_live/index.html.heex:18
 #, elixir-autogen, elixir-format
 msgid "search"
 msgstr ""
@@ -329,7 +329,7 @@ msgstr ""
 msgid "new context"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:23
+#: lib/memex_web/live/context_live/index.html.heex:24
 #, elixir-autogen, elixir-format
 msgid "no contexts found"
 msgstr ""
@@ -345,7 +345,7 @@ msgstr ""
 msgid "new pipeline"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:23
+#: lib/memex_web/live/pipeline_live/index.html.heex:24
 #, elixir-autogen, elixir-format
 msgid "no pipelines found"
 msgstr ""
@@ -358,11 +358,11 @@ msgid "%{slug} created"
 msgstr ""
 
 #: lib/memex_web/live/context_live/index.ex:57
-#: lib/memex_web/live/context_live/show.ex:41
+#: lib/memex_web/live/context_live/show.ex:40
 #: lib/memex_web/live/note_live/index.ex:57
-#: lib/memex_web/live/note_live/show.ex:41
+#: lib/memex_web/live/note_live/show.ex:40
 #: lib/memex_web/live/pipeline_live/index.ex:57
-#: lib/memex_web/live/pipeline_live/show.ex:77
+#: lib/memex_web/live/pipeline_live/show.ex:76
 #, elixir-autogen, elixir-format
 msgid "%{slug} deleted"
 msgstr ""
@@ -375,11 +375,11 @@ msgid "%{slug} saved"
 msgstr ""
 
 #: lib/memex_web/live/context_live/index.ex:23
-#: lib/memex_web/live/context_live/show.ex:48
+#: lib/memex_web/live/context_live/show.ex:47
 #: lib/memex_web/live/note_live/index.ex:23
-#: lib/memex_web/live/note_live/show.ex:48
+#: lib/memex_web/live/note_live/show.ex:47
 #: lib/memex_web/live/pipeline_live/index.ex:23
-#: lib/memex_web/live/pipeline_live/show.ex:123
+#: lib/memex_web/live/pipeline_live/show.ex:122
 #, elixir-autogen, elixir-format
 msgid "edit %{slug}"
 msgstr ""
@@ -394,9 +394,9 @@ msgstr ""
 msgid "slug"
 msgstr ""
 
-#: lib/memex_web/live/context_live/show.ex:19
-#: lib/memex_web/live/note_live/show.ex:19
-#: lib/memex_web/live/pipeline_live/show.ex:20
+#: lib/memex_web/live/context_live/show.ex:18
+#: lib/memex_web/live/note_live/show.ex:18
+#: lib/memex_web/live/pipeline_live/show.ex:19
 #, elixir-autogen, elixir-format
 msgid "%{slug} could not be found"
 msgstr ""
@@ -417,12 +417,12 @@ msgstr ""
 msgid "faq"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:23
+#: lib/memex_web/components/core_components/topbar.html.heex:8
 #: lib/memex_web/live/home_live.html.heex:3
 #: lib/memex_web/templates/error/error.html.heex:8
 #: lib/memex_web/templates/layout/root.html.heex:8
 #: lib/memex_web/templates/layout/root.html.heex:9
-#: lib/memex_web/views/layout_view.ex:15
+#: lib/memex_web/views/layout_view.ex:14
 #, elixir-autogen, elixir-format
 msgid "memEx"
 msgstr ""
@@ -442,7 +442,7 @@ msgstr ""
 msgid "%{title} created"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/show.ex:95
+#: lib/memex_web/live/pipeline_live/show.ex:94
 #, elixir-autogen, elixir-format
 msgid "%{title} deleted"
 msgstr ""
@@ -452,7 +452,7 @@ msgstr ""
 msgid "%{title} saved"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/show.ex:125
+#: lib/memex_web/live/pipeline_live/show.ex:124
 #, elixir-autogen, elixir-format
 msgid "add step to %{slug}"
 msgstr ""
@@ -567,7 +567,7 @@ msgstr ""
 msgid "zettelkasten"
 msgstr ""
 
-#: lib/memex_web/views/layout_view.ex:11
+#: lib/memex_web/views/layout_view.ex:10
 #, elixir-autogen, elixir-format
 msgid "memEx | %{title}"
 msgstr ""
@@ -602,17 +602,17 @@ msgstr ""
 msgid "language"
 msgstr ""
 
-#: lib/memex_web/components/user_card.ex:28
+#: lib/memex_web/components/core_components/user_card.html.heex:15
 #, elixir-autogen, elixir-format
 msgid "user confirmed on%{confirmed_datetime}"
 msgstr ""
 
-#: lib/memex_web/components/user_card.ex:39
+#: lib/memex_web/components/core_components/user_card.html.heex:26
 #, elixir-autogen, elixir-format
 msgid "user registered on%{registered_datetime}"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:38
+#: lib/memex_web/components/core_components.ex:104
 #, elixir-autogen, elixir-format
 msgid "uses left: unlimited"
 msgstr ""
@@ -622,12 +622,12 @@ msgstr ""
 msgid "read more on how to use memEx"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:33
+#: lib/memex_web/components/core_components.ex:99
 #, elixir-autogen, elixir-format
 msgid "uses left: %{uses_left_count}"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:53
+#: lib/memex_web/components/core_components.ex:119
 #, elixir-autogen, elixir-format
 msgid "uses: %{uses_count}"
 msgstr ""
@@ -637,7 +637,7 @@ msgstr ""
 msgid "get involved"
 msgstr ""
 
-#: lib/memex_web/templates/user_confirmation/new.html.heex:12
+#: lib/memex_web/templates/user_confirmation/new.html.heex:13
 #, elixir-autogen, elixir-format
 msgid "Email"
 msgstr ""
@@ -678,19 +678,19 @@ msgstr ""
 msgid "copy invite link for %{invite_name}"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:46
+#: lib/memex_web/live/context_live/index.html.heex:47
 #: lib/memex_web/live/context_live/show.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "delete %{context_slug}"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:46
+#: lib/memex_web/live/note_live/index.html.heex:47
 #: lib/memex_web/live/note_live/show.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "delete %{note_slug}"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:46
+#: lib/memex_web/live/pipeline_live/index.html.heex:47
 #: lib/memex_web/live/pipeline_live/show.html.heex:47
 #, elixir-autogen, elixir-format
 msgid "delete %{pipeline_slug}"
@@ -706,17 +706,17 @@ msgstr ""
 msgid "delete invite for %{invite_name}"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:36
+#: lib/memex_web/live/context_live/index.html.heex:37
 #, elixir-autogen, elixir-format
 msgid "edit %{context_slug}"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:36
+#: lib/memex_web/live/note_live/index.html.heex:37
 #, elixir-autogen, elixir-format
 msgid "edit %{note_slug}"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:36
+#: lib/memex_web/live/pipeline_live/index.html.heex:37
 #, elixir-autogen, elixir-format
 msgid "edit %{pipeline_slug}"
 msgstr ""
diff --git a/priv/gettext/en/LC_MESSAGES/actions.po b/priv/gettext/en/LC_MESSAGES/actions.po
index 60060b7..da26079 100644
--- a/priv/gettext/en/LC_MESSAGES/actions.po
+++ b/priv/gettext/en/LC_MESSAGES/actions.po
@@ -12,7 +12,7 @@ msgstr ""
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
 
 #: lib/memex_web/templates/user_confirmation/new.html.heex:3
-#: lib/memex_web/templates/user_confirmation/new.html.heex:15
+#: lib/memex_web/templates/user_confirmation/new.html.heex:16
 #, elixir-autogen, elixir-format
 msgid "Resend confirmation instructions"
 msgstr ""
@@ -51,11 +51,11 @@ msgstr ""
 msgid "create invite"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:48
+#: lib/memex_web/live/context_live/index.html.heex:49
 #: lib/memex_web/live/context_live/show.html.heex:41
-#: lib/memex_web/live/note_live/index.html.heex:48
+#: lib/memex_web/live/note_live/index.html.heex:49
 #: lib/memex_web/live/note_live/show.html.heex:41
-#: lib/memex_web/live/pipeline_live/index.html.heex:48
+#: lib/memex_web/live/pipeline_live/index.html.heex:49
 #: lib/memex_web/live/pipeline_live/show.html.heex:49
 #: lib/memex_web/live/pipeline_live/show.html.heex:118
 #, elixir-autogen, elixir-format
@@ -67,11 +67,11 @@ msgstr ""
 msgid "delete user"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:38
+#: lib/memex_web/live/context_live/index.html.heex:39
 #: lib/memex_web/live/context_live/show.html.heex:31
-#: lib/memex_web/live/note_live/index.html.heex:38
+#: lib/memex_web/live/note_live/index.html.heex:39
 #: lib/memex_web/live/note_live/show.html.heex:31
-#: lib/memex_web/live/pipeline_live/index.html.heex:38
+#: lib/memex_web/live/pipeline_live/index.html.heex:39
 #: lib/memex_web/live/pipeline_live/show.html.heex:39
 #: lib/memex_web/live/pipeline_live/show.html.heex:107
 #, elixir-autogen, elixir-format
@@ -83,38 +83,38 @@ msgstr ""
 msgid "invite someone new!"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:122
-#: lib/memex_web/templates/user_confirmation/new.html.heex:31
+#: lib/memex_web/components/core_components/topbar.html.heex:107
+#: lib/memex_web/templates/user_confirmation/new.html.heex:32
 #: lib/memex_web/templates/user_registration/new.html.heex:44
 #: lib/memex_web/templates/user_reset_password/edit.html.heex:45
-#: lib/memex_web/templates/user_reset_password/new.html.heex:31
+#: lib/memex_web/templates/user_reset_password/new.html.heex:32
 #: lib/memex_web/templates/user_session/new.html.heex:3
 #: lib/memex_web/templates/user_session/new.html.heex:28
 #, elixir-autogen, elixir-format
 msgid "log in"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:59
+#: lib/memex_web/live/context_live/index.html.heex:60
 #, elixir-autogen, elixir-format
 msgid "new context"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:59
+#: lib/memex_web/live/note_live/index.html.heex:60
 #, elixir-autogen, elixir-format
 msgid "new note"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:59
+#: lib/memex_web/live/pipeline_live/index.html.heex:60
 #, elixir-autogen, elixir-format
 msgid "new pipeline"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:113
-#: lib/memex_web/templates/user_confirmation/new.html.heex:28
+#: lib/memex_web/components/core_components/topbar.html.heex:98
+#: lib/memex_web/templates/user_confirmation/new.html.heex:29
 #: lib/memex_web/templates/user_registration/new.html.heex:3
 #: lib/memex_web/templates/user_registration/new.html.heex:37
 #: lib/memex_web/templates/user_reset_password/edit.html.heex:42
-#: lib/memex_web/templates/user_reset_password/new.html.heex:28
+#: lib/memex_web/templates/user_reset_password/new.html.heex:29
 #: lib/memex_web/templates/user_session/new.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "register"
@@ -147,7 +147,7 @@ msgstr ""
 msgid "forgot your password?"
 msgstr ""
 
-#: lib/memex_web/templates/user_reset_password/new.html.heex:15
+#: lib/memex_web/templates/user_reset_password/new.html.heex:16
 #, elixir-autogen, elixir-format
 msgid "send instructions to reset password"
 msgstr ""
diff --git a/priv/gettext/en/LC_MESSAGES/default.po b/priv/gettext/en/LC_MESSAGES/default.po
index ead3196..1887435 100644
--- a/priv/gettext/en/LC_MESSAGES/default.po
+++ b/priv/gettext/en/LC_MESSAGES/default.po
@@ -59,7 +59,7 @@ msgstr ""
 msgid "content"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:52
+#: lib/memex_web/components/core_components/topbar.html.heex:37
 #: lib/memex_web/live/context_live/index.ex:35
 #: lib/memex_web/live/context_live/index.ex:43
 #: lib/memex_web/live/context_live/index.html.heex:3
@@ -98,20 +98,20 @@ msgstr ""
 msgid "document your processes, attaching contexts to each step"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:34
+#: lib/memex_web/live/invite_live/index.ex:33
 #, elixir-autogen, elixir-format
 msgid "edit invite"
 msgstr ""
 
 #: lib/memex_web/templates/user_registration/new.html.heex:20
-#: lib/memex_web/templates/user_reset_password/new.html.heex:12
+#: lib/memex_web/templates/user_reset_password/new.html.heex:13
 #: lib/memex_web/templates/user_session/new.html.heex:17
 #: lib/memex_web/templates/user_settings/edit.html.heex:27
 #, elixir-autogen, elixir-format
 msgid "email"
 msgstr ""
 
-#: lib/memex_web/components/user_card.ex:34
+#: lib/memex_web/components/core_components/user_card.html.heex:21
 #, elixir-autogen, elixir-format
 msgid "email unconfirmed"
 msgstr ""
@@ -142,7 +142,7 @@ msgstr ""
 msgid "instance information"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:43
+#: lib/memex_web/components/core_components.ex:109
 #, elixir-autogen, elixir-format
 msgid "invite disabled"
 msgstr ""
@@ -152,8 +152,8 @@ msgstr ""
 msgid "invite only"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:73
-#: lib/memex_web/live/invite_live/index.ex:42
+#: lib/memex_web/components/core_components/topbar.html.heex:58
+#: lib/memex_web/live/invite_live/index.ex:41
 #: lib/memex_web/live/invite_live/index.html.heex:3
 #, elixir-autogen, elixir-format
 msgid "invites"
@@ -169,7 +169,7 @@ msgstr ""
 msgid "multi-user:"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:38
+#: lib/memex_web/live/invite_live/index.ex:37
 #, elixir-autogen, elixir-format
 msgid "new invite"
 msgstr ""
@@ -185,12 +185,12 @@ msgstr ""
 msgid "no invites 😔"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:23
+#: lib/memex_web/live/note_live/index.html.heex:24
 #, elixir-autogen, elixir-format
 msgid "no notes found"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:43
+#: lib/memex_web/components/core_components/topbar.html.heex:28
 #: lib/memex_web/live/note_live/index.ex:35
 #: lib/memex_web/live/note_live/index.ex:43
 #: lib/memex_web/live/note_live/index.html.heex:3
@@ -203,7 +203,7 @@ msgstr ""
 msgid "notes:"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:61
+#: lib/memex_web/components/core_components/topbar.html.heex:46
 #: lib/memex_web/live/pipeline_live/index.ex:35
 #: lib/memex_web/live/pipeline_live/index.ex:43
 #: lib/memex_web/live/pipeline_live/index.html.heex:3
@@ -318,9 +318,9 @@ msgstr ""
 msgid "new note"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:17
-#: lib/memex_web/live/note_live/index.html.heex:17
-#: lib/memex_web/live/pipeline_live/index.html.heex:17
+#: lib/memex_web/live/context_live/index.html.heex:18
+#: lib/memex_web/live/note_live/index.html.heex:18
+#: lib/memex_web/live/pipeline_live/index.html.heex:18
 #, elixir-autogen, elixir-format
 msgid "search"
 msgstr ""
@@ -330,7 +330,7 @@ msgstr ""
 msgid "new context"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:23
+#: lib/memex_web/live/context_live/index.html.heex:24
 #, elixir-autogen, elixir-format
 msgid "no contexts found"
 msgstr ""
@@ -346,7 +346,7 @@ msgstr ""
 msgid "new pipeline"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:23
+#: lib/memex_web/live/pipeline_live/index.html.heex:24
 #, elixir-autogen, elixir-format
 msgid "no pipelines found"
 msgstr ""
@@ -359,11 +359,11 @@ msgid "%{slug} created"
 msgstr ""
 
 #: lib/memex_web/live/context_live/index.ex:57
-#: lib/memex_web/live/context_live/show.ex:41
+#: lib/memex_web/live/context_live/show.ex:40
 #: lib/memex_web/live/note_live/index.ex:57
-#: lib/memex_web/live/note_live/show.ex:41
+#: lib/memex_web/live/note_live/show.ex:40
 #: lib/memex_web/live/pipeline_live/index.ex:57
-#: lib/memex_web/live/pipeline_live/show.ex:77
+#: lib/memex_web/live/pipeline_live/show.ex:76
 #, elixir-autogen, elixir-format
 msgid "%{slug} deleted"
 msgstr ""
@@ -376,11 +376,11 @@ msgid "%{slug} saved"
 msgstr ""
 
 #: lib/memex_web/live/context_live/index.ex:23
-#: lib/memex_web/live/context_live/show.ex:48
+#: lib/memex_web/live/context_live/show.ex:47
 #: lib/memex_web/live/note_live/index.ex:23
-#: lib/memex_web/live/note_live/show.ex:48
+#: lib/memex_web/live/note_live/show.ex:47
 #: lib/memex_web/live/pipeline_live/index.ex:23
-#: lib/memex_web/live/pipeline_live/show.ex:123
+#: lib/memex_web/live/pipeline_live/show.ex:122
 #, elixir-autogen, elixir-format
 msgid "edit %{slug}"
 msgstr ""
@@ -395,9 +395,9 @@ msgstr ""
 msgid "slug"
 msgstr ""
 
-#: lib/memex_web/live/context_live/show.ex:19
-#: lib/memex_web/live/note_live/show.ex:19
-#: lib/memex_web/live/pipeline_live/show.ex:20
+#: lib/memex_web/live/context_live/show.ex:18
+#: lib/memex_web/live/note_live/show.ex:18
+#: lib/memex_web/live/pipeline_live/show.ex:19
 #, elixir-autogen, elixir-format
 msgid "%{slug} could not be found"
 msgstr ""
@@ -418,12 +418,12 @@ msgstr ""
 msgid "faq"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:23
+#: lib/memex_web/components/core_components/topbar.html.heex:8
 #: lib/memex_web/live/home_live.html.heex:3
 #: lib/memex_web/templates/error/error.html.heex:8
 #: lib/memex_web/templates/layout/root.html.heex:8
 #: lib/memex_web/templates/layout/root.html.heex:9
-#: lib/memex_web/views/layout_view.ex:15
+#: lib/memex_web/views/layout_view.ex:14
 #, elixir-autogen, elixir-format
 msgid "memEx"
 msgstr ""
@@ -443,7 +443,7 @@ msgstr ""
 msgid "%{title} created"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/show.ex:95
+#: lib/memex_web/live/pipeline_live/show.ex:94
 #, elixir-autogen, elixir-format
 msgid "%{title} deleted"
 msgstr ""
@@ -453,7 +453,7 @@ msgstr ""
 msgid "%{title} saved"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/show.ex:125
+#: lib/memex_web/live/pipeline_live/show.ex:124
 #, elixir-autogen, elixir-format
 msgid "add step to %{slug}"
 msgstr ""
@@ -568,7 +568,7 @@ msgstr ""
 msgid "zettelkasten"
 msgstr ""
 
-#: lib/memex_web/views/layout_view.ex:11
+#: lib/memex_web/views/layout_view.ex:10
 #, elixir-autogen, elixir-format
 msgid "memEx | %{title}"
 msgstr ""
@@ -603,17 +603,17 @@ msgstr ""
 msgid "language"
 msgstr ""
 
-#: lib/memex_web/components/user_card.ex:28
+#: lib/memex_web/components/core_components/user_card.html.heex:15
 #, elixir-autogen, elixir-format
 msgid "user confirmed on%{confirmed_datetime}"
 msgstr ""
 
-#: lib/memex_web/components/user_card.ex:39
+#: lib/memex_web/components/core_components/user_card.html.heex:26
 #, elixir-autogen, elixir-format
 msgid "user registered on%{registered_datetime}"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:38
+#: lib/memex_web/components/core_components.ex:104
 #, elixir-autogen, elixir-format
 msgid "uses left: unlimited"
 msgstr ""
@@ -623,12 +623,12 @@ msgstr ""
 msgid "read more on how to use memEx"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:33
+#: lib/memex_web/components/core_components.ex:99
 #, elixir-autogen, elixir-format
 msgid "uses left: %{uses_left_count}"
 msgstr ""
 
-#: lib/memex_web/components/invite_card.ex:53
+#: lib/memex_web/components/core_components.ex:119
 #, elixir-autogen, elixir-format
 msgid "uses: %{uses_count}"
 msgstr ""
@@ -638,7 +638,7 @@ msgstr ""
 msgid "get involved"
 msgstr ""
 
-#: lib/memex_web/templates/user_confirmation/new.html.heex:12
+#: lib/memex_web/templates/user_confirmation/new.html.heex:13
 #, elixir-autogen, elixir-format
 msgid "Email"
 msgstr ""
@@ -679,19 +679,19 @@ msgstr ""
 msgid "copy invite link for %{invite_name}"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:46
+#: lib/memex_web/live/context_live/index.html.heex:47
 #: lib/memex_web/live/context_live/show.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "delete %{context_slug}"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:46
+#: lib/memex_web/live/note_live/index.html.heex:47
 #: lib/memex_web/live/note_live/show.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "delete %{note_slug}"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:46
+#: lib/memex_web/live/pipeline_live/index.html.heex:47
 #: lib/memex_web/live/pipeline_live/show.html.heex:47
 #, elixir-autogen, elixir-format
 msgid "delete %{pipeline_slug}"
@@ -707,17 +707,17 @@ msgstr ""
 msgid "delete invite for %{invite_name}"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:36
+#: lib/memex_web/live/context_live/index.html.heex:37
 #, elixir-autogen, elixir-format, fuzzy
 msgid "edit %{context_slug}"
 msgstr ""
 
-#: lib/memex_web/live/note_live/index.html.heex:36
+#: lib/memex_web/live/note_live/index.html.heex:37
 #, elixir-autogen, elixir-format, fuzzy
 msgid "edit %{note_slug}"
 msgstr ""
 
-#: lib/memex_web/live/pipeline_live/index.html.heex:36
+#: lib/memex_web/live/pipeline_live/index.html.heex:37
 #, elixir-autogen, elixir-format, fuzzy
 msgid "edit %{pipeline_slug}"
 msgstr ""
diff --git a/priv/gettext/en/LC_MESSAGES/errors.po b/priv/gettext/en/LC_MESSAGES/errors.po
index 89d4404..69b2c81 100644
--- a/priv/gettext/en/LC_MESSAGES/errors.po
+++ b/priv/gettext/en/LC_MESSAGES/errors.po
@@ -89,17 +89,17 @@ msgstr ""
 msgid "go back home"
 msgstr ""
 
-#: lib/memex_web/views/error_view.ex:11
+#: lib/memex_web/views/error_view.ex:10
 #, elixir-autogen, elixir-format
 msgid "internal server error"
 msgstr ""
 
-#: lib/memex_web/views/error_view.ex:9
+#: lib/memex_web/views/error_view.ex:8
 #, elixir-autogen, elixir-format
 msgid "not found"
 msgstr ""
 
-#: lib/memex_web/views/error_view.ex:10
+#: lib/memex_web/views/error_view.ex:9
 #, elixir-autogen, elixir-format
 msgid "unauthorized"
 msgstr ""
@@ -123,7 +123,7 @@ msgstr ""
 msgid "sorry, this invite was not found or expired"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:19
+#: lib/memex_web/live/invite_live/index.ex:18
 #, elixir-autogen, elixir-format
 msgid "you are not authorized to view this page"
 msgstr ""
diff --git a/priv/gettext/en/LC_MESSAGES/prompts.po b/priv/gettext/en/LC_MESSAGES/prompts.po
index 243f724..fafe5bf 100644
--- a/priv/gettext/en/LC_MESSAGES/prompts.po
+++ b/priv/gettext/en/LC_MESSAGES/prompts.po
@@ -16,27 +16,27 @@ msgstr ""
 msgid "%{email} confirmed successfully."
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:54
+#: lib/memex_web/live/invite_live/index.ex:53
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} deleted succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:115
+#: lib/memex_web/live/invite_live/index.ex:114
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} disabled succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:91
+#: lib/memex_web/live/invite_live/index.ex:90
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} enabled succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:69
+#: lib/memex_web/live/invite_live/index.ex:68
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} updated succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:138
+#: lib/memex_web/live/invite_live/index.ex:137
 #, elixir-autogen, elixir-format
 msgid "%{user_email} deleted succesfully"
 msgstr ""
@@ -76,7 +76,7 @@ msgstr ""
 msgid "are you sure you want to delete your account?"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:89
+#: lib/memex_web/components/core_components/topbar.html.heex:74
 #, elixir-autogen, elixir-format
 msgid "are you sure you want to log out?"
 msgstr ""
@@ -86,11 +86,11 @@ msgstr ""
 msgid "are you sure you want to make %{invite_name} unlimited?"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:45
+#: lib/memex_web/live/context_live/index.html.heex:46
 #: lib/memex_web/live/context_live/show.html.heex:38
-#: lib/memex_web/live/note_live/index.html.heex:45
+#: lib/memex_web/live/note_live/index.html.heex:46
 #: lib/memex_web/live/note_live/show.html.heex:38
-#: lib/memex_web/live/pipeline_live/index.html.heex:45
+#: lib/memex_web/live/pipeline_live/index.html.heex:46
 #: lib/memex_web/live/pipeline_live/show.html.heex:46
 #: lib/memex_web/live/pipeline_live/show.html.heex:115
 #, elixir-autogen, elixir-format
@@ -122,7 +122,7 @@ msgstr ""
 msgid "%{name} updated successfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:127
+#: lib/memex_web/live/invite_live/index.ex:126
 #, elixir-autogen, elixir-format
 msgid "copied to clipboard"
 msgstr ""
diff --git a/priv/gettext/errors.pot b/priv/gettext/errors.pot
index da1f6dd..8b4e21d 100644
--- a/priv/gettext/errors.pot
+++ b/priv/gettext/errors.pot
@@ -88,17 +88,17 @@ msgstr ""
 msgid "go back home"
 msgstr ""
 
-#: lib/memex_web/views/error_view.ex:11
+#: lib/memex_web/views/error_view.ex:10
 #, elixir-autogen, elixir-format
 msgid "internal server error"
 msgstr ""
 
-#: lib/memex_web/views/error_view.ex:9
+#: lib/memex_web/views/error_view.ex:8
 #, elixir-autogen, elixir-format
 msgid "not found"
 msgstr ""
 
-#: lib/memex_web/views/error_view.ex:10
+#: lib/memex_web/views/error_view.ex:9
 #, elixir-autogen, elixir-format
 msgid "unauthorized"
 msgstr ""
@@ -122,7 +122,7 @@ msgstr ""
 msgid "sorry, this invite was not found or expired"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:19
+#: lib/memex_web/live/invite_live/index.ex:18
 #, elixir-autogen, elixir-format
 msgid "you are not authorized to view this page"
 msgstr ""
diff --git a/priv/gettext/prompts.pot b/priv/gettext/prompts.pot
index 93d7059..a496a66 100644
--- a/priv/gettext/prompts.pot
+++ b/priv/gettext/prompts.pot
@@ -15,27 +15,27 @@ msgstr ""
 msgid "%{email} confirmed successfully."
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:54
+#: lib/memex_web/live/invite_live/index.ex:53
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} deleted succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:115
+#: lib/memex_web/live/invite_live/index.ex:114
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} disabled succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:91
+#: lib/memex_web/live/invite_live/index.ex:90
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} enabled succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:69
+#: lib/memex_web/live/invite_live/index.ex:68
 #, elixir-autogen, elixir-format
 msgid "%{invite_name} updated succesfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:138
+#: lib/memex_web/live/invite_live/index.ex:137
 #, elixir-autogen, elixir-format
 msgid "%{user_email} deleted succesfully"
 msgstr ""
@@ -75,7 +75,7 @@ msgstr ""
 msgid "are you sure you want to delete your account?"
 msgstr ""
 
-#: lib/memex_web/components/topbar.ex:89
+#: lib/memex_web/components/core_components/topbar.html.heex:74
 #, elixir-autogen, elixir-format
 msgid "are you sure you want to log out?"
 msgstr ""
@@ -85,11 +85,11 @@ msgstr ""
 msgid "are you sure you want to make %{invite_name} unlimited?"
 msgstr ""
 
-#: lib/memex_web/live/context_live/index.html.heex:45
+#: lib/memex_web/live/context_live/index.html.heex:46
 #: lib/memex_web/live/context_live/show.html.heex:38
-#: lib/memex_web/live/note_live/index.html.heex:45
+#: lib/memex_web/live/note_live/index.html.heex:46
 #: lib/memex_web/live/note_live/show.html.heex:38
-#: lib/memex_web/live/pipeline_live/index.html.heex:45
+#: lib/memex_web/live/pipeline_live/index.html.heex:46
 #: lib/memex_web/live/pipeline_live/show.html.heex:46
 #: lib/memex_web/live/pipeline_live/show.html.heex:115
 #, elixir-autogen, elixir-format
@@ -121,7 +121,7 @@ msgstr ""
 msgid "%{name} updated successfully"
 msgstr ""
 
-#: lib/memex_web/live/invite_live/index.ex:127
+#: lib/memex_web/live/invite_live/index.ex:126
 #, elixir-autogen, elixir-format
 msgid "copied to clipboard"
 msgstr ""