From 9fd8cb9e1d3e3f82c839dfc6d95a93f42f397846 Mon Sep 17 00:00:00 2001 From: Chili Palmer Date: Sat, 25 Apr 2026 23:21:25 +0200 Subject: [PATCH] fix: more work on liveview Co-authored-by: Copilot --- PLAN.md | 4 +- lib/bds/desktop/shell_data.ex | 6 +- lib/bds/desktop/shell_live.ex | 526 ++++++++------------- lib/bds/desktop/shell_live/index.html.heex | 348 ++++++++++++++ lib/bds/sidecar.ex | 2 +- priv/ui/app.css | 7 + test/bds/desktop/shell_live_test.exs | 17 + 7 files changed, 571 insertions(+), 339 deletions(-) create mode 100644 lib/bds/desktop/shell_live/index.html.heex diff --git a/PLAN.md b/PLAN.md index f2f5bb5..44d2aa4 100644 --- a/PLAN.md +++ b/PLAN.md @@ -13,7 +13,7 @@ The rewrite already implements most of the backend and compatibility-critical su - Compatibility parity locks: executable parity coverage now pins the old-bDS behavior for serializer/file contracts, metadata-diff ordering, canonical generation routes, feed output, localized archive rendering, preview draft language selection, taxonomy archive links, and media URL rewriting. - Core editorial domains: projects, posts, post translations, media, media translations, tags, templates, scripts, menu data, and project metadata. - Output and infrastructure: search, Liquid rendering, site generation, preview server, publishing, background tasks, i18n, git support, MCP server, AI operations, embeddings, and CLI sync. -- Desktop shell foundation: native menu definitions, LiveView shell endpoint, activity bar, sidebar views, tab/workbench state, task panel, assistant sidebar, project switcher, and shell command routing. +- Desktop shell foundation: native menu definitions, LiveView shell endpoint, activity bar, sidebar views, tab/workbench state, task panel, assistant sidebar, status bar, project switcher, shell command routing, and template-backed shell rendering. ### Implemented But Not Yet At Parity @@ -53,7 +53,7 @@ The remaining work needs to proceed from base contracts upward. Later phases sho Save/publish/delete side-effects, published-post `templateSlug` frontmatter rewrites, manual-translation source-post reopening, post-to-media sidecar cleanup, auto-translation task cascades, linked-media translation cascades, link graph maintenance, thumbnail regeneration rules, and rebuild notifications are now implemented and covered at the backend layer independent of UI. 3. Finish the desktop shell primitives. Completed 2026-04-25. - Route state, registry-backed shell command coverage, panel fallback integration, and menu/native-command wiring now cover every sidebar view and singleton editor route while preserving the old app shell frame and styling. + Route state, registry-backed shell command coverage, panel fallback integration, menu/native-command wiring, template-backed LiveView rendering, and sidebar-to-tab/status-bar interactions now cover every sidebar view and singleton editor route while preserving the old app shell frame and styling. 4. Implement the shared modal and confirmation layer. Add the modal/overlay system required by the specs: AI suggestions, delete confirmations, merge confirmation, picker overlays, and gallery flows. diff --git a/lib/bds/desktop/shell_data.ex b/lib/bds/desktop/shell_data.ex index d10afff..8ffce8f 100644 --- a/lib/bds/desktop/shell_data.ex +++ b/lib/bds/desktop/shell_data.ex @@ -87,13 +87,13 @@ defmodule BDS.Desktop.ShellData do ] end - def status_bar(workbench, task_status, dashboard) do + def status_bar(workbench, task_status, dashboard, opts \\ []) do Workbench.status_bar(workbench, post_count: dashboard.post_stats.total_posts, media_count: dashboard.media_stats.media_count, theme_badge: "desktop-shell", - ui_language: ui_language(), - offline_mode: true, + ui_language: Keyword.get(opts, :ui_language, ui_language()), + offline_mode: Keyword.get(opts, :offline_mode, true), running_task_message: task_status.running_task_message, running_task_overflow: task_status.running_task_overflow, active_post_status: nil diff --git a/lib/bds/desktop/shell_live.ex b/lib/bds/desktop/shell_live.ex index 93dcee8..f0fca01 100644 --- a/lib/bds/desktop/shell_live.ex +++ b/lib/bds/desktop/shell_live.ex @@ -6,10 +6,13 @@ defmodule BDS.Desktop.ShellLive do import Phoenix.HTML alias BDS.Desktop.ShellData + alias BDS.UI.Registry alias BDS.UI.Workbench @refresh_interval 1_500 + embed_templates "shell_live/*" + @impl true def mount(_params, _session, socket) do if connected?(socket) do @@ -22,6 +25,8 @@ defmodule BDS.Desktop.ShellLive do socket |> assign(:page_title, ShellData.title()) |> assign(:page_language, ShellData.ui_language()) + |> assign(:offline_mode, true) + |> assign(:tab_meta, %{}) |> reload_shell(workbench)} end @@ -52,6 +57,37 @@ defmodule BDS.Desktop.ShellLive do {:noreply, reload_shell(socket, workbench)} end + def handle_event("open_sidebar_item", %{"route" => route, "id" => id} = params, socket) do + route_atom = sidebar_route_atom(route) + tab_id = tab_id_for_route(route_atom, id) + + workbench = + Workbench.open_tab(socket.assigns.workbench, route_atom, tab_id, tab_intent(route_atom)) + + tab_meta = + Map.put(socket.assigns.tab_meta, {route_atom, tab_id}, %{ + title: Map.get(params, "title", ""), + subtitle: Map.get(params, "subtitle", "") + }) + + {:noreply, + socket + |> assign(:tab_meta, tab_meta) + |> reload_shell(workbench)} + end + + def handle_event("select_tab", %{"type" => type, "id" => id}, socket) do + workbench = + Workbench.open_tab(socket.assigns.workbench, String.to_existing_atom(type), id, :preview) + + {:noreply, reload_shell(socket, workbench)} + end + + def handle_event("toggle_offline_mode", _params, socket) do + socket = assign(socket, :offline_mode, not socket.assigns.offline_mode) + {:noreply, reload_shell(socket, socket.assigns.workbench)} + end + @impl true def handle_info(:refresh_task_status, socket) do task_status = BDS.Tasks.status_snapshot() @@ -60,312 +96,17 @@ defmodule BDS.Desktop.ShellLive do socket |> assign(:task_status, task_status) |> assign(:editor_meta, ShellData.editor_meta(task_status)) - |> assign(:status, ShellData.status_bar(socket.assigns.workbench, task_status, socket.assigns.dashboard))} + |> assign( + :status, + ShellData.status_bar(socket.assigns.workbench, task_status, socket.assigns.dashboard, + ui_language: socket.assigns.page_language, + offline_mode: socket.assigns.offline_mode + ) + )} end @impl true - def render(assigns) do - ~H""" -
-
- -
-
<%= @page_title %>
-
- - - -
-
- -
- - -
-
-
-
-
- <%= String.upcase(sidebar_header_label(@sidebar_header)) %> -
-
- <%= render_sidebar_body(assigns) %> -
-
-
-
- -
-
-
-
-
-

