Add buttons back to Live Templates

plugs/query/template.ts

@@ -1,7 +1,6 @@
-import { WidgetContent } from "$sb/app_event.ts";
-import { markdown, space, system, YAML } from "$sb/syscalls.ts";
+import { markdown, space,, YAML } from "$sb/syscalls.ts";
 import { loadPageObject, replaceTemplateVars } from "../template/template.ts";
-import { PageMeta } from "$sb/types.ts";
+import { CodeWidgetContent, PageMeta } from "$sb/types.ts";
 import { renderTemplate } from "../template/plug_api.ts";
 import { renderToText } from "$sb/lib/tree.ts";
 import { rewritePageRefs, rewritePageRefsInString } from "$sb/lib/resolve.ts";
@@ -20,7 +19,7 @@ type TemplateConfig = {
 export async function widget(
   bodyText: string,
   pageName: string,
-): Promise<WidgetContent> {
+): Promise<CodeWidgetContent> {
   const pageMeta: PageMeta = await loadPageObject(pageName);
 
   try {
@@ -59,7 +58,20 @@ export async function widget(
       rendered = renderToText(parsedMarkdown);
     }
 
-    return { markdown: rendered };
+    return {
+      markdown: rendered,
+      buttons: [{
+        description: "Edit",
+        svg:
+          `<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-edit"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg>`,
+        invokeFunction: "query.editButton",
+      }, {
+        description: "Reload",
+        svg:
+          `<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-refresh-cw"><polyline points="23 4 23 10 17 10"></polyline><polyline points="1 20 1 14 7 14"></polyline><path d="M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"></path></svg>`,
+        invokeFunction: "query.refreshAllWidgets",
+      }],
+    };
   } catch (e: any) {
     return {
       markdown: `**Error:** ${e.message}`,

plugs/template/template.ts

@@ -1,4 +1,4 @@
-import { editor, handlebars, markdown, space, YAML } from "$sb/syscalls.ts";
+import { editor, handlebars, space } from "$sb/syscalls.ts";
 import { niceDate, niceTime } from "$sb/lib/dates.ts";
 import { readSettings } from "$sb/lib/settings_page.ts";
 import { cleanPageRef } from "$sb/lib/resolve.ts";

web/cm_plugins/markdown_widget.ts

@@ -162,6 +162,7 @@ export class MarkdownWidget extends WidgetType {
       div.querySelector(`button[data-button="${i}"]`)!.addEventListener(
         "click",
         () => {
+          console.log("Button clicked:", button.description);
           this.client.system.localSyscall("system.invokeFunction", [
             button.invokeFunction,
             this.from,