Merge pull request #489 from eyra/fix-share

Fixed share view on projects overview page

core/frameworks/fabric.ex

@@ -87,6 +87,8 @@ defmodule Fabric do
     %Fabric.LiveComponent.Model{ref: child_ref, params: params}
   end
 
+  # Install
+
   def install_children(%Phoenix.LiveView.Socket{assigns: %{fabric: fabric}} = socket, children)
       when is_list(children) do
     Phoenix.Component.assign(socket, fabric: install_children(fabric, children))
@@ -100,6 +102,8 @@ defmodule Fabric do
     %Fabric.Model{fabric | children: children}
   end
 
+  # CRUD
+
   def get_child(%Phoenix.LiveView.Socket{assigns: %{fabric: fabric}}, child_id) do
     get_child(fabric, child_id)
   end
@@ -163,6 +167,11 @@ defmodule Fabric do
     Phoenix.Component.assign(assigns, fabric: remove_child(fabric, child_id))
   end
 
+  def show_popup(context, child_id) when is_atom(child_id) do
+    child = get_child(context, child_id)
+    show_popup(context, child)
+  end
+
   def show_popup(
         %Phoenix.LiveView.Socket{assigns: assigns} = socket,
         %Fabric.LiveComponent.Model{} = child

core/frameworks/pixel/components/share_view.ex

@@ -1,5 +1,6 @@
 defmodule Frameworks.Pixel.ShareView do
-  use CoreWeb, :live_component
+  use CoreWeb, :live_component_fabric
+  use Fabric.LiveComponent
 
   alias CoreWeb.UI.UserListItem
 
@@ -55,7 +56,7 @@ defmodule Frameworks.Pixel.ShareView do
         socket
         |> assign(shared_users: [user] ++ shared_users)
         |> filter_users()
-        |> update_parent(%{add: user, content_id: content_id})
+        |> send_event(:parent, "add_user", %{user: user, content_id: content_id})
       else
         socket
       end
@@ -74,7 +75,7 @@ defmodule Frameworks.Pixel.ShareView do
         socket
         |> assign(shared_users: shared_users |> List.delete(user))
         |> filter_users()
-        |> update_parent(%{remove: user, content_id: content_id})
+        |> send_event(:parent, "remove_user", %{user: user, content_id: content_id})
       else
         socket
       end
@@ -83,27 +84,14 @@ defmodule Frameworks.Pixel.ShareView do
 
   @impl true
   def handle_event("close", _unsigned_params, socket) do
-    {:noreply, update_parent(socket, :close)}
+    {:noreply, socket |> send_event(:parent, "finish")}
   end
 
-  defp update_parent(socket, message) do
-    send(self(), %{module: __MODULE__, action: message})
-    socket
-  end
-
-  # data(filtered_users, :list)
-  # data(close_button, :map)
-
-  attr(:content_id, :integer, required: true)
-  attr(:content_name, :string, required: true)
-  attr(:group_name, :string, required: true)
-  attr(:users, :list, required: true)
-  attr(:shared_users, :list)
-
   @impl true
   def render(assigns) do
     ~H"""
     <div class="">
+      <Frameworks.Pixel.Panel.flat>
       <div class="flex flex-row">
         <div class="flex-grow">
           <div class="text-title5 font-title5 sm:text-title3 sm:font-title3">
@@ -153,6 +141,7 @@ defmodule Frameworks.Pixel.ShareView do
           <% end %>
         </div>
       </div>
+      </Frameworks.Pixel.Panel.flat>
     </div>
     """
   end

core/priv/gettext/en/LC_MESSAGES/eyra-project.po

@@ -57,11 +57,11 @@ msgstr "Projects"
 
 #, elixir-autogen, elixir-format
 msgid "share.dialog.content"
-msgstr ""
+msgstr "project"
 
 #, elixir-autogen, elixir-format
 msgid "share.dialog.group"
-msgstr ""
+msgstr "researchers"
 
 #, elixir-autogen, elixir-format
 msgid "config.title"

core/priv/gettext/nl/LC_MESSAGES/eyra-project.po

@@ -57,11 +57,11 @@ msgstr "Projecten"
 
 #, elixir-autogen, elixir-format
 msgid "share.dialog.content"
-msgstr ""
+msgstr "project"
 
 #, elixir-autogen, elixir-format
 msgid "share.dialog.group"
-msgstr ""
+msgstr "onderzoekers"
 
 #, elixir-autogen, elixir-format
 msgid "config.title"

core/systems/project/form.ex

@@ -1,5 +1,6 @@
 defmodule Systems.Project.Form do
-  use CoreWeb.LiveForm
+  use CoreWeb.LiveForm, :fabric
+  use Fabric.LiveComponent
 
   import CoreWeb.UI.Dialog
 
@@ -10,7 +11,7 @@ defmodule Systems.Project.Form do
   # Handle initial update
   @impl true
   def update(
-        %{id: id, project: project, target: target},
+        %{id: id, project: project},
         socket
       ) do
     changeset = Project.Model.changeset(project, %{})
@@ -21,7 +22,6 @@ defmodule Systems.Project.Form do
       |> assign(
         id: id,
         project: project,
-        target: target,
         changeset: changeset,
         show_errors: false
       )
@@ -96,8 +96,7 @@ defmodule Systems.Project.Form do
   end
 
   defp finish(socket) do
-    send(self(), %{module: __MODULE__, action: :close})
-    socket
+    socket |> send_event(:parent, "finish")
   end
 
   @impl true

core/systems/project/overview_page.ex

@@ -1,5 +1,6 @@
 defmodule Systems.Project.OverviewPage do
-  use CoreWeb, :live_view
+  use CoreWeb, :live_view_fabric
+  use Fabric.LiveView, CoreWeb.Layouts
   use CoreWeb.Layouts.Workspace.Component, :projects
   use CoreWeb.UI.PlainDialog
   use Systems.Observatory.Public
@@ -17,6 +18,7 @@ defmodule Systems.Project.OverviewPage do
     Project
   }
 