<%= translated("dashboard.title") %>

-

<%= translated("dashboard.subtitle") %>

- -
-
-
<%= @dashboard.post_stats.total_posts || 0 %>
-
<%= translated("dashboard.stats.totalPosts") %>
-
- <%= translated("dashboard.stats.published", %{count: @dashboard.post_stats.published_count || 0}) %> - <%= translated("dashboard.stats.drafts", %{count: @dashboard.post_stats.draft_count || 0}) %> - <%= if (@dashboard.post_stats.archived_count || 0) > 0 do %> - <%= translated("dashboard.stats.archived", %{count: @dashboard.post_stats.archived_count || 0}) %> - <% end %> -
-
-
-
<%= @dashboard.media_stats.media_count || 0 %>
-
<%= translated("dashboard.stats.mediaFiles") %>
-
- <%= translated("dashboard.stats.images", %{count: @dashboard.media_stats.image_count || 0}) %> - <%= ShellData.format_bytes(@dashboard.media_stats.total_bytes || 0) %> -
-
-
-
<%= length(@dashboard.tag_cloud_items || []) %>
-
<%= translated("dashboard.stats.tags") %>
-
- <%= translated("dashboard.stats.categories", %{count: length(@dashboard.category_counts || [])}) %> -
-
-
- - <%= if Enum.any?(@dashboard.timeline_entries || []) do %> -
-

