Fix imported persona avatar handling

Author: klopez4212

desktop/src-tauri/src/managed_agents/persona_card.rs

@@ -13,6 +13,7 @@ pub struct ParsedPersonaPreview {
     pub display_name: String,
     pub system_prompt: String,
     pub avatar_data_url: Option<String>,
+    pub avatar_ref: Option<String>,
     pub runtime: Option<String>,
     pub model: Option<String>,
     pub provider: Option<String>,
@@ -81,6 +82,7 @@ pub fn parse_png_persona(png_bytes: &[u8]) -> Result<ParsedPersonaPreview, Strin
         display_name: fields.display_name,
         system_prompt: fields.system_prompt,
         avatar_data_url,
+        avatar_ref: None,
         runtime: fields.runtime,
         model: fields.model,
         provider: fields.provider,
@@ -240,6 +242,7 @@ pub fn parse_json_persona(json_bytes: &[u8]) -> Result<ParsedPersonaPreview, Str
         display_name: fields.display_name,
         system_prompt: fields.system_prompt,
         avatar_data_url: fields.avatar_url,
+        avatar_ref: None,
         runtime: fields.runtime,
         model: fields.model,
         provider: fields.provider,
@@ -304,6 +307,7 @@ pub fn parse_md_persona(md_bytes: &[u8]) -> Result<ParsedPersonaPreview, String>
         display_name: config.display_name,
         system_prompt: config.prompt,
         avatar_data_url: None, // .persona.md avatars are paths, not data URIs
+        avatar_ref: config.avatar,
         runtime: config.runtime,
         model,
         provider: None, // .persona.md format does not carry llmProvider
@@ -405,6 +409,7 @@ pub fn parse_zip_pack(zip_bytes: &[u8]) -> Result<ParsePersonaFilesResult, Strin
             display_name: p.display_name.clone(),
             system_prompt: p.system_prompt.clone(),
             avatar_data_url: None,
+            avatar_ref: p.avatar.clone(),
             runtime: p.runtime.clone(),
             model: p.model.clone(),
             provider: None, // persona packs do not carry llmProvider
@@ -834,6 +839,16 @@ mod tests {
         assert!(result.source_file.is_empty());
     }
 
+    #[test]
+    fn parse_md_carries_avatar_ref() {
+        let md = b"---\nname: goosey\ndisplay_name: Goosey\navatar: app-avatar:gloopies-19\ndescription: A goose persona.\n---\nYou are Goosey.\n";
+        let result = parse_md_persona(md).unwrap();
+
+        assert_eq!(result.display_name, "Goosey");
+        assert!(result.avatar_data_url.is_none());
+        assert_eq!(result.avatar_ref.as_deref(), Some("app-avatar:gloopies-19"));
+    }
+
     #[test]
     fn parse_json_round_trip_no_avatar() {
         let bytes =

desktop/src/features/agents/ui/BatchImportDialog.tsx

@@ -93,7 +93,7 @@ export function BatchImportDialog({
       try {
         await createPersona({
           displayName: persona.displayName,
-          avatarUrl: persona.avatarDataUrl ?? undefined,
+          avatarUrl: persona.avatarDataUrl ?? persona.avatarRef ?? undefined,
           systemPrompt: persona.systemPrompt,
           runtime: persona.runtime ?? undefined,
           model: persona.model ?? undefined,
@@ -178,7 +178,7 @@ export function BatchImportDialog({
                         onClick={(e: React.MouseEvent) => e.stopPropagation()}
                       />
                       <ProfileAvatar
-                        avatarUrl={persona.avatarDataUrl}
+                        avatarUrl={persona.avatarDataUrl ?? persona.avatarRef}
                         className="h-8 w-8 rounded-lg text-xs"
                         label={persona.displayName}
                       />

desktop/src/features/agents/ui/managedAgentAvatar.test.mjs

@@ -0,0 +1,44 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+
+import { resolveManagedAgentAvatarUrl } from "./managedAgentAvatar.ts";
+
+test("resolveManagedAgentAvatarUrl uploads data image URIs", async () => {
+  const uploaded = await resolveManagedAgentAvatarUrl(
+    "data:image/png;base64,aGVsbG8=",
+    async (bytes) => {
+      assert.deepEqual(bytes, [104, 101, 108, 108, 111]);
+      return {
+        url: "https://relay.example/avatar.png",
+        sha256: "hash",
+        size: bytes.length,
+        type: "image/png",
+        uploaded: 1,
+      };
+    },
+  );
+
+  assert.equal(uploaded, "https://relay.example/avatar.png");
+});
+
+test("resolveManagedAgentAvatarUrl passes non-data URLs through", async () => {
+  const uploaded = await resolveManagedAgentAvatarUrl(
+    " https://relay.example/already-hosted.png ",
+    async () => {
+      throw new Error("should not upload hosted avatars");
+    },
+  );
+
+  assert.equal(uploaded, "https://relay.example/already-hosted.png");
+});
+
+test("resolveManagedAgentAvatarUrl omits invalid data image URIs", async () => {
+  const uploaded = await resolveManagedAgentAvatarUrl(
+    "data:image/png;base64,",
+    async () => {
+      throw new Error("should not upload invalid data URIs");
+    },
+  );
+
+  assert.equal(uploaded, undefined);
+});

desktop/src/features/agents/ui/managedAgentAvatar.ts

@@ -0,0 +1,29 @@
+import { type BlobDescriptor, uploadMediaBytes } from "@/shared/api/tauri";
+
+type UploadMediaBytes = (
+  data: number[],
+  filename?: string,
+) => Promise<BlobDescriptor>;
+
+export async function resolveManagedAgentAvatarUrl(
+  avatarUrl: string | null | undefined,
+  upload: UploadMediaBytes = uploadMediaBytes,
+): Promise<string | undefined> {
+  const resolvedAvatarUrl = avatarUrl?.trim() || undefined;
+  if (!resolvedAvatarUrl?.startsWith("data:image/")) {
+    return resolvedAvatarUrl;
+  }
+
+  try {
+    const [, b64] = resolvedAvatarUrl.split(",", 2);
+    if (!b64) {
+      throw new Error("empty data URI payload");
+    }
+    const bytes = Array.from(atob(b64), (char) => char.charCodeAt(0));
+    const blob = await upload(bytes);
+    return blob.url;
+  } catch (err) {
+    console.warn("Avatar upload failed, proceeding without avatar:", err);
+    return undefined;
+  }
+}

desktop/src/features/agents/ui/personaDialogState.ts

@@ -90,7 +90,7 @@ export function importPersonaDialogState(
     submitLabel: "Create agent",
     initialValues: {
       displayName: persona.displayName,
-      avatarUrl: persona.avatarDataUrl ?? "",
+      avatarUrl: persona.avatarDataUrl ?? persona.avatarRef ?? "",
       systemPrompt: persona.systemPrompt,
       runtime: persona.runtime ?? undefined,
       model: persona.model ?? undefined,

desktop/src/features/agents/ui/personaImportPlan.test.mjs

@@ -28,6 +28,7 @@ function createPreview(overrides = {}) {
     displayName: "Alice",
     systemPrompt: "Be helpful.",
     avatarDataUrl: null,
+    avatarRef: null,
     runtime: null,
     model: null,
     namePool: [],
@@ -84,6 +85,17 @@ test("buildPersonaImportPlan detects avatar change", () => {
   assert.equal(plan.fields[0]?.field, "avatarUrl");
 });
 
+test("buildPersonaImportPlan detects avatar ref changes", () => {
+  const plan = buildPersonaImportPlan({
+    persona: createPersona({ avatarUrl: null }),
+    preview: createPreview({ avatarRef: "app-avatar:gloopies-19" }),
+  });
+
+  assert.equal(plan.fields.length, 1);
+  assert.equal(plan.fields[0]?.field, "avatarUrl");
+  assert.equal(plan.fields[0]?.importedValue, "app-avatar:gloopies-19");
+});
+
 test("buildPersonaImportPlan detects runtime change", () => {
   const plan = buildPersonaImportPlan({
     persona: createPersona({ runtime: "goose" }),

desktop/src/features/agents/ui/personaImportPlan.ts

@@ -124,7 +124,9 @@ export function buildPersonaImportPlan({
   }
 
   const existingAvatar = normalizeOptionalText(persona.avatarUrl);
-  const importedAvatar = normalizeOptionalText(preview.avatarDataUrl);
+  const importedAvatar = normalizeOptionalText(
+    preview.avatarDataUrl ?? preview.avatarRef,
+  );
   if (existingAvatar !== importedAvatar) {
     fields.push({
       field: "avatarUrl",

desktop/src/features/agents/ui/usePersonaActions.ts

@@ -32,6 +32,7 @@ import {
   importPersonaDialogState,
   type PersonaDialogState,
 } from "./personaDialogState";
+import { resolveManagedAgentAvatarUrl } from "./managedAgentAvatar";
 import { usePersonaImportActions } from "./usePersonaImportActions";
 
 type PersonaFeedbackSurface = "catalog" | "library";
@@ -111,6 +112,7 @@ export function usePersonaActions() {
         }
 
         const persona = await createPersonaMutation.mutateAsync(input);
+        const avatarUrl = await resolveManagedAgentAvatarUrl(persona.avatarUrl);
         const agentInput: CreateManagedAgentInput = {
           name: persona.displayName,
           acpCommand: "buzz-acp",
@@ -119,9 +121,8 @@ export function usePersonaActions() {
           mcpCommand: runtime.mcpCommand ?? "",
           personaId: persona.id,
           systemPrompt: persona.systemPrompt,
-          avatarUrl: persona.avatarUrl ?? undefined,
+          avatarUrl,
           model: persona.model ?? undefined,
-          envVars: persona.envVars,
           spawnAfterCreate: true,
           startOnAppLaunch: true,
           backend: { type: "local" },

desktop/src/features/agents/ui/usePersonaImportActions.ts

@@ -119,7 +119,7 @@ export function usePersonaImportActions(
           ? preview.systemPrompt
           : existing.systemPrompt,
         avatarUrl: selectedFieldSet.has("avatarUrl")
-          ? (preview.avatarDataUrl ?? undefined)
+          ? (preview.avatarDataUrl ?? preview.avatarRef ?? undefined)
           : (existing.avatarUrl ?? undefined),
         runtime: selectedFieldSet.has("runtime")
           ? (preview.runtime ?? undefined)

desktop/src/shared/api/tauriPersonas.ts

@@ -10,6 +10,7 @@ type RawParsedPersonaPreview = {
   display_name: string;
   system_prompt: string;
   avatar_data_url: string | null;
+  avatar_ref: string | null;
   runtime: string | null;
   model: string | null;
   provider: string | null;
@@ -32,6 +33,7 @@ export type ParsedPersonaPreview = {
   displayName: string;
   systemPrompt: string;
   avatarDataUrl: string | null;
+  avatarRef: string | null;
   runtime: string | null;
   model: string | null;
   provider: string | null;
@@ -154,7 +156,8 @@ export async function parsePersonaFiles(
     personas: raw.personas.map((p) => ({
       displayName: p.display_name,
       systemPrompt: p.system_prompt,
-      avatarDataUrl: p.avatar_data_url,
+      avatarDataUrl: p.avatar_data_url ?? null,
+      avatarRef: p.avatar_ref ?? null,
       runtime: p.runtime,
       model: p.model,
       provider: p.provider,