bonfire-networks/bonfire-app#877 and bonfire-networks/bonfire-app#718

bonfire-networks · Mar 24, 2024 · 7f6d20f · 7f6d20f
1 parent 22bf3d7
commit 7f6d20f
Show file tree

Hide file tree

Showing 21 changed files with 319 additions and 82 deletions.
diff --git a/lib/components/extensions/extension_toggle_live.ex b/lib/components/extensions/extension_toggle_live.ex
@@ -6,16 +6,20 @@ defmodule Bonfire.UI.Common.ExtensionToggleLive do
   prop can_instance_wide, :boolean, default: false
 
   def update(assigns, socket) do
-    extension = id(assigns) || id(socket.assigns)
+    socket =
+      socket
+      |> assign(assigns)
+
+    extension = id(socket.assigns)
 
     global_modularity = Config.get(:modularity, nil, extension)
     # |> debug(extension)
 
     {:ok,
      socket
-     |> assign(assigns)
      |> assign(
-       my_modularity: Settings.get(:modularity, nil, otp_app: extension, context: assigns),
+       my_modularity:
+         Settings.get(:modularity, nil, otp_app: extension, context: socket.assigns[:__context__]),
        global_modularity: global_modularity,
        globally_disabled: Bonfire.Common.Extend.disabled_value?(global_modularity)
      )}

diff --git a/lib/components/extensions/extensions_live.sface b/lib/components/extensions/extensions_live.sface
@@ -18,6 +18,7 @@
           tabindex="0"
           class="gap-1 p-1 mt-4 z-50 menu-sm rounded-lg shadow menu dropdown-content bg-base-200 w-60 md:w-48 text-neutral-content"
         >