<%= translated("dashboard.section.postsOverTime") %>

-
- <%= for entry <- @dashboard.timeline_entries || [] do %> -
-
- <%= entry.count || 0 %> -
-
- <%= ShellData.format_dashboard_month(entry.year, entry.month) %> - <%= entry.year %> -
-
- <% end %> -
-
- <% end %> - - <%= if Enum.any?(@dashboard_tag_cloud_items) do %> -
-

<%= translated("dashboard.section.tags") %>

-
- <%= for item <- @dashboard_tag_cloud_items do %> - <%= item.tag %> - <% end %> - <%= if length(@dashboard.tag_cloud_items || []) > 40 do %> - <%= translated("dashboard.tagCloud.more", %{count: length(@dashboard.tag_cloud_items) - 40}) %> - <% end %> -
-
- <% end %> - - <%= if Enum.any?(@dashboard.category_counts || []) do %> -
-

<%= translated("dashboard.section.categories") %>

-
- <%= for category <- @dashboard.category_counts || [] do %> - - <%= category.category || "" %> - <%= category.count || 0 %> - - <% end %> -
-
- <% end %> - - <%= if Enum.any?(@dashboard.recent_posts || []) do %> -
-

<%= translated("dashboard.section.recentlyUpdated") %>

-
- <%= for post <- @dashboard.recent_posts || [] do %> - - <% end %> -
-
- <% end %> - - -
-
-
- -
-
-
- <%= for tab <- @panel_tabs do %> - - <% end %> -
-
-
- <%= render_panel_body(assigns) %> -
-
-
- -
-
- -
-
- -
-
-
- -
- -
-
- <%= @status.right.post_count %> - <%= @status.right.media_count %> - <%= @status.right.theme_badge %> - - - <%= @status.right.brand %> -
-
-
- """ - end + def render(assigns), do: index(assigns) defp reload_shell(socket, workbench) do projects = ShellData.project_snapshot() @@ -373,22 +114,34 @@ defmodule BDS.Desktop.ShellLive do sidebar_data = ShellData.sidebar_view(projects.active_project_id, Atom.to_string(workbench.active_view)) task_status = BDS.Tasks.status_snapshot() activity_buttons = Workbench.activity_buttons(workbench, 0) + page_language = socket.assigns[:page_language] || ShellData.ui_language() + offline_mode = Map.get(socket.assigns, :offline_mode, true) socket |> assign(:workbench, workbench) |> assign(:projects, projects) |> assign(:current_project, ShellData.current_project(projects)) |> assign(:dashboard, dashboard) - |> assign(:dashboard_tag_cloud_items, ShellData.dashboard_tag_cloud_items(dashboard.tag_cloud_items || [])) + |> assign(:dashboard_timeline_entries, Map.get(dashboard, :timeline_entries, [])) + |> assign(:dashboard_category_counts, Map.get(dashboard, :category_counts, [])) + |> assign(:dashboard_recent_posts, Map.get(dashboard, :recent_posts, [])) + |> assign(:dashboard_tag_cloud_items, ShellData.dashboard_tag_cloud_items(Map.get(dashboard, :tag_cloud_items, []))) |> assign(:sidebar_data, sidebar_data) |> assign(:sidebar_header, active_sidebar_label(activity_buttons, workbench.active_view, sidebar_data)) |> assign(:assistant_cards, ShellData.assistant_cards()) |> assign(:editor_meta, ShellData.editor_meta(task_status)) |> assign(:task_status, task_status) - |> assign(:status, ShellData.status_bar(workbench, task_status, dashboard)) + |> assign( + :status, + ShellData.status_bar(workbench, task_status, dashboard, + ui_language: page_language, + offline_mode: offline_mode + ) + ) |> assign(:activity_buttons, activity_buttons) |> assign(:panel_tabs, ShellData.panel_tabs(workbench)) |> assign(:supported_ui_languages, ShellData.supported_ui_languages()) + |> assign(:current_tab, current_tab(workbench)) end defp render_sidebar_body(assigns) do @@ -403,20 +156,31 @@ defmodule BDS.Desktop.ShellLive do defp render_post_sidebar(assigns) do ~H""" - <%= for section <- @sidebar_data.sections || [] do %> + <%= for section <- Map.get(@sidebar_data, :sections, []) do %>
- ● + ● <%= translated(section.title) %> - <%= section.count || length(section.items || []) %> + <%= Map.get(section, :count, length(Map.get(section, :items, []))) %>
- <%= for item <- section.items || [] do %> -
<% end %> - <%= if Enum.empty?(@sidebar_data.sections || []) do %> + <%= if Enum.empty?(Map.get(@sidebar_data, :sections, [])) do %>
-

