Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add save & continue editing button #635

Open
wants to merge 3 commits into
base: develop
Choose a base branch
from
Open

Add save & continue editing button #635

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
be4e337
Add save & continue editing button
Elmseld Oct 16, 2024
657525b
credo and variable update
Elmseld Oct 18, 2024
d2d1f79
fix credo
Elmseld Oct 21, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion .credo.exs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,10 @@
parse_timeout: 5000,
color: true,
checks: %{
disabled: []
disabled: [],
enabled: [
{Credo.Check.Consistency.UnusedVariableNames, []}
]
Comment on lines -19 to +22
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We cannot do this as this will result in only adding the Credo.Check.Consistency.UnusedVariableNames check.

❯ mix credo
Checking 51 source files ...
Analysis took 0.06 seconds (0.06s to load, 0.00s running 1 check on 51 files)

Note that the log displays 1 check only.

The reason is that credo automatically adds all default checks if the enabled key is not defined. If its there, it will use the configured checks only.

Instead of:

checks: %{
  disabled: [],
  enabled: [
    {Credo.Check.Consistency.UnusedVariableNames, []}
  ]
}

we can do this

checks: [
  {Credo.Check.Consistency.UnusedVariableNames, []}
]

}
}
]
Expand Down
2 changes: 1 addition & 1 deletion demo/lib/demo/short_link.ex
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ defmodule Demo.ShortLink do
defp add_short_key(changeset) do
case get_field(changeset, :short_key) do
nil -> put_change(changeset, :short_key, generate_short_key())
_ -> changeset
_field -> changeset
end
end

Expand Down
2 changes: 1 addition & 1 deletion lib/backpex/fields/has_many.ex
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -306,7 +306,7 @@ defmodule Backpex.Fields.HasMany do
"" ->
[]

_ ->
_other ->
nil
end
end
Expand Down
6 changes: 6 additions & 0 deletions lib/backpex/html/layout.ex
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -130,6 +130,12 @@ defmodule Backpex.HTML.Layout do
:if={Phoenix.Flash.get(@flash, :info) && Phoenix.Flash.get(@flash, :info) != ""}
class="alert bg-info text-info-content my-4 text-sm"
phx-value-key="info"
x-data="{ isVisible: false }"
x-init="() => { isVisible = true; setTimeout(() => isVisible = false, 5000) }"
x-show="isVisible"
x-transition:leave="transition ease-in duration-2000"
x-transition:leave-start="opacity-100 transform scale-100"
x-transition:leave-end="opacity-0 transform scale-90"
Comment on lines +133 to +138
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can this be done with JS commands? We would like to remove Alpine in the future, so we should prepare for it now and not add more.

Copy link
Collaborator Author

@Elmseld Elmseld Oct 18, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The best I can do is either this:

    <script>
      setTimeout(() => {
        const infoFlash = document.getElementById("info-flash");

        if (infoFlash) {
          infoFlash.style.transition = "opacity 2s ease-in";
          infoFlash.style.opacity = 0;
          setTimeout(() => infoFlash.remove(), 2000);
        }
      }, 5000);
    </script>

in the html in the flash_messages function(not pretty), since there is no assets with js I can't create a hook.

Or something like this:

    <div
      :if={Phoenix.Flash.get(@flash, :info) && Phoenix.Flash.get(@flash, :info) != ""}
      class="alert bg-info text-info-content my-4 text-sm"
      id="info-flash"
      phx-click-away={JS.hide(to: "#info-flash", transition: {"transition ease-out duration-2000", "opacity-100 transform scale-100", "opacity-0 transform scale-90"})}
    >

That removes the msg when a user is using the page again. But that will remove the msg immediately on click-away which might make it disappear to fast.

