Make image a block item instead of a button in the Markdown editor (#1439)

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>
This commit is contained in:
Adarsh Menon 2022-12-29 22:32:52 +01:00 committed by GitHub
parent a9583fde92
commit 1a895e4b29
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 43 additions and 23 deletions

View file

@ -352,8 +352,8 @@ defmodule LivebookWeb.SessionLive do
id="cell-upload"
session={@session}
return_to={@self_path}
cell={@cell}
uploads={@uploads}
cell_upload_metadata={@cell_upload_metadata}
/>
</.modal>
<% end %>
@ -890,11 +890,22 @@ defmodule LivebookWeb.SessionLive do
@impl true
def handle_params(%{"cell_id" => cell_id}, _url, socket)
when socket.assigns.live_action in [:cell_settings, :cell_upload] do
when socket.assigns.live_action == :cell_settings do
{:ok, cell, _} = Notebook.fetch_cell_and_section(socket.private.data.notebook, cell_id)
{:noreply, assign(socket, cell: cell)}
end
def handle_params(%{"section_id" => section_id, "cell_id" => cell_id}, _url, socket)
when socket.assigns.live_action == :cell_upload do
cell_id =
case cell_id do
"" -> nil
id -> id
end
{:noreply, assign(socket, cell_upload_metadata: %{section_id: section_id, cell_id: cell_id})}
end
def handle_params(%{"section_id" => section_id}, _url, socket)
when socket.assigns.live_action == :delete_section do
{:ok, section} = Notebook.fetch_section(socket.private.data.notebook, section_id)
@ -1425,6 +1436,17 @@ defmodule LivebookWeb.SessionLive do
{:noreply, socket}
end
def handle_info({:cell_upload_complete, metadata, url}, socket) do
params = %{
"type" => "image",
"section_id" => metadata.section_id,
"cell_id" => metadata.cell_id,
"url" => url
}
handle_event("insert_cell_below", params, socket)
end
def handle_info({:set_secret, secret}, socket) do
livebook_secrets = Map.put(socket.assigns.livebook_secrets, secret.name, secret.value)
@ -1795,6 +1817,12 @@ defmodule LivebookWeb.SessionLive do
{:markdown, %{source: source}}
end
defp cell_type_and_attrs_from_params(%{"type" => "image", "url" => url}) do
source = "![](#{url})"
{:markdown, %{source: source}}
end
defp section_with_next_index(notebook, section_id, cell_id)
defp section_with_next_index(notebook, section_id, nil) do

View file

@ -28,7 +28,6 @@ defmodule LivebookWeb.SessionLive.CellComponent do
<.cell_actions>
<:secondary>
<.enable_insert_mode_button />
<.insert_image_button cell_id={@cell_view.id} session_id={@session_id} socket={@socket} />
<.cell_link_button cell_id={@cell_view.id} />
<.move_cell_up_button cell_id={@cell_view.id} />
<.move_cell_down_button cell_id={@cell_view.id} />
@ -381,19 +380,6 @@ defmodule LivebookWeb.SessionLive.CellComponent do
"""
end
defp insert_image_button(assigns) do
~H"""
<span class="tooltip top" data-tooltip="Insert image" data-el-insert-image-button>
<%= live_patch to: Routes.session_path(@socket, :cell_upload, @session_id, @cell_id),
class: "icon-button",
aria_label: "insert image",
role: "button" do %>
<.remix_icon icon="image-add-line" class="text-xl" />
<% end %>
</span>
"""
end
defp toggle_source_button(assigns) do
~H"""
<span class="tooltip top" data-tooltip="Toggle source" data-el-toggle-source-button>

View file

@ -92,12 +92,9 @@ defmodule LivebookWeb.SessionLive.CellUploadComponent do
end)
|> case do
[{:ok, filename}] ->
src_path = "images/#{URI.encode(filename, &URI.char_unreserved?/1)}"
{:noreply,
socket
|> push_patch(to: socket.assigns.return_to)
|> push_event("cell_upload", %{cell_id: socket.assigns.cell.id, url: src_path})}
url = "images/#{URI.encode(filename, &URI.char_unreserved?/1)}"
send(self(), {:cell_upload_complete, socket.assigns.cell_upload_metadata, url})
{:noreply, push_patch(socket, to: socket.assigns.return_to)}
[{:error, message}] ->
{:noreply, assign(socket, error_message: message)}

View file

@ -59,6 +59,13 @@ defmodule LivebookWeb.SessionLive.InsertButtonsComponent do
<.remix_icon icon="organization-chart" />
<span class="font-medium">Diagram</span>
</button>
<%= live_patch to: Routes.session_path(@socket, :cell_upload, @session_id, section_id: @section_id, cell_id: @cell_id),
class: "menu-item text-gray-500",
aria_label: "insert image",
role: "menuitem" do %>
<.remix_icon icon="image-add-line" />
<span class="font-medium">Image</span>
<% end %>
</:content>
</.menu>
<%= cond do %>

View file

@ -133,6 +133,7 @@ defmodule LivebookWeb.SessionLive.SectionComponent do
runtime={@runtime}
section_id={@section_view.id}
cell_id={nil}
session_id={@session_id}
/>
<%= for {cell_view, index} <- Enum.with_index(@section_view.cell_views) do %>
<.live_component
@ -152,6 +153,7 @@ defmodule LivebookWeb.SessionLive.SectionComponent do
runtime={@runtime}
section_id={@section_view.id}
cell_id={cell_view.id}
session_id={@session_id}
/>
<% end %>
</div>

View file

@ -82,7 +82,7 @@ defmodule LivebookWeb.Router do
get "/sessions/:id/export/download/:format", SessionController, :download_source
live "/sessions/:id/export/:tab", SessionLive, :export
live "/sessions/:id/cell-settings/:cell_id", SessionLive, :cell_settings
live "/sessions/:id/cell-upload/:cell_id", SessionLive, :cell_upload
live "/sessions/:id/cell-upload", SessionLive, :cell_upload
live "/sessions/:id/delete-section/:section_id", SessionLive, :delete_section
live "/sessions/:id/package-search", SessionLive, :package_search
get "/sessions/:id/images/:image", SessionController, :show_image