updates to use syn workspace change notification for new boards

apps/launcher/ui/package.json

@@ -17,7 +17,7 @@
         "@holochain-open-dev/cell-client": "0.7.3",
         "@holochain-open-dev/core-types": "0.4.1",
         "@holochain-open-dev/utils": "0.3.2",
-        "@holochain-syn/store": "0.1.7",
+        "@holochain-syn/store": "0.1.9",
         "@ts-stack/markdown": "^1.4.0",
         "lodash": "^4.17.21",
         "sirv-cli": "^1.0.0",

libs/ui/package.json

@@ -45,7 +45,7 @@
     "@holochain-open-dev/cell-client": "0.7.3",
     "@holochain-open-dev/core-types": "0.4.1",
     "@holochain-open-dev/utils": "0.3.2",
-    "@holochain-syn/store": "0.1.7",
+    "@holochain-syn/store": "0.1.9",
     "@ts-stack/markdown": "^1.4.0",
     "lodash": "^4.17.21",
     "svelte-fa": "^3.0.3",

libs/ui/src/lib/BoardPane.svelte

@@ -36,7 +36,7 @@
   let tsStore: TalkingStickiesStore = getStore();
 
   $: index = tsStore.activeBoardIndex;
-  $: state = tsStore.getBoardState($index);
+  $: state = tsStore.getReadableBoardState($index);
   $: stickies = $state ? $state.stickies : undefined;
   $: sortStickies = sortOption
     ? sortBy((sticky) => countVotes(sticky.votes, sortOption) * -1)

libs/ui/src/lib/Boards.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { createEventDispatcher, getContext } from 'svelte'
+  import { getContext } from 'svelte'
   import { get } from 'svelte/store';
   import PlusIcon from './icons/PlusIcon.svelte'
   import ImportIcon from './icons/ImportIcon.svelte';
@@ -11,13 +11,25 @@
   import { isEqual } from 'lodash'
   import { cloneDeep } from "lodash";
   import { Group, VoteType, DEFAULT_VOTE_TYPES, Board } from './board';
-  import type { WorkspaceParticipant, WorkspaceStore } from '@holochain-syn/store';
 
  
   const { getStore } :any = getContext('tsStore');
 
   const store:TalkingStickiesStore = getStore();
+
   $: boards = store.boards;
+  store.addTickler((board, newName)=> {
+    let boards = get(store.boards)
+    for (let i = 0;i<boards.length; i+=1) {
+      const b = boards[i]
+      if (b.hash() == board.hash()) {
+        store.boards.update((boards) => {
+          boards[i] = board
+          return boards
+        })
+      }
+    }
+  })
   $: archivedBoards = store.archivedBoards;
   $: index = store.activeBoardIndex
 
