upgrade we and profiles

Cargo.toml

@@ -7,6 +7,8 @@ opt-level = "z"
 [workspace]
 members = ["dnas/*/zomes/coordinator/*", "dnas/*/zomes/integrity/*"]
 
+resolver = "2"
+
 [workspace.dependencies]
 hdi = "0.3.1"
 hdk = "0.2.1"

dnas/whosin/zomes/coordinator/profiles/Cargo.toml

@@ -8,9 +8,4 @@ crate-type = ["cdylib", "rlib"]
 name = "profiles"
 
 [dependencies]
-hdk = { workspace = true }
-
-serde = { workspace = true }
-
-profiles_integrity = { workspace = true } 
-hc_zome_profiles_coordinator = "0.2.0"
+hc_zome_profiles_coordinator = { git = "https://github.com/holochain-open-dev/profiles", branch = "for-hdk-v0.2.3" }

dnas/whosin/zomes/integrity/profiles/Cargo.toml

@@ -8,7 +8,4 @@ crate-type = ["cdylib", "rlib"]
 name = "profiles_integrity"
 
 [dependencies]
-hc_zome_profiles_integrity = "0.2.0"
-hdi = { workspace = true }
-
-serde = { workspace = true }
+hc_zome_profiles_integrity = { git = "https://github.com/holochain-open-dev/profiles", branch = "for-hdk-v0.2.3" }

package.json

