Skip to content

Commit

Permalink
small fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
leandrocp committed Jan 10, 2024
1 parent 2a92232 commit 8b4a9a7
Showing 1 changed file with 70 additions and 69 deletions.
139 changes: 70 additions & 69 deletions lib/beacon/live_admin/live/page_editor_live/form_component.ex
Original file line number Diff line number Diff line change
Expand Up @@ -87,11 +87,11 @@ defmodule Beacon.LiveAdmin.PageEditorLive.FormComponent do
end
end

def handle_event("enable_visual_mode", _args, socket) do
def handle_event("enable_visual_mode", _params, socket) do
{:noreply, assign(socket, visual_mode: true)}
end

def handle_event("disable_visual_mode", _args, socket) do
def handle_event("disable_visual_mode", _params, socket) do
{:noreply, assign(socket, visual_mode: false)}
end

Expand Down Expand Up @@ -133,13 +133,54 @@ defmodule Beacon.LiveAdmin.PageEditorLive.FormComponent do
assign(socket, :form, to_form(changeset))
end

defp assign_extra_fields(socket, changeset) do
params = Ecto.Changeset.get_field(changeset, :extra)

extra_fields =
Content.page_extra_fields(
socket.assigns.site,
socket.assigns.form,
params,
changeset.errors
)

assign(socket, :extra_fields, extra_fields)
end

defp layouts_to_options(layouts) do
Enum.map(layouts, &{&1.title, &1.id})
end

defp template_format_options(site) do
template_formats = Config.template_formats(site)

Keyword.new(template_formats, fn {identifier, description} ->
{String.to_atom(description), identifier}
end)
end

defp language("heex" = _format), do: "html"
defp language(:heex), do: "html"
defp language(format), do: to_string(format)

defp extra_page_fields(site), do: Config.extra_page_fields(site)

defp extra_page_field(site, extra_fields, mod) do
env = __ENV__
name = Content.page_field_name(site, mod)
html = Content.render_page_field(site, mod, extra_fields[name], env)
{:safe, html}
end

defp compile_stylesheet(%{site: site, template: template}) when is_binary(template), do: Beacon.LiveAdmin.Layouts.page_stylesheet(site, template)
defp compile_stylesheet(%{site: _, template: _}), do: ""