+  @impl true
   def mount(_params, _session, %{assigns: %{current_user: user}} = socket) do
     {
       :ok,
@@ -40,6 +42,51 @@ defmodule Systems.Project.OverviewPage do
     socket |> update_menus()
   end
 
+  @impl true
+  def compose(:project_form, %{active_project: project_id, vm: %{projects: projects}}) do
+    project = Enum.find(projects, &(&1.id == String.to_integer(project_id)))
+
+    %{
+      module: Project.Form,
+      params: %{
+        project: project
+      }
+    }
+  end
+
+  @impl true
+  def compose(:share_view, %{active_project: project_id, current_user: user}) do
+    researchers =
+      Core.Accounts.list_researchers([:profile])
+      # filter current user
+      |> Enum.filter(&(&1.id != user.id))
+
+    owners =
+      project_id
+      |> String.to_integer()
+      |> Project.Public.get!()
+      |> Project.Public.list_owners([:profile])
+      # filter current user
+      |> Enum.filter(&(&1.id != user.id))
+
+    %{
+      module: ShareView,
+      params: %{
+        content_id: project_id,
+        content_name: dgettext("eyra-project", "share.dialog.content"),
+        group_name: dgettext("eyra-project", "share.dialog.group"),
+        users: researchers,
+        shared_users: owners
+      }
+    }
+  end
+
+  @impl true
+  def handle_event("show_popup", %{ref: %{id: id, module: module}, params: params}, socket) do
+    popup = %{module: module, props: Map.put(params, :id, id)}
+    {:noreply, socket |> assign(popup: popup)}
+  end
+
   @impl true
   def handle_event(
         "card_clicked",
@@ -55,17 +102,15 @@ defmodule Systems.Project.OverviewPage do
   def handle_event(
         "edit",
         %{"item" => project_id},
-        %{assigns: %{vm: %{projects: projects}}} = socket
+        socket
       ) do
-    project = Enum.find(projects, &(&1.id == String.to_integer(project_id)))
-
-    popup = %{
-      module: Project.Form,
-      project: project,
-      target: self()
+    {
+      :noreply,
+      socket
+      |> assign(active_project: project_id)
+      |> compose_child(:project_form)
+      |> show_popup(:project_form)
     }
-
-    {:noreply, assign(socket, popup: popup)}
   end
 
   @impl true
@@ -105,32 +150,13 @@ defmodule Systems.Project.OverviewPage do
   end
 
   @impl true
-  def handle_event("share", %{"item" => project_id}, %{assigns: %{current_user: user}} = socket) do
-    researchers =
-      Core.Accounts.list_researchers([:profile])
-      # filter current user
-      |> Enum.filter(&(&1.id != user.id))
-
-    owners =
-      project_id
-      |> String.to_integer()
-      |> Project.Public.get!()
-      |> Project.Public.list_owners([:profile])
-      # filter current user
-      |> Enum.filter(&(&1.id != user.id))
-
-    popup = %{
-      module: ShareView,
-      content_id: project_id,
-      content_name: dgettext("eyra-project", "share.dialog.content"),
-      group_name: dgettext("eyra-project", "share.dialog.group"),
-      users: researchers,
-      shared_users: owners
-    }
-
+  def handle_event("share", %{"item" => project_id}, socket) do
     {
       :noreply,
-      socket |> assign(popup: popup)
+      socket
+      |> assign(active_project: project_id)
+      |> compose_child(:share_view)
+      |> show_popup(:share_view)
     }
   end
 
@@ -147,6 +173,29 @@ defmodule Systems.Project.OverviewPage do
     }
   end
 
+  @impl true
+  def handle_event("add_user", %{user: user, content_id: project_id}, socket) do
+    project_id
+    |> Project.Public.get!()
+    |> Project.Public.add_owner!(user)
+
+    {:noreply, socket}
+  end
+
+  @impl true
+  def handle_event("remove_user", %{user: user, content_id: project_id}, socket) do
+    project_id
+    |> Project.Public.get!()
+    |> Project.Public.remove_owner!(user)
+
+    {:noreply, socket}
+  end
+
+  @impl true
+  def handle_event("finish", _, socket) do
+    {:noreply, socket |> assign(popup: nil)}
+  end
+
   @impl true
   def handle_info(%{auto_save: _status}, socket) do
     {
@@ -172,47 +221,6 @@ defmodule Systems.Project.OverviewPage do
     }
   end
 
-  @impl true
-  def handle_info(%{module: _, action: :close}, socket) do
-    {
-      :noreply,
-      socket
-      |> assign(popup: nil)
-    }
-  end
-
-  @impl true
-  def handle_info(
-        %{module: Systems.Project.CreatePopup, action: %{redirect_to: node_id}},
-        socket
-      ) do
-    {:noreply, push_redirect(socket, to: ~p"/project/node/#{node_id}")}
-  end
-
-  @impl true
-  def handle_info(
-        %{module: Frameworks.Pixel.ShareView, action: %{add: user, content_id: project_id}},
-        socket
-      ) do
-    project_id
-    |> Project.Public.get!()
-    |> Project.Public.add_owner!(user)
-
-    {:noreply, socket}
-  end
-
-  @impl true
-  def handle_info(
-        %{module: Frameworks.Pixel.ShareView, action: %{remove: user, content_id: project_id}},
-        socket
-      ) do
-    project_id
-    |> Project.Public.get!()
-    |> Project.Public.remove_owner!(user)
-
-    {:noreply, socket}
-  end
-
   @impl true
   def render(assigns) do
     ~H"""
@@ -221,7 +229,7 @@ defmodule Systems.Project.OverviewPage do
       <%= if @popup do %>
         <.popup>
           <div class="mx-10 w-full max-w-popup sm:max-w-popup-sm md:max-w-popup-md lg:max-w-popup-lg">
-            <.live_component id={:project_overview_popup} module={@popup.module} {@popup} />
+            <.live_component id={:project_overview_popup} module={@popup.module} {@popup.props} />
           </div>
         </.popup>
       <% end %>