From 4e49b6e643d51fbc02c839f066b79307634cd57f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jonatan=20K=C5=82osko?= <jonatanklosko@gmail.com>
Date: Tue, 19 Apr 2022 16:51:46 +0200
Subject: [PATCH] Add insert button for diagrams (#1134)

---
 lib/livebook_web/live/session_live.ex            | 16 ++++++++++++++++
 .../session_live/insert_buttons_component.ex     | 10 ++++++++++
 2 files changed, 26 insertions(+)

diff --git a/lib/livebook_web/live/session_live.ex b/lib/livebook_web/live/session_live.ex
index c00c72c44f8..a3c32edb176 100644
--- a/lib/livebook_web/live/session_live.ex
+++ b/lib/livebook_web/live/session_live.ex
@@ -1281,6 +1281,22 @@ defmodule LivebookWeb.SessionLive do
     {:smart, %{kind: kind}}
   end
 
+  defp cell_type_and_attrs_from_params(%{"type" => "diagram"}) do
+    source = """
+    <!-- Learn more at https://mermaid-js.github.io/mermaid -->
+
+    ```mermaid
+    graph TD;
+      A-->B;
+      A-->C;
+      B-->D;
+      C-->D;
+    ```\
+    """
+
+    {:markdown, %{source: source}}
+  end
+
   defp section_with_next_index(notebook, section_id, cell_id)
 
   defp section_with_next_index(notebook, section_id, nil) do
diff --git a/lib/livebook_web/live/session_live/insert_buttons_component.ex b/lib/livebook_web/live/session_live/insert_buttons_component.ex
index bbea5767abb..28342b20937 100644
--- a/lib/livebook_web/live/session_live/insert_buttons_component.ex
+++ b/lib/livebook_web/live/session_live/insert_buttons_component.ex
@@ -36,6 +36,16 @@ defmodule LivebookWeb.SessionLive.InsertButtonsComponent do
               <.remix_icon icon="h-2" />
               <span class="font-medium">Section</span>
             </button>
+            <div class="my-2 border-b border-gray-200"></div>
+            <button class="menu-item text-gray-500"
+              role="menuitem"
+              phx-click="insert_cell_below"
+              phx-value-type="diagram"
+              phx-value-section_id={@section_id}
+              phx-value-cell_id={@cell_id}>
+            <.remix_icon icon="organization-chart" />
+            <span class="font-medium">Diagram</span>
+          </button>
           </:content>
         </.menu>
         <%= cond do %>