<%= translated(@sidebar_data.empty_message || "No items") %>

+

<%= translated(Map.get(@sidebar_data, :empty_message, "No items")) %>

<% end %> """ @@ -435,10 +199,22 @@ defmodule BDS.Desktop.ShellLive do defp render_media_sidebar(assigns) do ~H""" - <%= if Enum.any?(@sidebar_data.items || []) do %> + <%= if Enum.any?(Map.get(@sidebar_data, :items, [])) do %>
- <%= for item <- @sidebar_data.items || [] do %> - <% end %>
<% else %>
-

<%= translated(@sidebar_data.empty_message || "No items") %>

+

<%= translated(Map.get(@sidebar_data, :empty_message, "No items")) %>

<% end %> """ @@ -464,12 +240,23 @@ defmodule BDS.Desktop.ShellLive do defp render_entity_sidebar(assigns) do ~H""" - <%= if Enum.any?(@sidebar_data.items || []) do %> + <%= if Enum.any?(Map.get(@sidebar_data, :items, [])) do %>
- <%= for item <- @sidebar_data.items || [] do %> - @@ -477,7 +264,7 @@ defmodule BDS.Desktop.ShellLive do
<% else %>
-

<%= translated(@sidebar_data.empty_message || "No items") %>

+

<%= translated(Map.get(@sidebar_data, :empty_message, "No items")) %>

