Add activity log

Author: bfollington

typescript/packages/lookslike-high-level/src/data.ts

@@ -63,6 +63,9 @@ import { shaderManager } from './spells/20_shader_editor.jsx'
 import { schemaGenerator } from './spells/21_model_builder.jsx'
 import { search } from './spells/22_search.jsx'
 import { notebook } from './spells/23_notes.jsx'
+import { quotedb } from './spells/24_quotes.jsx'
+import { activity } from './spells/25_activity.jsx'
+import { activityRef } from "./sugar/activity.js";
 
 export type Charm = {
   [NAME]?: string;
@@ -264,6 +267,8 @@ addCharms([
   schemaGenerator.spawn({ schemaGenerator: 1 }),
   search.spawn({ search: 1 }),
   notebook.spawn({ notes: 1 }),
+  quotedb.spawn({ quotes: 1 }),
+  activity.spawn(activityRef),
   FetchService.spawn() as any,
   GmailService.spawn() as any,
   ViewService.spawn() as any,

typescript/packages/lookslike-high-level/src/spells/02_counter.tsx

@@ -3,6 +3,7 @@ import { event, events, set, subview } from "../sugar.js";
 import { description, Description } from "./stickers/describe.jsx";
 import { mixin } from "../sugar/mixin.js";
 import { Chattable, chatUiResolver } from "./stickers/chat.jsx";
+import { log } from "../sugar/activity.js";
 
 const resolveEmpty = select({ self: $.self }).not(q => q.match($.self, "clicks", $._));
 
@@ -65,7 +66,7 @@ export const rules = behavior({
 
   onClick: event(CounterEvent.onClick)
     .with(resolveClicks)
-    .update(({ self, clicks }) => set(self, { clicks: clicks + 1 }))
+    .update(({ self, clicks }) => ([...set(self, { clicks: clicks + 1 }), ...log(self, 'Incremented counter')]))
     .commit(),
 });
 

typescript/packages/lookslike-high-level/src/spells/16_contacts.tsx

@@ -9,6 +9,7 @@ import { z } from "zod";
 import { Reference } from "merkle-reference";
 import { importEntity, resolve, tagWithSchema } from "../sugar/sugar.jsx";
 import { Ref, UiFragment } from "../sugar/zod.js";
+import { log } from "../sugar/activity.js";
 
 const Contact = z.object({
   name: z.string().min(1).max(255).describe("The name of the contact"),
@@ -86,6 +87,7 @@ export const addressBook = typedBehavior(
         const { self: id, instructions } = importEntity(contact, Contact)
         cmd.add(...instructions);
         cmd.add(...Transact.assert(self, { contacts: id }));
+        cmd.add(...log(self, 'Added new contact'))
       }),
 
     onEditContact: event("~/on/edit-contact")

typescript/packages/lookslike-high-level/src/spells/20_shader_editor.tsx

@@ -12,6 +12,7 @@ import { Reference } from "merkle-reference";
 import { importEntity, resolve, tagWithSchema } from "../sugar/sugar.jsx";
 import { Ref, UiFragment } from "../sugar/zod.js";
 import { llm, RESPONSE } from "../effects/fetch.jsx";
+import { log } from "../sugar/activity.js";
 
 const adjectives = ['indigo', 'azure', 'crimson', 'emerald', 'golden', 'silver', 'obsidian', 'sapphire'];
 const nouns = ['crossfire', 'thunder', 'storm', 'blade', 'phoenix', 'dragon', 'whisper', 'shadow'];
@@ -108,6 +109,7 @@ const shaderEditor = typedBehavior(Shader, {
         const shader = ev.detail.value;
         cmd.add(...Transact.set(self, shader))
         cmd.add(...tagWithSchema(self, Shader))
+        cmd.add(...log(self, 'Edited shader'))
       }),
 
     onModifyWithAI: event("~/on/modify-with-ai")
@@ -252,6 +254,7 @@ export const shaderManager = typedBehavior(
           const currentIndex = shaders.findIndex(s => (s as any).self.toString() === editingShader?.toString());
           if (currentIndex > 0) {
             cmd.add(...Transact.set(self, { editingShader: (shaders[currentIndex - 1] as any).self }));
+            cmd.add(...log(self, 'Show prev shader'));
           }
         }),
 
@@ -262,6 +265,7 @@ export const shaderManager = typedBehavior(
           const currentIndex = shaders.findIndex(s => (s as any).self.toString() === editingShader?.toString());
           if (currentIndex < shaders.length - 1) {
             cmd.add(...Transact.set(self, { editingShader: (shaders[currentIndex + 1] as any).self }));
+            cmd.add(...log(self, 'Show next shader'))
           }
         }),
 

typescript/packages/lookslike-high-level/src/spells/24_quotes.tsx

@@ -0,0 +1,131 @@
+import {
+  h,
+  Session,
+  refer,
+} from "@commontools/common-system";
+import { event, subview, Transact } from "../sugar.js";
+import { Charm, initRules, typedBehavior } from "./spell.jsx";
+import { z } from "zod";
+import { Reference } from "merkle-reference";
+import { importEntity, resolve, tagWithSchema } from "../sugar/sugar.jsx";
+import { Ref, UiFragment } from "../sugar/zod.js";
+import { log } from "../sugar/activity.js";
+
+const Quote = z.object({
+  quote: z.string().max(1024 * 16).describe("The quote text"),
+  source: z.string().max(255).describe("The source of the quote"),
+}).describe('Quote');
+
+const QuoteDB = z.object({
+  focused: Ref.describe("The quote that is currently being edited"),
+  quotes: z.array(Quote).describe("The quotes that have been added"),
+  '~/common/ui/list': UiFragment.describe("The UI fragment for the quotes list, if present")
+})
+
+type EditEvent = {
+  detail: { item: Reference }
+};
+
+type SubmitEvent = {
+  detail: { value: z.infer<typeof Quote> }
+};
+
+const quoteEditor = typedBehavior(Quote, {
+  render: ({ self, quote, source }) => (
+    <div entity={self}>
+      <common-form
+        schema={Quote}
+        value={{ quote, source }}
+        onsubmit="~/on/save"
+      />
+      <details>
+        <pre>{JSON.stringify({ quote, source }, null, 2)}</pre>
+      </details>
+    </div>
+  ),
+  rules: _ => ({
+    onSave: event("~/on/save")
+      .transact(({ self, event }, cmd) => {
+        const ev = Session.resolve<SubmitEvent>(event);
+        let quote = ev.detail.value;
+        if (!quote.source) {
+          quote.source = 'Unknown';
+        }
+
+        cmd.add(...Transact.set(self, quote))
+      }),
+  })
+})
+
+export const quotedb = typedBehavior(
+  QuoteDB.pick({
+    '~/common/ui/list': true
+  }), {
+  render: ({ self, '~/common/ui/list': quoteList }) => (
+    <div entity={self} name="Quotes">
+      <div>
+        <common-form
+          schema={Quote}
+          reset
+          onsubmit="~/on/add-quote"
+        />
+      </div>
+
+      <br />
+      <br />
+      {subview(quoteList)}
+    </div>
+  ),
+  rules: schema => ({
+    init: initRules.init,
+
+    onAddQuote: event("~/on/add-quote")
+      .transact(({ self, event }, cmd) => {
+        const ev = Session.resolve<SubmitEvent>(event);
+        let quote = ev.detail.value;
+        if (!quote.source) {
+          quote.source = 'Unknown';
+        }
+
+        const { self: id, instructions } = importEntity(quote, Quote)
+        cmd.add(...instructions);
+        cmd.add(...Transact.assert(self, { quotes: id }));
+        cmd.add(...log(self, 'Added quote'))
+      }),
+
+    onEditQuote: event("~/on/edit-quote")
+      .transact(({ self, event }, cmd) => {
+        const ev = Session.resolve<EditEvent>(event);
+        cmd.add(...Transact.set(self, { focused: ev.detail.item }))
+        cmd.add(...tagWithSchema(self, Quote))
+      }),
+
+    onDeleteQuote: event("~/on/delete-quote")
+      .transact(({ self, event }, cmd) => {
+        debugger
+        const ev = Session.resolve<EditEvent>(event);
+        cmd.add(...Transact.remove(self, { quotes: ev.detail.item }))
+      }),
+
+    onCloseEditor: event("~/on/close-editor")
+      .with(resolve(QuoteDB.pick({ focused: true })))
+      .transact(({ self, focused }, cmd) => {
+        cmd.add(...Transact.remove(self, { focused }))
+      }),
+
+    renderQuoteList: resolve(QuoteDB.pick({ quotes: true }))
+      .update(({ self, quotes }) => {
+        return [
+          {
+            Upsert: [self, '~/common/ui/list', <common-table
+              schema={Quote}
+              data={quotes}
+              onedit="~/on/edit-quote"
+              ondelete="~/on/delete-quote"
+            /> as any]
+          }
+        ]
+      }).commit(),
+
+  }),
+});

typescript/packages/lookslike-high-level/src/spells/25_activity.tsx

@@ -0,0 +1,47 @@
+import {
+  h,
+  Session,
+  refer,
+} from "@commontools/common-system";
+import { event, subview, Transact } from "../sugar.js";
+import { Charm, initRules, typedBehavior } from "./spell.jsx";
+import { z } from "zod";
+import { Reference } from "merkle-reference";
+import { importEntity, resolve, tagWithSchema } from "../sugar/sugar.jsx";
+import { Ref, UiFragment } from "../sugar/zod.js";
+import { log, LogEntry } from "../sugar/activity.js";
+
+const ActivityLog = z.object({
+  log: z.array(LogEntry).describe('The log of activities')
+})
+
+export const activity = typedBehavior(
+  ActivityLog.pick({
+    log: true
+  }), {
+  render: ({ self, log }) => {
+    debugger
+    return (
+      <table entity={self} title="Activity Log" style="width: 100%; border-spacing: 0">
+        <tbody>
+          {[...log].filter(entry => !isNaN(new Date(entry.modified).getTime())).sort((a, b) => Number(new Date(b.modified)) - Number(new Date(a.modified))).map((entry, i) => (
+            <tr style={`margin-bottom: 8px; background: ${i % 2 === 0 ? '#fff' : '#f5f5f5'}; border-bottom: 1px solid #eee`}>
+              <td style="font-size: 10px; white-space: nowrap; padding: 8px 16px 8px 0">
+                {new Date(entry.modified).toLocaleString()}
+              </td>
+              <td style="padding: 8px 0">{entry.message}</td>
+              <td style="text-align: right; padding: 8px 0">
+                <code style="background: #eee; padding: 2px 6px; border-radius: 4px; font-size: 10px; font-family: monospace">
+                  {entry.target?.toString()}
+                </code>
+              </td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    )
+  },
+  rules: schema => ({
+    init: initRules.init,
+  }),
+});

typescript/packages/lookslike-high-level/src/spells/stickers/describe.tsx

@@ -1,6 +1,7 @@
 import { behavior, $, select } from "@commontools/common-system";
 import { llm, RESPONSE } from "../../effects/fetch.jsx";
 import { field } from "../../sugar.js";
+import { log } from "../../sugar/activity.js";
 
 export const description = field("llmDescription", "");
 
@@ -18,6 +19,7 @@ export const Description = (
         llm(values.self, "my/describe", {
           prompt: promptFn(Object.fromEntries(fields.map(f => [f, values[f]]))),
         }).json(),
+        ...log(values.self, 'Generating description of: ' + promptFn(Object.fromEntries(fields.map(f => [f, values[f]]))))
       ])
       .commit(),
 

typescript/packages/lookslike-high-level/src/sugar/activity.ts

@@ -0,0 +1,30 @@
+import { refer, Reference } from "merkle-reference";
+import z from 'zod'
+import { Ref } from "./zod.js";
+import { importEntity } from "./sugar.jsx";
+import { Instruction } from "@commontools/common-system";
+
+export const activityRef = refer({ activity: 1 })
+
+export const LogEntry = z.object({
+  modified: z.string(),
+  message: z.string(),
+  target: Ref
+}).describe('LogEntry')
+
+export function log(entity: Reference, message: string): Instruction[] {
+  console.log('ACTIVITY', entity, message)
+  const entry = {
+    modified: (new Date()).toString(),
+    message,
+    target: entity
+  }
+
+  const { self, instructions } = importEntity(entry, LogEntry)
+
+  return [
+    ...instructions,
+    { Assert: [activityRef, 'log', self] },
+    { Assert: [entity, 'common/activity', self] }
+  ]
+}

typescript/packages/lookslike-high-level/src/sugar/sugar.tsx

@@ -16,6 +16,7 @@ import { field } from "./query.js";
 import { fromString, Reference } from "merkle-reference";
 import { defaultTo } from "./default.js";
 import { Transact } from "../sugar.js";
+import { log } from "./activity.js";
 
 export function list<T extends z.ZodObject<any>>(
   schema: T