Packages
livebook
0.4.1
0.19.8
0.19.7
0.19.6
0.19.5
0.19.4
0.19.3
0.19.2
0.19.1
0.19.0
0.18.6
0.18.5
0.18.4
0.18.3
0.18.2
0.18.1
0.18.0
0.17.3
0.17.2
0.17.1
0.17.0
0.16.4
0.16.3
0.16.2
0.16.1
0.16.0
0.15.5
0.15.4
0.15.3
0.15.2
0.15.1
0.15.0
0.14.7
0.14.6
0.14.5
0.14.4
0.14.3
0.14.2
0.14.1
0.14.0
0.14.0-rc.1
0.14.0-rc.0
0.13.3
0.13.2
0.13.1
0.13.0
0.12.1
0.12.0
0.11.4
0.11.3
0.11.2
0.11.1
0.11.0
0.10.0
0.9.3
0.9.2
0.9.1
0.9.0
0.8.2
0.8.1
0.8.0
0.7.2
0.7.1
0.7.0
0.6.3
0.6.2
0.6.1
0.6.0
0.5.2
0.5.1
0.5.0
0.4.1
0.4.0
0.3.2
0.3.1
0.3.0
0.2.3
0.2.2
0.2.1
0.2.0
0.1.2
0.1.1
0.1.0
Automate code & data workflows with interactive notebooks
Current section
Files
Jump to
Current section
Files
lib/livebook_web/live/session_live/indicators_component.ex
defmodule LivebookWeb.SessionLive.IndicatorsComponent do
use LivebookWeb, :live_component
@impl true
def render(assigns) do
~H"""
<div class="flex flex-col items-center space-y-2" data-element="notebook-indicators">
<%= if @file do %>
<%= if @dirty do %>
<%= if @autosave_interval_s do %>
<span class="tooltip left" data-tooltip="Autosave pending">
<%= live_patch to: Routes.session_path(@socket, :file_settings, @session_id),
class: "icon-button icon-outlined-button border-blue-400 hover:bg-blue-50 focus:bg-blue-50",
aria_label: "autosave pending, click to open file settings" do %>
<.remix_icon icon="save-line" class="text-xl text-blue-500" />
<% end %>
</span>
<% else %>
<span class="tooltip left" data-tooltip="No autosave configured, make sure to save manually">
<%= live_patch to: Routes.session_path(@socket, :file_settings, @session_id),
class: "icon-button icon-outlined-button border-yellow-200 hover:bg-red-50 focus:bg-red-50",
aria_label: "no autosave configured, click to open file settings" do %>
<.remix_icon icon="save-line" class="text-xl text-yellow-300" />
<% end %>
</span>
<% end %>
<% else %>
<span class="tooltip left" data-tooltip="Notebook saved">
<%= live_patch to: Routes.session_path(@socket, :file_settings, @session_id),
class: "icon-button icon-outlined-button border-green-300 hover:bg-green-50 focus:bg-green-50",
aria_label: "notebook saved, click to open file settings" do %>
<.remix_icon icon="save-line" class="text-xl text-green-400" />
<% end %>
</span>
<% end %>
<% else %>
<span class="tooltip left" data-tooltip="Choose a file to save the notebook">
<%= live_patch to: Routes.session_path(@socket, :file_settings, @session_id),
class: "icon-button icon-outlined-button border-gray-200 hover:bg-gray-100 focus:bg-gray-100",
aria_label: "choose a file to save the notebook" do %>
<.remix_icon icon="save-line" class="text-xl text-gray-400" />
<% end %>
</span>
<% end %>
<%= if @runtime do %>
<.global_status
status={elem(@global_status, 0)}
cell_id={elem(@global_status, 1)} />
<% else %>
<span class="tooltip left" data-tooltip="Choose a runtime to run the notebook in">
<%= live_patch to: Routes.session_path(@socket, :runtime_settings, @session_id),
class: "icon-button icon-outlined-button border-gray-200 hover:bg-gray-100 focus:bg-gray-100",
aria_label: "choose a runtime to run the notebook in" do %>
<.remix_icon icon="loader-3-line" class="text-xl text-gray-400" />
<% end %>
</span>
<% end %>
<%# Note: this indicator is shown/hidden using CSS based on the current mode %>
<span class="tooltip left" data-tooltip="Insert mode" data-element="insert-mode-indicator">
<span class="text-sm font-medium text-gray-400 cursor-default">
ins
</span>
</span>
</div>
"""
end
defp global_status(%{status: :evaluating} = assigns) do
~H"""
<span class="tooltip left" data-tooltip="Go to evaluating cell">
<button class="border-blue-400 icon-button icon-outlined-button hover:bg-blue-50 focus:bg-blue-50"
aria-label="go to evaluating cell"
data-element="focus-cell-button"
data-target={@cell_id}>
<.remix_icon icon="loader-3-line" class="text-xl text-blue-500 animate-spin" />
</button>
</span>
"""
end
defp global_status(%{status: :evaluated} = assigns) do
~H"""
<span class="tooltip left" data-tooltip="Go to last evaluated cell">
<button class="border-green-300 icon-button icon-outlined-button hover:bg-green-50 focus:bg-green-50"
aria-label="go to last evaluated cell"
data-element="focus-cell-button"
data-target={@cell_id}>
<.remix_icon icon="loader-3-line" class="text-xl text-green-400" />
</button>
</span>
"""
end
defp global_status(%{status: :stale} = assigns) do
~H"""
<span class="tooltip left" data-tooltip="Go to first stale cell">
<button class="border-yellow-200 icon-button icon-outlined-button hover:bg-yellow-50 focus:bg-yellow-50"
aria-label="go to first stale cell"
data-element="focus-cell-button"
data-target={@cell_id}>
<.remix_icon icon="loader-3-line" class="text-xl text-yellow-300" />
</button>
</span>
"""
end
defp global_status(%{status: :fresh} = assigns) do
~H"""
<span class="tooltip left" data-tooltip="Ready to evaluate">
<div class="border-gray-200 icon-button icon-outlined-button hover:bg-gray-100 focus:bg-gray-100"
aria-label="ready to evaluate">
<.remix_icon icon="loader-3-line" class="text-xl text-gray-400" />
</div>
</span>
"""
end
end