@@ -8,6 +8,8 @@
   "scripts": {
     "start": "AGENTS=2 npm run network",
     "online": "AGENTS=2 npm run online:network",
+    "applet-dev": " UI_PORT=8888 npm run applet-devx",
+    "applet-devx": "BPORT=46263 SPORT=46262; concurrently \"hc run-local-services -b $BPORT -s $SPORT\" \"npm start -w ui\" \"./we_dev/we.AppImage  --dev-config we_dev/config.json --agent-num 1 -b http://127.0.0.1:$BPORT -s ws://127.0.0.1:$SPORT\" \"sleep 10 && ./we_dev/we.AppImage --dev-config we_dev/config.json --agent-num 2 -b http://127.0.0.1:$BPORT -s ws://127.0.0.1:$SPORT\"",
     "network": "hc s clean && npm run build:happ && UI_PORT=8888 concurrently \"npm start -w ui\" \"npm run launch:happ\" \"holochain-playground\"",
     "online:network": "hc s clean && npm run build:happ && UI_PORT=8888 concurrently \"npm start -w ui\" \"npm run launch:online\" \"holochain-playground\"",
     "test": "npm run build:zomes && hc app pack workdir --recursive && npm t -w tests",

ui/package.json

@@ -8,9 +8,9 @@
     "package": "npm run build && cd dist && bestzip ../dist.zip *"
   },
   "dependencies": {
-    "@holochain-open-dev/profiles": "^0.12.1",
+    "@holochain-open-dev/profiles": "^0.17.3",
     "@holochain/client": "^0.12.2",
-    "@lightningrodlabs/we-applet": "0.9.0",
+    "@lightningrodlabs/we-applet": "0.12.2",
     "@material/mwc-button": "^0.27.0",
     "@material/mwc-checkbox": "^0.27.0",
     "@material/mwc-circular-progress": "^0.27.0",

ui/src/App.svelte

@@ -4,33 +4,21 @@
   import { AppAgentWebsocket } from '@holochain/client';
   import '@material/mwc-circular-progress';
   import { view, viewHash, navigate } from './store.js';
-  import { clientContext } from './contexts';
+  import { clientContext, profilesStoreContext } from './contexts';
+  import { ProfilesStore, ProfilesClient } from "@holochain-open-dev/profiles";
   import Header from './whosin/coordinator/Header.svelte';
   import CreateCoordination from './whosin/coordinator/CreateCoordination.svelte';
   import AllCoordinations from './whosin/coordinator/AllCoordinations.svelte';
   import CoordinationDetail from './whosin/coordinator/CoordinationDetail.svelte';
   import AllNotifications from './whosin/coordinator/AllNotifications.svelte';
   import Instructions from './whosin/coordinator/Instructions.svelte';
   import MyCoordinations from './whosin/coordinator/MyCoordinations.svelte';
-  import { WeClient, isWeContext } from '@lightningrodlabs/we-applet';
   import CreateTwilioCredentials from './whosin/notifications/CreateTwilioCredentials.svelte';
   import CreateContact from './whosin/notifications/CreateContact.svelte';
   import NotificationsHandler from './whosin/notifications/NotificationsHandler.svelte';
   import Holochain from "./assets/holochain.png";
+  import { WeClient, isWeContext, initializeHotReload, type HrlWithContext, type Hrl } from '@lightningrodlabs/we-applet';  
 
-  // import {
-  //   ProfilesStore,
-  //   ProfilesClient,
-  //   CreateProfile,
-  //   ProfilePrompt,
-  //   profilesStoreContext,
-  //   MyProfile,
-  //   ProfilesContext,
-  //   AgentAvatar,
-  //   ProfileDetail,
-  //   ListProfiles,
-  // } from '@holochain-open-dev/profiles';
-  
   const dispatch = createEventDispatcher();
 
   let client: AppAgentClient | undefined;
@@ -40,37 +28,10 @@
   let currentHash: Uint8Array;
   let notifier: AgentPubKey | undefined;
   let dna;
+  let profilesStore = undefined;
 
   $: client, loading, store, notifier, dna;
 
-  // if (!customElements.get('profiles-context')){
-  //   customElements.define('profiles-context', ProfilesContext)
-  // }
-
-  // if (!customElements.get('my-profile')){
-  //   customElements.define('my-profile', MyProfile)
-  // }
-
-  // if (!customElements.get('profile-prompt')){
-  //   customElements.define('profile-prompt', ProfilePrompt)
-  // }
-
-  // if (!customElements.get('agent-avatar')){
-  //   customElements.define('agent-avatar', AgentAvatar)
-  // }
-
-  // if (!customElements.get('agent-avatar')){
-  //   customElements.define('agent-avatar', AgentAvatar)
-  // }
-  
-  // if (!customElements.get('profile-detail')){
-  //   customElements.define('profile-detail', ProfileDetail)
-  // }
-
-  // if (!customElements.get('list-profiles')){
-  //   customElements.define('list-profiles', ListProfiles)
-  // }
-
   async function checkIfNew() {
       try {
           const records = await client
@@ -113,6 +74,14 @@
   }
 
   onMount(async () => {
+    if ((import.meta as any).env.DEV) {
+      try {
+        await initializeHotReload();
+      } catch (e) {
+        console.warn("Could not initialize applet hot-reloading. This is only expected to work in a We context in dev mode.")
+      }
+    }
+
     if (isWeContext()) {
       const weClient = await WeClient.connect();
       console.log(weClient.renderInfo)
@@ -123,10 +92,18 @@
       ) throw new Error("This Applet only implements the applet main view.");
 
       client = weClient.renderInfo.appletClient;
-      // const profilesClient = weClient.renderInfo.profilesClient;
+      console.log("client... ", client)
+      profilesStore = new ProfilesStore(weClient.renderInfo.profilesClient, {
+        avatarMode: "avatar-optional",
+        minNicknameLength: 3,
+      })
     } else {
       // We pass '' as url because it will dynamically be replaced in launcher environments
       client = await AppAgentWebsocket.connect('', 'whosin');
+      profilesStore = new ProfilesStore(new ProfilesClient(client, 'whosin'), {
+        avatarMode: "avatar-optional",
+        minNicknameLength: 3,
+      });
     }
     console.log("client... ", client.appInfo())
 
@@ -176,6 +153,10 @@
     getClient: () => client,
   });
 
+  setContext(profilesStoreContext, {
+    getProfileStore: () => profilesStore,
+  });
+
   view.subscribe(value => {
     currentView = value;
   });

ui/src/contexts.ts

@@ -1,2 +1,2 @@
 export const clientContext = 'appAgentClient';
-
+export const profilesStoreContext = 'profilesStore'

ui/src/whosin/coordinator/Avatar.svelte

@@ -0,0 +1,66 @@
+<script lang="ts">
+    import { encodeHashToBase64, type AgentPubKey } from "@holochain/client";
+    import "@holochain-open-dev/profiles/dist/elements/agent-avatar.js";
+    import { getContext } from "svelte";
+    import type { ProfilesStore } from "@holochain-open-dev/profiles";
+    import SvgIcon from "./SvgIcon.svelte";
+    import { profilesStoreContext } from '../../contexts';
+    
+    let profilesStore: ProfilesStore = (getContext(profilesStoreContext) as any).getProfileStore();
+    
+    export let agentPubKey: AgentPubKey
+    export let size = 32
+    export let namePosition = "row"
+    export let nameColor = "rgba(86, 94, 109, 1.0)"
+    export let showAvatar = true
+    export let showNickname = true
+    export let placeholder = false
+    
+    $: agentPubKey
+    $: agentPubKeyB64 = encodeHashToBase64(agentPubKey)
+    $: profile = profilesStore.profiles.get(agentPubKey)
+    $: nickname = $profile.status=="complete" && $profile.value ? $profile.value.entry.nickname : agentPubKeyB64.slice(5,9)+"..."
+    
+    </script>
+
+    <div class="avatar-{namePosition}"
+        >
+        {#if $profile.status == "pending"}
+        ( ? )
+        {:else if $profile.status == "complete"}
+            <!-- {JSON.stringify($profile.value.entry.fields.avatar)} -->
+
+            {#if showAvatar}
+                {#if placeholder && !$profile.value.entry.fields.avatar}
+                    <SvgIcon color="#fff" icon=faUser size="" style="margin-left:5px;margin-right:5px"></SvgIcon>
+                {:else}
+                <!-- <div title={nickname}> -->
+                    <!-- <SvgIcon color="black" icon=faUser size="" style="margin-left:5px;margin-right:5px"></SvgIcon> -->
+                    <agent-avatar title={nickname} disable-tooltip={true} disable-copy={true} size={size} agent-pub-key="{agentPubKeyB64}"></agent-avatar>
+                <!-- </div> -->
+                {/if}
+            {/if}
+            {#if showNickname}
+                <div class="nickname" style="color: {nameColor}">{ nickname }</div>
+            {/if}
+        {/if}
+    </div>
+
+    <style>
+        .avatar-column {
+            align-items: center;
+            display:flex;
+            flex-direction: column;
+        }
+        .avatar-row {
+            display:inline-flex;
+            flex-direction: row;
+            justify-content:center;
+            position: relative;
+            height: 100%;
+            align-items: center;
+        }
+        .avatar-row .nickname{
+            margin-left: 0.5em;
+        }
+    </style>

ui/src/whosin/coordinator/CoordinationDetail.svelte

@@ -24,11 +24,11 @@
   let coordination: Coordination | undefined;
   let coordRoles; //: Coordrole[] | undefined;
   let sponsors;
-  let commitingInProcess = false;
+  let committingInProcess = false;
   
   let errorSnackbar: Snackbar;
     
-  $: error, loading, coordination, sponsors, commitingInProcess;
+  $: error, loading, coordination, sponsors, committingInProcess;
   
   // onMount(() => fetchCoordination());
   // onMount(() => fetchRoles());
@@ -180,7 +180,7 @@
   }
   
   async function commitMe(coordRole) {
-    commitingInProcess = true;
+    committingInProcess = true;
     let coordRoleHash = coordRole;
     
     try {
@@ -196,10 +196,11 @@
       fetchRoles();
       // navigate("all-coordinations", {})
       coordRole.committed = true;
+      committingInProcess = false;
     } catch (e: any) {
       fetchRoles();
       coordRole.committed = true;
-      commitingInProcess = false;
+      committingInProcess = false;
       console.log(e)
       errorSnackbar.labelText = `Error commiting to the coordination: ${e.data.data}`;
       errorSnackbar.show();
@@ -291,7 +292,7 @@
         <!-- {JSON.stringify(role.committed)} -->
         <!-- {JSON.stringify(role.participants.includes(client.myPubKey))} -->
 
-        {#if commitingInProcess}
+        {#if committingInProcess}
         <div class="commit" style="padding: 0; height: fit-content">
           <mwc-circular-progress indeterminate></mwc-circular-progress>
         </div>