>
<Backpex.HTML.CoreComponents.icon name="hero-information-circle" class="h-5 w-5" />
<span>
Expand Down
14 changes: 13 additions & 1 deletion lib/backpex/html/resource/form_component.html.heex
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,12 +48,24 @@
</button>
<% else %>
<.link navigate={@live_resource.return_to(@socket, assigns, @live_action, @item)}>
<button type="button" class="btn btn-neutral btn-outline">
<button type="button" class="btn btn-ghost">
<%= Backpex.translate("Cancel") %>
</button>
</.link>
<button
:if={@continue_label}
type="submit"
name="save-type"
value="continue"
class={["btn", if(form_errors?(@show_form_errors, @form), do: "btn-error", else: "btn-neutral btn-outline")]}
phx-disable-with={@continue_label <> "..."}
>
<%= @continue_label %>
</button>
<button
type="submit"
name="save-type"
value="save"
class={["btn", if(form_errors?(@show_form_errors, @form), do: "btn-error", else: "btn-primary")]}
phx-disable-with={@save_label <> "..."}
>
Expand Down
34 changes: 27 additions & 7 deletions lib/backpex/live_components/form_component.ex
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ defmodule Backpex.FormComponent do
socket
|> assign(assigns)
|> assign_new(:action_type, fn -> nil end)
|> assign_new(:continue_label, fn -> nil end)
|> assign_new(:show_form_errors, fn -> false end)
|> update_assigns()
|> assign_form()
Expand Down Expand Up @@ -54,6 +55,7 @@ defmodule Backpex.FormComponent do
defp apply_action(socket, action) when action in [:edit, :new] do
socket
|> assign(:save_label, Backpex.translate("Save"))
|> assign(:continue_label, Backpex.translate("Save & Continue editing"))
end

defp apply_action(socket, :resource_action) do
Expand Down Expand Up @@ -174,15 +176,15 @@ defmodule Backpex.FormComponent do
handle_item_action(socket, key, change)
end

def handle_event("save", %{"change" => change}, socket) do
def handle_event("save", %{"change" => change, "save-type" => save_type}, socket) do
%{assigns: %{live_action: live_action, fields: fields} = assigns} = socket

change =
change
|> put_upload_change(socket, :insert)
|> drop_readonly_changes(fields, assigns)

handle_save(socket, live_action, change)
handle_save(socket, live_action, change, save_type)
end

def handle_event("save", %{"action-key" => key}, socket) do
Expand All @@ -205,7 +207,9 @@ defmodule Backpex.FormComponent do
{:noreply, socket}
end

defp handle_save(socket, :new, params) do
defp handle_save(socket, key, params, save_type \\ "save")

defp handle_save(socket, :new, params, save_type) do
%{
assigns:
%{
Expand All @@ -231,7 +235,7 @@ defmodule Backpex.FormComponent do

case Resource.insert(item, params, repo, fields, changeset_function, opts) do
{:ok, item} ->
return_to = live_resource.return_to(socket, assigns, :new, item)
return_to = return_to_path(save_type, live_resource, socket, assigns, item, :new)

socket =
socket
Expand All @@ -256,7 +260,7 @@ defmodule Backpex.FormComponent do
end
end

defp handle_save(socket, :edit, params) do
defp handle_save(socket, :edit, params, save_type) do
%{
assigns:
%{
Expand All @@ -283,7 +287,7 @@ defmodule Backpex.FormComponent do

case Resource.update(item, params, repo, fields, changeset_function, opts) do
{:ok, item} ->
return_to = live_resource.return_to(socket, assigns, :edit, item)
return_to = return_to_path(save_type, live_resource, socket, assigns, item, :edit)
info_msg = Backpex.translate({"%{resource} has been edited successfully.", %{resource: singular_name}})

socket =
Expand All @@ -309,7 +313,7 @@ defmodule Backpex.FormComponent do
end
end

defp handle_save(socket, :resource_action, params) do
defp handle_save(socket, :resource_action, params, _save_type) do
%{
assigns:
%{
Expand Down Expand Up @@ -422,6 +426,22 @@ defmodule Backpex.FormComponent do
defp flash_key(:ok), do: :info
defp flash_key(:error), do: :error

defp return_to_path("continue", _live_resource, _socket, %{current_url: url}, item, :new) do
url
|> URI.parse()
|> Map.get(:path)
|> Path.dirname()
|> Kernel.<>("/#{item.id}/edit")
end

defp return_to_path("continue", _live_resource, _socket, %{current_url: url}, _item, :edit) do
URI.parse(url).path
end

defp return_to_path(_save_type, live_resource, socket, assigns, item, type) do
live_resource.return_to(socket, assigns, type, item)
end

defp put_upload_change(change, socket, action) do
Enum.reduce(socket.assigns.fields, change, fn
{_name, %{upload_key: upload_key} = field_options} = _field, acc ->
Expand Down
2 changes: 1 addition & 1 deletion lib/backpex/resource.ex
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -567,7 +567,7 @@ defmodule Backpex.Resource do
%{custom_alias: custom_alias} ->
association |> Map.from_struct() |> Map.put(:custom_alias, custom_alias)

_ ->
_other ->
association |> Map.from_struct()
end
end)
Expand Down