Skip to content

Commit

Permalink
Merge pull request #1117 from OpenFn/cp-rebased
Browse files Browse the repository at this point in the history 
Cp rebased
  • Loading branch information
@taylordowns2000
taylordowns2000 authored Sep 15, 2023
2 parents 1e290d6 + 750bb76 commit 1da1155
Show file tree
Hide file tree
Showing 13 changed files with 362 additions and 207 deletions.
3 changes: 3 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,9 @@ and this project adheres to

### Changed

- Enhanced the job editor/inspector interface
[#1025](https://github.com/OpenFn/Lightning/issues/1025)

### Fixed

- Finished run never appears in inspector when it fails
Expand Down
46 changes: 46 additions & 0 deletions assets/css/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -150,3 +150,49 @@ div[id^='tippy-'] {
opacity: 0;
}
}

/* Collapsible panels */
.collapsible-panel.collapsed {
flex: 0 0 0% !important;
padding-left: 0.25rem;
padding-right: 0.25rem;
}

.collapsible-panel.collapsed .panel-content {
display: none !important;
}

.collapsible-panel.collapsed .panel-expand-icon {
display: block !important;

}

.collapsible-panel.collapsed .panel-expand-icon {
display: block !important;

}

#output-logs.collapsed .close-button {
display: block !important;
margin-bottom: 32px;

}

.collapsible-panel.collapsed .panel-collapse-icon{
display: none !important;

}

.collapsible-panel.collapsed .panel-header {
flex-direction: column-reverse !important;
gap: 1rem;
height: 100%;
justify-content: flex-end;
white-space: nowrap;
width: 42px !important;

}

.collapsible-panel.collapsed .panel-header-title {
transform: rotate(-90deg) !important;
}
1 change: 1 addition & 0 deletions assets/js/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,7 @@ window.addEventListener('phx:page-loading-stop', () => {
topbar.hide();
});


// connect if there are any LiveViews on the page
liveSocket.connect();
// expose liveSocket on window for web console debug logs and latency simulation:
Expand Down
22 changes: 21 additions & 1 deletion assets/js/hooks/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,26 @@ export const AssocListChange = {
},
} as PhoenixHook<{}, {}, HTMLSelectElement>;


export const collapsiblePanel = {
mounted() {
this.el.addEventListener('collapse', event => {
const target = event.target;
const collection = document.getElementsByClassName("collapsed");
if(collection.length < 2){
target.classList.toggle("collapsed");
}
document.dispatchEvent(new Event('update-layout'));
});

this.el.addEventListener('expand-panel', event => {
const target = event.target;
target.classList.toggle("collapsed");
document.dispatchEvent(new Event('update-layout'));
});
},
} as PhoenixHook;

function createKeyCombinationHook(
keyCheck: (e: KeyboardEvent) => boolean
): PhoenixHook {
Expand Down Expand Up @@ -101,4 +121,4 @@ export const CheckboxIndeterminate = {
updated() {
this.el.indeterminate = this.el.classList.contains('indeterminate');
},
} as PhoenixHook;
} as PhoenixHook;
4 changes: 2 additions & 2 deletions lib/lightning_web/components/layouts/live.html.heex
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,13 +36,13 @@
<LightningWeb.Components.Common.version_chip />
</div>
</nav>
<main class="flex-auto">
<div class="flex-auto">
<Common.flash flash={@flash} kind={:info} />
<Common.flash flash={@flash} kind={:error} />
<.live_nav_block flash={@flash}>
<%= @inner_content %>
</.live_nav_block>
<.live_component module={LightningWeb.ModalPortal} id="modal-portal" />
</main>
</div>
</div>
</main>
13 changes: 8 additions & 5 deletions lib/lightning_web/components/new_inputs.ex
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,8 @@ defmodule LightningWeb.Components.NewInputs do
~w(accept autocomplete capture cols disabled form list max maxlength min minlength
multiple pattern placeholder readonly required rows size step)

attr :class, :string, default: nil

slot :inner_block