<% end %> """ @@ -486,10 +273,21 @@ defmodule BDS.Desktop.ShellLive do defp render_nav_sidebar(assigns) do ~H"""
- <%= for item <- @sidebar_data.items || [] do %> - <% end %>
@@ -498,13 +296,13 @@ defmodule BDS.Desktop.ShellLive do defp render_default_sidebar(assigns) do ~H""" - <%= for section <- @sidebar_data.sections || [] do %> + <%= for section <- Map.get(@sidebar_data, :sections, []) do %>
<%= translated(section.title) %>
- <%= for item <- section.items || [] do %> + <%= for item <- Map.get(section, :items, []) do %>
<%= item.title || "" %>
<% end %>
@@ -524,14 +322,14 @@ defmodule BDS.Desktop.ShellLive do defp render_task_entries(assigns) do ~H""" - <%= if Enum.empty?(@task_status.tasks || []) do %> + <%= if Enum.empty?(Map.get(@task_status, :tasks, [])) do %>
<%= translated("Tasks") %> <%= translated("No background tasks running") %>
<% else %>
- <%= for task <- @task_status.tasks || [] do %> + <%= for task <- Map.get(@task_status, :tasks, []) do %>
<%= task.name %> @@ -588,7 +386,7 @@ defmodule BDS.Desktop.ShellLive do defp activity_label(label), do: translated(label) defp active_sidebar_label(activity_buttons, active_view, sidebar_data) do - Enum.find_value(activity_buttons, translated(sidebar_data.title || ""), fn button -> + Enum.find_value(activity_buttons, translated(Map.get(sidebar_data, :title, "")), fn button -> if button.id == active_view, do: activity_label(button.label), else: nil end) end @@ -618,6 +416,68 @@ defmodule BDS.Desktop.ShellLive do if image_media?(item), do: "media-thumbnail has-image", else: "media-thumbnail" end + defp current_tab(%{active_tab: nil}), do: nil + + defp current_tab(%{tabs: tabs, active_tab: {type, id}}) do + Enum.find(tabs, &(&1.type == type and &1.id == id)) + end + + defp sidebar_route_atom(route) when is_atom(route), do: route + defp sidebar_route_atom(route) when is_binary(route), do: String.to_existing_atom(route) + + defp tab_id_for_route(route, id) do + case Registry.editor_route(route) do + %{singleton: true} -> Atom.to_string(route) + _other -> id + end + end + + defp tab_intent(route) do + case Registry.editor_route(route) do + %{singleton: true} -> :pin + _other -> :preview + end + end + + defp sidebar_item_selected?(workbench, route, id) do + route_atom = sidebar_route_atom(route) + workbench.active_tab == {route_atom, tab_id_for_route(route_atom, id)} + end + + defp tab_title(nil, _tab_meta), do: translated("Dashboard") + + defp tab_title(tab, tab_meta) do + case Map.get(tab_meta, {tab.type, tab.id}) do + %{title: title} when is_binary(title) and title != "" -> title + _other -> default_tab_title(tab) + end + end + + defp tab_subtitle(nil, _tab_meta), do: translated("dashboard.subtitle") + + defp tab_subtitle(tab, tab_meta) do + case Map.get(tab_meta, {tab.type, tab.id}) do + %{subtitle: subtitle} when is_binary(subtitle) and subtitle != "" -> subtitle + _other -> "Desktop workbench content routed through the Elixir shell." + end + end + + defp default_tab_title(%{type: type, id: id}) do + case Registry.editor_route(type) do + %{singleton: true} -> ShellData.route_label(type) + _other -> id + end + end + + defp tab_route_label(nil), do: translated("Dashboard") + defp tab_route_label(%{type: type}), do: ShellData.route_label(type) + + defp tab_icon_id(nil), do: "posts" + defp tab_icon_id(%{type: :post}), do: "posts" + defp tab_icon_id(%{type: :git_diff}), do: "git" + defp tab_icon_id(%{type: :style}), do: "settings" + defp tab_icon_id(%{type: type}), do: Atom.to_string(type) + defp media_thumbnail_glyph(mime_type) do case String.split(to_string(mime_type || ""), "/", parts: 2) do ["image", _rest] -> "IMG" diff --git a/lib/bds/desktop/shell_live/index.html.heex b/lib/bds/desktop/shell_live/index.html.heex new file mode 100644 index 0000000..ce87e24 --- /dev/null +++ b/lib/bds/desktop/shell_live/index.html.heex @@ -0,0 +1,348 @@ +
+
+ +
+
<%= @page_title %>
+
+ + + +
+
+ +
+ + +
+
+
+
+
+ <%= String.upcase(sidebar_header_label(@sidebar_header)) %> +
+
+ <%= render_sidebar_body(assigns) %> +
+
+
+
+ +
+
+ <%= if Enum.empty?(@workbench.tabs) do %> +
<%= translated("Dashboard") %>
+ <% else %> +
+ <%= for tab <- @workbench.tabs do %> + + <% end %> +
+ <% end %> +
+ +
+ <%= if is_nil(@current_tab) do %> +
+
+

<%= translated("dashboard.title") %>

+

<%= translated("dashboard.subtitle") %>

+ +
+
+
<%= @dashboard.post_stats.total_posts || 0 %>
+
<%= translated("dashboard.stats.totalPosts") %>
+
+ <%= translated("dashboard.stats.published", %{count: @dashboard.post_stats.published_count || 0}) %> + <%= translated("dashboard.stats.drafts", %{count: @dashboard.post_stats.draft_count || 0}) %> + <%= if (@dashboard.post_stats.archived_count || 0) > 0 do %> + <%= translated("dashboard.stats.archived", %{count: @dashboard.post_stats.archived_count || 0}) %> + <% end %> +
+
+
+
<%= @dashboard.media_stats.media_count || 0 %>
+
<%= translated("dashboard.stats.mediaFiles") %>
+
+ <%= translated("dashboard.stats.images", %{count: @dashboard.media_stats.image_count || 0}) %> + <%= ShellData.format_bytes(@dashboard.media_stats.total_bytes || 0) %> +
+
+
+
<%= length(@dashboard_tag_cloud_items) %>
+
<%= translated("dashboard.stats.tags") %>
+
+ <%= translated("dashboard.stats.categories", %{count: length(@dashboard_category_counts)}) %> +
+
+
+ + <%= if Enum.any?(@dashboard_timeline_entries) do %> +
+

<%= translated("dashboard.section.postsOverTime") %>

+
+ <%= for entry <- @dashboard_timeline_entries do %> +
+
+ <%= entry.count || 0 %> +
+
+ <%= ShellData.format_dashboard_month(entry.year, entry.month) %> + <%= entry.year %> +
+
+ <% end %> +
+
+ <% end %> + + <%= if Enum.any?(@dashboard_tag_cloud_items) do %> +
+

<%= translated("dashboard.section.tags") %>

+
+ <%= for item <- @dashboard_tag_cloud_items do %> + <%= item.tag %> + <% end %> +
+
+ <% end %> + + <%= if Enum.any?(@dashboard_category_counts) do %> +
+

<%= translated("dashboard.section.categories") %>

+
+ <%= for category <- @dashboard_category_counts do %> + + <%= category.category || "" %> + <%= category.count || 0 %> + + <% end %> +
+
+ <% end %> + + <%= if Enum.any?(@dashboard_recent_posts) do %> +
+

<%= translated("dashboard.section.recentlyUpdated") %>

+
+ <%= for post <- @dashboard_recent_posts do %> + + <% end %> +
+
+ <% end %> + + +
+
+ <% else %> +
+
+
<%= tab_route_label(@current_tab) %>
+

<%= tab_title(@current_tab, @tab_meta) %>

+

<%= tab_subtitle(@current_tab, @tab_meta) %>

+ +
+ + + +
+ +
+

<%= tab_title(@current_tab, @tab_meta) %>

+

Desktop workbench content routed through the Elixir shell.

+
+
+ + +
+ <% end %> +
+ +
+
+
+ <%= for tab <- @panel_tabs do %> + + <% end %> +
+
+
+ <%= render_panel_body(assigns) %> +
+
+
+ +
+
+ +
+
+ + +
diff --git a/lib/bds/sidecar.ex b/lib/bds/sidecar.ex index d734961..57f42d3 100644 --- a/lib/bds/sidecar.ex +++ b/lib/bds/sidecar.ex @@ -192,7 +192,7 @@ defmodule BDS.Sidecar do else inner |> String.split(",", trim: true) - |> Enum.map(&(String.trim(&1) |> parse_scalar(nil))) + |> Enum.map(&parse_scalar(nil, String.trim(&1))) end end diff --git a/priv/ui/app.css b/priv/ui/app.css index 3b3f6e8..26f783f 100644 --- a/priv/ui/app.css +++ b/priv/ui/app.css @@ -62,6 +62,13 @@ body { font-size: var(--vscode-font-size); } +body > [data-phx-session], +body > [data-phx-main] { + width: 100%; + height: 100%; + min-height: 0; +} + button { font: inherit; } diff --git a/test/bds/desktop/shell_live_test.exs b/test/bds/desktop/shell_live_test.exs index d5c45e9..5998fa2 100644 --- a/test/bds/desktop/shell_live_test.exs +++ b/test/bds/desktop/shell_live_test.exs @@ -10,6 +10,8 @@ defmodule BDS.Desktop.ShellLiveTest do {:ok, view, html} = live_isolated(build_conn(), BDS.Desktop.ShellLive) assert html =~ ~s(data-testid="sidebar-shell") + assert html =~ ~s(data-testid="status-bar") + assert html =~ ~s(data-testid="status-task-button") assert html =~ ~s(class="panel-shell is-hidden") assert html =~ ~s(data-testid="activity-button") assert html =~ ~s(data-view="posts") @@ -38,5 +40,20 @@ defmodule BDS.Desktop.ShellLiveTest do assert html =~ ~s(aria-label="Media") assert html =~ ~s(data-view="media") + + html = + view + |> element("[data-testid='activity-button'][data-view='settings']") + |> render_click() + + assert html =~ ~s(data-testid="sidebar-open-item") + + html = + view + |> element("[data-testid='sidebar-open-item'][data-item-id='settings-project']") + |> render_click() + + assert html =~ ~s(data-tab-type="settings") + assert html =~ ">Settings<" end end