@@ -70,21 +82,22 @@
 
   const updateBoard = i => async (name: string, groups: Group[], voteTypes: VoteType[]) => {
     let changes = []
-    if (get($boards[i].name) != name) {
+    const state = $boards[i].state()
+    if (state.name != name) {
       console.log("updating board name to ",name)
       changes.push(
         {
           type: 'set-name',
           name: name
         })
     }
-    if (!isEqual(groups, get($boards[i].workspace.state).groups)) {
+    if (!isEqual(groups, state.groups)) {
       console.log("with groups:", groups)
       changes.push({type: 'set-groups',
          groups: groups
         })
     }
-    if (!isEqual(voteTypes, get($boards[i].workspace.state).voteTypes)) {
+    if (!isEqual(voteTypes, state.voteTypes)) {
       console.log("with voteTypes:", voteTypes)
       changes.push({type: 'set-vote-types',
         voteTypes: voteTypes
@@ -115,7 +128,7 @@
   }
 
   const getStats = (board: Board) => {
-    const participants = get(board.workspace.participants)
+    const participants = get(board.participants())
     return `active: ${participants.active.length}, idle: ${participants.idle.length}, offline: ${participants.offline.length}`
   }
 </script>
@@ -205,7 +218,7 @@
           {:else}
             <div class="board {$index === i ? "selected":""}" on:click={() => selectBoard(i)} title={getStats(board)}>
               {get(board.name)}
-              <div class="board-button" on:click={editBoard(i, get(board.name), get(board.workspace.state).groups, get(board.workspace.state).voteTypes)}><PencilIcon /></div>
+              <div class="board-button" on:click={editBoard(i, get(board.name), board.state().groups, board.state().voteTypes)}><PencilIcon /></div>
             </div>
           {/if}
         {/each}

libs/ui/src/lib/Controller.svelte

@@ -101,7 +101,7 @@
     .app {
       grid-column: 1/3;
       grid-row: 1/2;
-      width: 100%;
+      /* width: 100%; */
       margin: 20px;
     }
     :global(:root) {

libs/ui/src/lib/SortSelector.svelte

@@ -17,7 +17,7 @@
   let tsStore: TalkingStickiesStore = getStore();
 
   $: index = tsStore.activeBoardIndex;
-  $: state = tsStore.getBoardState($index);
+  $: state = tsStore.getReadableBoardState($index);
 
 </script>
 

libs/ui/src/lib/board.ts

@@ -1,7 +1,8 @@
 import type { WorkspaceStore } from "@holochain-syn/store";
 import type { TalkingStickiesDelta, TalkingStickiesGrammar, TalkingStickiesState } from "./grammar";
-import { Readable, derived, get } from "svelte/store";
+import { type Readable, derived, get } from "svelte/store";
 import { v1 as uuidv1 } from "uuid";
+import type { EntryHash } from "@holochain/client";
 
 export const DEFAULT_VOTE_TYPES = [
     {type: "1", emoji: "🗨", toolTip: "I want to talk about this one.", maxVotes: 3},
@@ -18,10 +19,12 @@ export class VoteType {
 
 export class Board {
     name: Readable<string>
-    voteTypes: Array<VoteType>
     constructor(public workspace: WorkspaceStore<TalkingStickiesGrammar>) {
         this.name = derived(workspace.state, state => state.name)
     }
+    hash() : EntryHash {
+        return this.workspace.workspaceHash
+    }
     close() {
         this.workspace.leaveWorkspace()
     }
@@ -32,6 +35,12 @@ export class Board {
         console.log("REQUESTING CHANGES: ", deltas)
         this.workspace.requestChanges(deltas)
     }
+    participants()  {
+        return this.workspace.participants
+    }
+    async commitChanges() {
+        this.workspace.commitChanges()
+    }
 }
 
 export class ArchivedBoard {

libs/ui/src/lib/talkingStickiesStore.ts

@@ -28,7 +28,9 @@ export class TalkingStickiesStore {
     boards: Writable<Array<Board>> = writable([]);
     archivedBoards: Writable<Dictionary<ArchivedBoard>> = writable({});
     activeBoardIndex: Writable<number|undefined> = writable(undefined)
-
+    createdBoards: Array<EntryHash> = []
+    ticklers = []
+    updating = false
     synStore: SynStore;
     cellClient: CellClient;
     myAgentPubKey(): AgentPubKeyB64 {
@@ -47,6 +49,44 @@ export class TalkingStickiesStore {
         );
         //@ts-ignore
         this.synStore = new SynStore(new SynClient(this.cellClient))
+        this.synStore.knownWorkspaces.subscribe( async (workspaces) => {
+            if (this.updating) {
+                console.log(`${workspaces.keys().length} WORKSPACES FOUND but allready updating`, workspaces)
+                return
+            }
+            this.updating = true
+            console.log(`${workspaces.keys().length} WORKSPACES FOUND`, workspaces)
+            const boards = get(this.boards)
+
+            for (const [workspaceHash, workspace] of workspaces.entries()) {
+                const boardIndex = boards.findIndex((board) => isEqual(board.hash(), workspaceHash))
+                if (boardIndex < 0) {
+                    console.log("found board we don't have")
+                    const getWorkspaceTip = await this.synStore.client.getWorkspaceTip(workspaceHash)
+                    const commit = await this.synStore.client.getCommit(getWorkspaceTip)
+                    if (commit) {
+                        const state: TalkingStickiesState = stateFromCommit(commit) as TalkingStickiesState
+                        if (state.status == "archived") {
+                            this.addArchivedBoard(workspaceHash, state)
+                            console.log("added archived workspace:", state)
+                            continue
+                        }    
+                    }    
+                    console.log(`ATTEMPTING TO JOIN ${workspace.name}: ${serializeHash(workspaceHash)}`)
+                    const workspaceStore = await this.synStore.joinWorkspace(workspaceHash, talkingStickiesGrammar)
+                    this.newBoard(workspaceStore)
+                    if (this.createdBoards.findIndex((hash) => isEqual(hash, workspaceHash)) >= 0) {
+                        // we created this board so activate it!
+                        console.log("ACTIVATING:", get(this.boards).length-1)
+                        this.activeBoardIndex.update((n) => {return get(this.boards).length-1} )
+                    }
+                    console.log("joined workspace:", workspaceStore)
+                } else {
+                    console.log("allready joined")
+                }
+            }
+            this.updating = false
+        })
     }
 
     async requestBoardChanges(index, deltas) {
@@ -59,7 +99,8 @@ export class TalkingStickiesStore {
     async requestChange(deltas) {
         this.requestBoardChanges(get(this.activeBoardIndex), deltas)
     }
-    getBoardState(index: number | undefined) : Readable<TalkingStickiesState> | undefined {
+    getReadableBoardState(index: number | undefined) : Readable<TalkingStickiesState> | undefined {
+        console.log("getting board state", index, this.boards[index], this.boards )
         if (index == undefined) return undefined
         return get(this.boards)[index].workspace.state
     }
@@ -94,7 +135,7 @@ export class TalkingStickiesStore {
         const board = get(this.boards)[index]
         if (board) {
             await board.requestChanges([{type:"set-status",status:"archived"}])
-            this.addArchivedBoard(board.workspace.workspaceHash, board.state())
+            this.addArchivedBoard(board.hash(), board.state())
             //board.close()
             this.boards.update((boards)=> {
                 boards.splice(index,1)
@@ -134,7 +175,10 @@ export class TalkingStickiesStore {
         const workspaceHash = await this.synStore.createWorkspace({name:`${Date.now()}`, meta: undefined}, hash)
         const workspaceStore = await this.synStore.joinWorkspace(workspaceHash, talkingStickiesGrammar);
 
-        const board = this.newBoard(workspaceStore)
+        // we don't create the board here because we want the same board creation code to run when a
+        // new workspace  notification comes from a signal from someone else, so we have to distinguis this
+        // my just caching the workspaces that we created.
+        this.createdBoards.push(workspaceHash)
         if (options !== undefined) {
             let changes = []
             if (options.name) {
@@ -164,14 +208,20 @@ export class TalkingStickiesStore {
                     voteTypes: options.voteTypes
                 })
             }
-            if (changes.length > 0)
-                board.requestChanges(changes)
+            if (changes.length > 0) {
+                workspaceStore.requestChanges(changes)
+                await workspaceStore.commitChanges()
+            }
         }
-        this.activeBoardIndex.update((n) => {return get(this.boards).length-1} )
     }
-
-    newBoard(workspace: WorkspaceStore<TalkingStickiesGrammar>) : Board {
+    addTickler(fn) {
+        this.ticklers.push(fn)
+    }
+    newBoard(workspace: WorkspaceStore<TalkingStickiesGrammar>): Board{
         const board = new Board(workspace)
+        board.name.subscribe( (val) => {
+            this.ticklers.forEach((fn)=>fn(board, val))
+        })
         this.boards.update((boards)=> {
             boards.push(board)
             return boards
@@ -180,31 +230,8 @@ export class TalkingStickiesStore {
     }
 
     async joinExistingWorkspaces() : Promise<any> {
+        console.log("FETCHING ALL WORKSPACES")
         const workspaces = get(await this.synStore.fetchAllWorkspaces());
-        console.log(`${workspaces.keys().length} WORKSPACES FOUND`, workspaces)    
-        for (const [workspaceHash, workspace] of workspaces.entries()) {
-            console.log(`ATTEMPTING TO JOIN ${workspace.name}: ${serializeHash(workspaceHash)}`)
-            const getWorkspaceTip = await this.synStore.client.getWorkspaceTip(workspaceHash)
-            const commit = await this.synStore.client.getCommit(getWorkspaceTip)
-            if (commit) {
-                const state: TalkingStickiesState = stateFromCommit(commit) as TalkingStickiesState
-                if (state.status == "archived") {
-                    this.addArchivedBoard(workspaceHash, state)
-                    console.log("added archived workspace:", state)
-                    continue
-                }    
-            }
-
-            const boards = get(this.boards)
-            const boardIndex = boards.findIndex((board) => isEqual(board.workspace.workspaceHash, workspaceHash))
-            if (boardIndex < 0) {
-                const workspaceStore = await this.synStore.joinWorkspace(workspaceHash, talkingStickiesGrammar)
-                this.newBoard(workspaceStore)
-                console.log("joined workspace:", workspaceStore)
-            } else {
-                console.log("allready joined")
-            }
-        }
         return workspaces
       }
 }

libs/zomes/syn/Cargo.toml

@@ -12,4 +12,4 @@ chrono = { version = "0.4.22", default-features = false, features = ["clock", "s
 derive_more = "0"
 serde = "1"
 
-hc_zome_syn_coordinator = {git = "https://github.com/holochain/syn", branch = "expose-client"}
+hc_zome_syn_coordinator = {git = "https://github.com/holochain/syn", rev = "171d08c79aed2b89869a4198b9cb7522dc6e03ca"}

libs/zomes/syn_integrity/Cargo.toml

@@ -12,4 +12,4 @@ chrono = { version = "0.4.22", default-features = false, features = ["clock", "s
 derive_more = "0"
 serde = "1"
 
-hc_zome_syn_integrity = {git = "https://github.com/holochain/syn", branch = "expose-client"}
+hc_zome_syn_integrity = {git = "https://github.com/holochain/syn", rev = "171d08c79aed2b89869a4198b9cb7522dc6e03ca"}