def input(%{field: %Phoenix.HTML.FormField{} = field} = assigns) do
Expand Down Expand Up @@ -143,7 +145,7 @@ defmodule LightningWeb.Components.NewInputs do
id={@id}
name={@name}
class={[
"mt-2 block w-full rounded-md border border-secondary-300 bg-white",
"block w-full rounded-md border border-secondary-300 bg-white",
"text-sm shadow-sm",
"focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50",
"disabled:cursor-not-allowed"
Expand All @@ -161,7 +163,7 @@ defmodule LightningWeb.Components.NewInputs do

def input(%{type: "textarea"} = assigns) do
~H"""
<div phx-feedback-for={@name}>
<div phx-feedback-for={@name} class={@class}>
<.label for={@id}><%= @label %></.label>
<textarea
id={@id}
Expand All @@ -170,9 +172,10 @@ defmodule LightningWeb.Components.NewInputs do
"rounded-md shadow-sm font-mono proportional-nums text-sm",
"mt-2 block w-full focus:ring-0",
"text-slate-200 bg-slate-700 sm:text-sm sm:leading-6",
"min-h-[6rem] phx-no-feedback:border-slate-300 phx-no-feedback:focus:border-slate-400",
"phx-no-feedback:border-slate-300 phx-no-feedback:focus:border-slate-400 overflow-y-auto",
@errors == [] && "border-slate-300 focus:border-slate-400",
@errors != [] && "border-danger-400 focus:border-danger-400"
@errors != [] && "border-danger-400 focus:border-danger-400",
@class
]}
{@rest}
><%= Phoenix.HTML.Form.normalize_value("textarea", @value) %></textarea>
Expand Down Expand Up @@ -225,7 +228,7 @@ defmodule LightningWeb.Components.NewInputs do

def error(assigns) do
~H"""
<p class="mt-3 inline-flex items-center gap-x-1.5 text-xs text-danger-600 phx-no-feedback:hidden">
<p class="inline-flex items-center gap-x-1.5 text-xs text-danger-600 phx-no-feedback:hidden">
<.icon name="hero-exclamation-circle" class="h-4 w-4" />
<%= render_slot(@inner_block) %>
</p>
Expand Down
170 changes: 99 additions & 71 deletions lib/lightning_web/live/run_live/components.ex
View file
Original file line number Diff line number Diff line change
Expand Up @@ -189,78 +189,96 @@ defmodule LightningWeb.RunLive.Components do
# --------------- Run Details ---------------
attr :run, :any, required: true
attr :show_input_dataclip, :boolean
attr :class, :string, default: nil

@spec run_viewer(map) :: Phoenix.LiveView.Rendered.t()
def run_viewer(assigns) do
assigns = assigns |> assign_new(:show_input_dataclip, fn -> false end)

~H"""
<.run_details run={@run} />
<.toggle_bar class="mt-4 items-end" phx-mounted={show_section("log")}>
<%= if @show_input_dataclip do %>
<.toggle_item data-section="input" phx-click={switch_section("input")}>
Input
</.toggle_item>
<% end %>
<.toggle_item data-section="output" phx-click={switch_section("output")}>
Output
</.toggle_item>
<.toggle_item
data-section="log"
phx-click={switch_section("log")}
active="true"
>
Log
</.toggle_item>
</.toggle_bar>
<div class="mt-4">
<%= if @show_input_dataclip do %>
<div id="input_section" style="display: none;" class="@container">
<.dataclip_view dataclip={@run.input_dataclip} />
</div>
<% end %>
<div id="log_section" style="display: none;" class="@container">
<.run_log_viewer run={@run} />
<div class="flex flex-col h-full ">
<div class="flex-0">
<.run_details run={@run} />
<.toggle_bar class="mt-4 items-end" phx-mounted={show_section("log")}>
<%= if @show_input_dataclip do %>
<.toggle_item data-section="input" phx-click={switch_section("input")}>
Input
</.toggle_item>
<% end %>
<.toggle_item data-section="output" phx-click={switch_section("output")}>
Output
</.toggle_item>
<.toggle_item
data-section="log"
phx-click={switch_section("log")}
active="true"
>
Log
</.toggle_item>
</.toggle_bar>
</div>
<div id="output_section" style="display: none;" class="@container">
<%= cond do %>
<% is_nil(@run.exit_code) -> %>
<.dataclip_view
dataclip={nil}
no_dataclip_message={
%{
label: "This run has not yet finished.",
description:
"There is no output. See the logs for more information"
<div class="mt-4 flex-1 overflow-y-auto">
<%= if @show_input_dataclip do %>
<div
id="input_section"
style="display: none;"
class="@container overflow-y-auto h-full"
>
<.dataclip_view dataclip={@run.input_dataclip} />
</div>
<% end %>
<div
id="log_section"
style="display: none;"
class="@container overflow-y-auto h-full rounded-md"
>
<.run_log_viewer run={@run} />
</div>
<div
id="output_section"
style="display: none;"
class="@container h-full overflow-y-auto"
>
<%= cond do %>
<% is_nil(@run.exit_code) -> %>
<.dataclip_view
dataclip={nil}
no_dataclip_message={
%{
label: "This run has not yet finished.",
description:
"There is no output. See the logs for more information"
}
}
}
/>
<% @run.exit_code > 0 -> %>
<.dataclip_view
dataclip={nil}
no_dataclip_message={
%{
label: "This run failed",
description:
"There is no output. See the logs for more information"
/>
<% @run.exit_code > 0 -> %>
<.dataclip_view
dataclip={nil}
no_dataclip_message={
%{
label: "This run failed",
description:
"There is no output. See the logs for more information"
}
}
}
/>
<% is_nil(@run.output_dataclip_id) -> %>
<.dataclip_view
dataclip={nil}
no_dataclip_message={
%{
label: "There is no output for this run",
description:
"Check your job expression to ensure that the final operation returns something."
/>
<% is_nil(@run.output_dataclip_id) -> %>
<.dataclip_view
dataclip={nil}
no_dataclip_message={
%{
label: "There is no output for this run",
description:
"Check your job expression to ensure that the final operation returns something."
}
}
}
/>
<% true -> %>
<.dataclip_view dataclip={@run.output_dataclip} />
<% end %>
/>
<% true -> %>
<.dataclip_view dataclip={@run.output_dataclip} />
<% end %>
</div>
</div>
</div>
"""
Expand Down Expand Up @@ -311,23 +329,29 @@ defmodule LightningWeb.RunLive.Components do

~H"""
<div class="flex flex-col gap-2">
<div class="flex gap-4 flex-row text-sm" id={"job-#{@run.id}"}>
<div class="flex gap-4 flex-row text-xs lg:text-sm" id={"job-#{@run.id}"}>
<div class="basis-1/2 font-semibold text-secondary-700">Job</div>
<div class="basis-1/2 text-right"><%= @run_job %></div>
</div>
<div class="flex gap-4 flex-row text-sm" id={"job-credential-#{@run.id}"}>
<div
class="flex gap-4 flex-row text-xs lg:text-sm"
id={"job-credential-#{@run.id}"}
>
<div class="basis-1/2 font-semibold text-secondary-700">Credential</div>
<div class="basis-1/2 text-right"><%= @run_credential || "n/a" %></div>
</div>
<div class="flex gap-4 flex-row text-sm" id={"finished-at-#{@run.id}"}>
<div
class="flex gap-4 flex-row text-xs lg:text-sm"
id={"finished-at-#{@run.id}"}
>
<div class="basis-1/2 font-semibold text-secondary-700">Finished</div>
<div class="basis-1/2 text-right"><%= @run_finished_at %></div>
</div>
<div class="flex flex-row text-sm" id={"ran-for-#{@run.id}"}>
<div class="basis-1/2 font-semibold text-secondary-700">Ran for</div>
<div class="flex flex-row text-xs lg:text-sm" id={"ran-for-#{@run.id}"}>
<div class="lg:basis-1/2 font-semibold text-secondary-700">Ran for</div>
<div class="basis-1/2 text-right"><%= @ran_for %></div>
</div>
<div class="flex flex-row text-sm" id={"exit-code-#{@run.id}"}>
<div class="flex flex-row text-xs lg:text-sm" id={"exit-code-#{@run.id}"}>
<div class="basis-1/2 font-semibold text-secondary-700">Exit Code</div>
<div class="basis-1/2 text-right">
<%= case @run.exit_code do %>
Expand All @@ -345,16 +369,20 @@ defmodule LightningWeb.RunLive.Components do
end

attr :log, :list, required: true
attr :class, :string, default: nil

def log_view(%{log: log} = assigns) do
assigns = assigns |> assign(log: log |> Enum.with_index(1))

~H"""
<style>
div.line-num::before { content: attr(data-line-number); padding-left: 0.1em; max-width: min-content; }
div.line-num::before { content: attr(data-line-number); padding-left: 0.1em; max-width: min-content;}
</style>
<div class="rounded-md text-slate-200 bg-slate-700 border-slate-300 shadow-sm
font-mono proportional-nums w-full text-sm">
<div class={[
"rounded-md text-slate-200 bg-slate-700 border-slate-300 shadow-sm
font-mono proportional-nums w-full text-sm overflow-y-auto min-h-full",
@class
]}>
<%= for { line, i } <- @log do %>
<.log_line num={i} line={line} />
<% end %>
Expand Down
Loading

0 comments on commit 1da1155

Please sign in to comment.