@impl true
def render(assigns) do
~H"""
<div>
<style>
<%= Beacon.LiveAdmin.Layouts.page_stylesheet(@page.site, @page.template) %>
</style>
<style><%= compile_stylesheet(@page) %></style>
<Beacon.LiveAdmin.AdminComponents.page_header socket={@socket} flash={@flash} page={@page} live_action={@live_action} />
Expand Down Expand Up @@ -179,73 +220,33 @@ defmodule Beacon.LiveAdmin.PageEditorLive.FormComponent do
</div>
</.modal>
<%= if @visual_mode do %>
<.svelte name="components/UiBuilder" class="relative overflow-x-hidden" props={%{components: @components, page: @builder_page}} socket={@socket} />
<% else %>
<div class="grid items-start lg:h-[calc(100vh_-_144px)] grid-cols-1 mx-auto mt-4 gap-x-8 gap-y-8 lg:mx-0 lg:max-w-none lg:grid-cols-3">
<div class="p-4 bg-white col-span-full lg:col-span-1 rounded-[1.25rem] lg:rounded-t-[1.25rem] lg:rounded-b-none lg:h-full">
<.form :let={f} for={@form} id="page-form" class="space-y-8" phx-target={@myself} phx-change="validate" phx-submit="save">
<legend class="text-sm font-bold tracking-widest text-[#445668] uppercase">Page settings</legend>
<.input field={f[:path]} type="text" label="Path" class="!text-red-500" />
<.input field={f[:title]} type="text" label="Title" />
<.input field={f[:description]} type="textarea" label="Description" />
<.input field={f[:layout_id]} type="select" options={layouts_to_options(@layouts)} label="Layout" />
<.input field={f[:format]} type="select" label="Format" options={template_format_options(@site)} />
<input type="hidden" name="page[template]" id="page-form_template" value={@changed_template} />
<%= for mod <- extra_page_fields(@site) do %>
<%= extra_page_field(@site, @extra_fields, mod) %>
<% end %>
</.form>
</div>
<div class="col-span-full lg:col-span-2">
<%= template_error(@form[:template]) %>
<div class="py-6 w-full rounded-[1.25rem] bg-[#0D1829] [&_.monaco-editor-background]:!bg-[#0D1829] [&_.margin]:!bg-[#0D1829]">
<LiveMonacoEditor.code_editor path="template" class="col-span-full lg:col-span-2" value={@template} opts={Map.merge(LiveMonacoEditor.default_opts(), %{"language" => @language})} />
</div>
<.svelte :if={@visual_mode} name="components/UiBuilder" class="relative overflow-x-hidden" props={%{components: @components, page: @builder_page}} socket={@socket} />
<div :if={!@visual_mode} class="grid items-start lg:h-[calc(100vh_-_144px)] grid-cols-1 mx-auto mt-4 gap-x-8 gap-y-8 lg:mx-0 lg:max-w-none lg:grid-cols-3">
<div class="p-4 bg-white col-span-full lg:col-span-1 rounded-[1.25rem] lg:rounded-t-[1.25rem] lg:rounded-b-none lg:h-full">
<.form :let={f} for={@form} id="page-form" class="space-y-8" phx-target={@myself} phx-change="validate" phx-submit="save">
<legend class="text-sm font-bold tracking-widest text-[#445668] uppercase">Page settings</legend>
<.input field={f[:path]} type="text" label="Path" class="!text-red-500" />
<.input field={f[:title]} type="text" label="Title" />
<.input field={f[:description]} type="textarea" label="Description" />
<.input field={f[:layout_id]} type="select" options={layouts_to_options(@layouts)} label="Layout" />
<.input field={f[:format]} type="select" label="Format" options={template_format_options(@site)} />
<input type="hidden" name="page[template]" id="page-form_template" value={@changed_template} />
<%= for mod <- extra_page_fields(@site) do %>
<%= extra_page_field(@site, @extra_fields, mod) %>
<% end %>
</.form>
</div>
<div class="col-span-full lg:col-span-2">
<%= template_error(@form[:template]) %>
<div class="py-6 w-full rounded-[1.25rem] bg-[#0D1829] [&_.monaco-editor-background]:!bg-[#0D1829] [&_.margin]:!bg-[#0D1829]">
<LiveMonacoEditor.code_editor path="template" class="col-span-full lg:col-span-2" value={@template} opts={Map.merge(LiveMonacoEditor.default_opts(), %{"language" => @language})} />
</div>
</div>
<% end %>
</div>
</div>
"""
end

defp assign_extra_fields(socket, changeset) do
params = Ecto.Changeset.get_field(changeset, :extra)

extra_fields =
Content.page_extra_fields(
socket.assigns.site,
socket.assigns.form,
params,
changeset.errors
)

assign(socket, :extra_fields, extra_fields)
end

defp layouts_to_options(layouts) do
Enum.map(layouts, &{&1.title, &1.id})
end

defp template_format_options(site) do
template_formats = Config.template_formats(site)

Keyword.new(template_formats, fn {identifier, description} ->
{String.to_atom(description), identifier}
end)
end

defp language("heex" = _format), do: "html"
defp language(:heex), do: "html"
defp language(format), do: to_string(format)

defp extra_page_fields(site), do: Config.extra_page_fields(site)

defp extra_page_field(site, extra_fields, mod) do
env = __ENV__
name = Content.page_field_name(site, mod)
html = Content.render_page_field(site, mod, extra_fields[name], env)
{:safe, html}
end
end

0 comments on commit 8b4a9a7

Please sign in to comment.