+          <li><LinkLive to={"/settings/#{@scope || "user"}/#{e(dep, :app, nil)}"} class="flex-1 block w-full">{l("Extension settings")}</LinkLive></li>
           {#case get_link(dep)}
             {#match "#"}
             {#match link}
@@ -54,6 +55,7 @@
           tabindex="0"
           class="gap-1 mt-4 rounded shadow menu-sm menu dropdown-content z-50 bg-base-200 w-60 md:w-48"
         >
+          <li><LinkLive to={"/settings/#{@scope || "user"}/#{e(dep, :app, nil)}"} class="flex-1 block w-full">{l("Extension settings")}</LinkLive></li>
           <li><a
               href={get_link(dep) |> debug(e(dep, :app, "Unknown"))}
               target="_blank"
@@ -91,7 +93,9 @@
           tabindex="0"
           class="gap-1 mt-4 rounded shadow menu-sm menu dropdown-content z-50 bg-base-200 w-60 md:w-48"
         >
-          <li><a
+          <li>
+            <li><LinkLive to={"/settings/#{@scope || "user"}/#{e(dep, :app, nil)}"} class="flex-1 block w-full">{l("Extension settings")}</LinkLive></li>
+            <a
               href={get_link(dep) |> debug(e(dep, :app, "Unknown"))}
               target="_blank"
               class="flex-1 block w-full"
@@ -106,7 +110,7 @@
 
 <div class="!mt-8 m-3 text-xs font-medium tracking-wide uppercase text-base-content/70">{l("Ecosystem libraries")}</div>
 <div class="m-3 divide-y rounded-lg bg-base-content/5 divide-base-300">
-  {#for dep <- (e(@data, :ecosystem_libs, nil) || @ecosystem_libs) |> debug("eee")}
+  {#for dep <- e(@data, :ecosystem_libs, nil) || @ecosystem_libs}
     <div class="flex items-center justify-between p-4">
       <div class="flex flex-col gap-1">
         <div class="text-sm font-medium">{e(dep, :app, "Unknown")}</div>

diff --git a/lib/components/modals/open_modal_live.ex b/lib/components/modals/open_modal_live.ex
@@ -69,7 +69,7 @@ defmodule Bonfire.UI.Common.OpenModalLive do
   prop reusable_modal_component, :atom, default: ReusableModalLive
 
   @doc "The ID of this instance of the modal"
-  prop reusable_modal_id, :string, default: @default_modal_id
+  prop reusable_modal_id, :string, default: nil
 
   @doc """
   Additional assigns to pass on to the modal component
@@ -125,7 +125,11 @@ defmodule Bonfire.UI.Common.OpenModalLive do
         :reusable_modal_component,
         ReusableModalLive
       ),
-      reusable_modal_id || e(assigns, :reusable_modal_id, nil) || @default_modal_id,
+      reusable_modal_id || e(assigns, :reusable_modal_id, nil) ||
+        if(e(assigns, :__context__, :sticky, nil),
+          do: "persistent_modal",
+          else: @default_modal_id
+        ),
       assigns
     )
 
@@ -161,18 +165,32 @@ defmodule Bonfire.UI.Common.OpenModalLive do
       )
 
     # copy all of this component's assigns to the reusable modal (including slots!)
-    set(socket.assigns, e(socket.assigns, :reusable_modal_id, @default_modal_id))
+    set(socket.assigns)
 
     {:noreply, socket}
   end
 
   def handle_event("close", _, socket) do
-    close(e(socket.assigns, :reusable_modal_id, @default_modal_id))
+    close(
+      e(socket.assigns, :reusable_modal_id, nil) ||
+        if(e(socket.assigns, :__context__, :sticky, nil),
+          do: "persistent_modal",
+          else: @default_modal_id
+        )
+    )
+
     {:noreply, socket}
   end
 
   def handle_event("set_value", %{"value" => value}, socket) do
-    close(e(socket.assigns, :reusable_modal_id, @default_modal_id))
+    close(
+      e(socket.assigns, :reusable_modal_id, nil) ||
+        if(e(socket.assigns, :__context__, :sticky, nil),
+          do: "persistent_modal",
+          else: @default_modal_id
+        )
+    )
+
     {:noreply, socket |> assign(:value, value)}
   end
 end
diff --git a/lib/components/modular/disabled_module_live.sface b/lib/components/modular/disabled_module_live.sface
@@ -1 +1 @@
-<!-- component module disabled -->
+<span><!-- component module disabled --></span>
diff --git a/lib/components/nav/extension_menu/extension_menu_nav_live.sface b/lib/components/nav/extension_menu/extension_menu_nav_live.sface
@@ -16,7 +16,6 @@
                   widget={subnav}
                   page={@page}
                   selected_tab={@selected_tab}
-                  data={e(subnav, :props, [])}
                   skip_badges={@skip_badges}
                 />
               </li>
@@ -33,7 +32,6 @@
                   widget={subnav}
                   page={@page}
                   selected_tab={@selected_tab}
-                  data={e(subnav, :props, [])}
                   skip_badges={@skip_badges}
                 />
               </div>

diff --git a/lib/components/settings/avatars_settings_live.ex b/lib/components/settings/avatars_settings_live.ex
@@ -2,4 +2,6 @@ defmodule Bonfire.UI.Common.AvatarsSettingsLive do
   use Bonfire.UI.Common.Web, :stateless_component
 
   prop scope, :any, default: nil
+
+  # declare_settings_component(l("Avatars"), icon: "fluent:people-team-16-filled")
 end
diff --git a/lib/components/settings/sidebar/extensions_sidebar_settings_nav_live.ex b/lib/components/settings/sidebar/extensions_sidebar_settings_nav_live.ex
@@ -2,7 +2,7 @@ defmodule Bonfire.UI.Common.ExtensionsSidebarSettingsNavLive do
   use Bonfire.UI.Common.Web, :stateless_component
 
   prop page, :string, default: nil
-  prop showing_within, :atom, default: :sidebar
+  prop showing_within, :atom, default: nil
   prop selected_tab, :any
   prop scope, :any, default: nil
 

diff --git a/lib/components/settings/sidebar/extensions_sidebar_settings_nav_live.sface b/lib/components/settings/sidebar/extensions_sidebar_settings_nav_live.sface
@@ -1,41 +1,48 @@
 {#for {extension, modules} <- Bonfire.UI.Common.SettingsModule.app_modules()}
-  {#case Bonfire.UI.Common.SettingsModule.nav(extension)}
+  {#case extension_enabled?(extension, @__context__) &&
+      List.wrap(Bonfire.UI.Common.SettingsModule.nav(extension))}
+    {#match false}
     {#match extension_nav}
       {#case Bonfire.UI.Common.SettingsModule.extension_has_components?(extension, modules)}
         {#match extension_has_components?}
-          {#if extension_has_components? or
-              (is_map(extension_nav) or (is_list(extension_nav) and extension_nav != []))}
-            <div class="flex flex-col items-start p-0 cursor-default md:bg-base-100 hover:!bg-transparent">
-              {#if is_map(extension_nav) and !extension_nav[:exclude_from_nav] and
-                  extension_nav[:scope] == @scope}}>
-                <li>
+          {#if extension_has_components? or extension_nav != []}
+            {#case Bonfire.Common.ExtensionModule.extension(extension)}
+              {#match extension_meta}
+                <div class="p-2 text-lg font-bold flex items-center gap-4">
+                  <!-- <#Icon iconify="ph:hand-fill" class="w-6 h-6 text-base-content/80" /> -->
+                  <span>{e(extension_meta, :name, nil) || extension}</span>
+                </div>
+
+                <div class="flex flex-col items-start p-0 cursor-default md:bg-base-100 hover:!bg-transparent">
                   <Bonfire.UI.Common.WidgetLive
-                    :if={is_nil(e(extension_nav, :module, nil)) or
-                      module_enabled?(e(extension_nav, :module, nil), @__context__)}
-                    widget={extension_nav}
+                    :for={%{} = subnav <- extension_nav}
+                    :if={!e(subnav, :exclude_from_nav, nil) and e(subnav, :scope, nil) == @scope and
+                      (is_nil(e(subnav, :module, nil)) or
+                         module_enabled?(e(subnav, :module, nil), @__context__))}
+                    widget={subnav}
                     page={@page}
                     showing_within={@showing_within}
                     wrapper_class="w-full"
                     selected_tab={@selected_tab}
-                    data={e(extension_nav, :props, [])}
                   />
-                </li>
-              {#elseif is_list(extension_nav)}
-                <Bonfire.UI.Common.WidgetLive
-                  :for={subnav <- extension_nav}
-                  :if={(!e(subnav, :exclude_from_nav, nil) and e(subnav, :scope, nil) == @scope and
-                     is_nil(e(subnav, :module, nil))) or
-                    (module_enabled?(e(subnav, :module, nil), @__context__) and e(subnav, :scope, nil) == @scope)}
-                  widget={subnav}
-                  page={@page}
-                  showing_within={@showing_within}
-                  wrapper_class="w-full"
-                  selected_tab={@selected_tab}
-                  data={e(subnav, :props, [])}
-                />
-              {/if}
-            </div>
-            <!-- </li> -->
+
+                  <Bonfire.UI.Common.LinkWidgetLive
+                    :if={Enum.member?(extension_nav, true)}
+                    to={"/settings/#{@scope || "user"}/#{extension}"}
+                    text={if length(extension_nav) == 1,
+                      do: l("Extension settings"),
+                      else: l("Additional extension settings")}
+                    icon={e(extension_meta, :icon, nil) || "heroicons-outline:puzzle"}
+                    page={@page}
+                    showing_within={@showing_within}
+                    wrapper_class="w-full"
+                    link_class=""
+                    content_class="flex items-center gap-3 rounded-md px-2 w-full text-base-content/70"
+                    selected_tab={@selected_tab}
+                  />
+                </div>
+                <!-- </li> -->
+            {/case}
           {/if}
       {/case}
   {/case}

diff --git a/lib/components/settings/sidebar/instance_sidebar_settings_nav_live.sface b/lib/components/settings/sidebar/instance_sidebar_settings_nav_live.sface
@@ -214,10 +214,6 @@
     </div>
 
     <div class="pb-4 flex flex-col gap-1 border-b border-base-content/20">
-      <div class="p-2 text-lg font-bold flex items-center gap-4">
-        <!-- <#Icon iconify="majesticons:list-box" class="w-6 h-6 text-base-content/80" /> -->
-        <span>{l("Boundaries")}</span>
-      </div>
       <Bonfire.UI.Common.ExtensionsSidebarSettingsNavLive
         page={@page}
         selected_tab={@selected_tab}

diff --git a/lib/components/settings/sidebar/sidebar_settings_nav_live.sface b/lib/components/settings/sidebar/sidebar_settings_nav_live.sface
@@ -180,11 +180,6 @@
     </div>
 
     <div class="pb-4 flex flex-col gap-1 border-b border-base-content/20">
-      <div class="p-2 text-lg font-bold flex items-center gap-4">
-        <!-- <#Icon iconify="ph:hand-fill" class="w-6 h-6 text-base-content/80" /> -->
-        <span>{l("Boundaries")}</span>
-      </div>
-
       <Bonfire.UI.Common.ExtensionsSidebarSettingsNavLive
         page={@page}
         selected_tab={@selected_tab}

diff --git a/lib/components/smart_input/input_controls_live.sface b/lib/components/smart_input/input_controls_live.sface
@@ -141,7 +141,7 @@
                   tabindex="0"
                   class="tooltip p-1 z-50 menu shadow bg-base-200 rounded absolute top-0 left-0 hidden w-52"
                 >
-                  <li>
+                  <li :if={module_enabled?(Bonfire.Boundaries.Web.PreviewBoundariesLive, @__context__)}>
                     <button
                       type="button"
                       phx-click={JS.show(to: "#boundaries_preview")

diff --git a/lib/components/widgets/link_widget_live.ex b/lib/components/widgets/link_widget_live.ex
@@ -1,17 +1,22 @@
 defmodule Bonfire.UI.Common.LinkWidgetLive do
   use Bonfire.UI.Common.Web, :stateless_component
 
-  prop href, :string, default: nil
+  prop to, :string, default: nil
   prop text, :string, default: nil
   prop icon, :string, default: nil
 
   prop widget, :any, default: %{}
   prop without_icon, :boolean, default: false
   prop without_label, :boolean, default: false
 
-  prop text_class, :css_class,
-    required: false,
-    default: nil
+  prop content_class, :css_class,
+    default: "flex-1 justify-end relative flex items-center gap-5 widget_content p-2"
+
+  prop text_class, :css_class, default: nil
+
+  prop badge_class, :css_class,
+    default:
+      "flex absolute right-[6px] top-[-8px] tablet-lg:!right-auto tablet-lg:left-7 tablet-lg:!top-0 items-center place-content-center widget_notification"
 
   prop page, :string, default: nil
   prop selected_tab, :any, default: nil

diff --git a/lib/components/widgets/link_widget_live.sface b/lib/components/widgets/link_widget_live.sface
@@ -4,14 +4,14 @@
   data-type="widget"
 >
   <LinkLive
-    to={if is_function(@href),
-      do: @href.(@__context__),
-      else: @href}
+    to={if is_function(@to),
+      do: @to.(@__context__),
+      else: @to}
     class={e(@widget[:link_class], @link_class)}
     label={@text || @widget[:text] || @widget[:name]}
     phx_hook={@widget[:phx_hook]}
   >
-    <div class="flex-1 justify-end relative flex items-center gap-5 widget_content p-2">
+    <div class={@content_class}>
       <span :if={!@without_icon && (@icon || @widget[:icon] || @widget[:icon_active])} class="">
         {#if not is_nil(@widget[:page]) and (@page == @widget[:page] or @selected_tab == @widget[:page])}
           <Iconify.iconify
@@ -32,10 +32,7 @@
         data-type="widget_label"
         :if={!@without_label}
         class={
-          e(
-            @text_class,
-            ""
-          ),
+          @text_class,
           "!font-bold !text-base-content":
             not is_nil(@widget[:page]) and (@page == @widget[:page] or @selected_tab == @widget[:page])
         }
@@ -46,7 +43,7 @@
       {#match badge}
         <div
           :if={!@skip_badges or (is_list(@skip_badges) and badge[:id] not in @skip_badges)}
-          class="flex absolute right-[6px] top-[-8px] tablet-lg:!right-auto tablet-lg:left-7 tablet-lg:!top-0 items-center place-content-center widget_notification"
+          class={@badge_class}
         >
           <StatefulComponent
             id={badge[:id] || Text.random_string()}

diff --git a/lib/components/widgets/sidebar_widgets_live.sface b/lib/components/widgets/sidebar_widgets_live.sface
@@ -8,7 +8,6 @@
           page={@page}
           selected_tab={@selected_tab}
           showing_within={:sidebar}
-          data={e(widget, :props, [])}
         />
       {/for}
       {#for {component, component_assigns} <- widgets}
@@ -17,7 +16,7 @@
           page={@page}
           selected_tab={@selected_tab}
           showing_within={:sidebar}
-          data={component_assigns || []}
+          data={component_assigns}
           {...component_assigns || []}
         />
       {/for}

diff --git a/lib/components/widgets/widget_live.ex b/lib/components/widgets/widget_live.ex
@@ -2,9 +2,11 @@ defmodule Bonfire.UI.Common.WidgetLive do
   use Bonfire.UI.Common.Web, :stateless_component
 
   prop widget, :any, required: true
-  prop data, :any, default: []
+  prop data, :any, default: nil
+  prop extra_data, :any, default: %{}
   prop without_icon, :boolean, default: false
   prop without_label, :boolean, default: false
+  prop with_title, :boolean, default: false
 
   prop text_class, :css_class,
     required: false,
@@ -21,8 +23,18 @@ defmodule Bonfire.UI.Common.WidgetLive do
   prop skip_badges, :any, default: false
 
   def render(assigns) do
+    widget = widget(assigns[:widget], assigns[:__context__])
+
+    # || Map.drop(widget, [:module, :type]))
+    data =
+      Enum.into(assigns[:data] || e(widget, :data, nil) || [], assigns[:extra_data] || %{})
+      |> debug("daaata")
+
     assigns
-    |> assign(:widget, widget(assigns[:widget], assigns[:__context__]))
+    |> assign(
+      widget: widget,
+      data: data
+    )
     |> render_sface()
   end