Update bot

backend/canisters/user_index/api/src/main.rs

@@ -64,5 +64,6 @@ fn main() {
     generate_ts_method!(user_index, submit_proof_of_unique_personhood);
     generate_ts_method!(user_index, suspend_user);
     generate_ts_method!(user_index, unsuspend_user);
+    generate_ts_method!(user_index, update_bot);
     generate_ts_method!(user_index, update_diamond_membership_subscription);
 }

frontend/app/src/components/Input.svelte

@@ -15,6 +15,8 @@
         children?: Snippet;
         onblur?: () => void;
         onfocus?: () => void;
+        oninput?: () => void;
+        onenter?: () => void;
     }
 </script>
 
@@ -40,6 +42,8 @@
         pattern = undefined,
         onblur = undefined,
         onfocus = undefined,
+        oninput = undefined,
+        onenter = undefined,
         children,
     }: InputProps = $props();
 
@@ -61,6 +65,7 @@
             value = parseInt(e.currentTarget.value, 10);
         }
         dispatch("change", value);
+        oninput?.();
     };
 
     export function setValue(text: string) {
@@ -70,6 +75,7 @@
     function keyDown(e: KeyboardEvent) {
         if (e.key === "Enter") {
             dispatch("enter");
+            onenter?.();
         }
     }
 

frontend/app/src/components/bots/AutoBotBuilder.svelte

@@ -2,13 +2,13 @@
     import Reload from "svelte-material-icons/Reload.svelte";
     import {
         validEndpoint,
-        emptyBotInstance,
         OpenChat,
         validateBot,
         ValidationErrors,
         type ExternalBot,
         type SlashCommandSchema,
         type ValidationErrorMessages,
+        userStore,
     } from "openchat-client";
     import { i18nKey } from "../../i18n/i18n";
     import Input from "../Input.svelte";
@@ -23,19 +23,21 @@
     import HoverIcon from "../HoverIcon.svelte";
     import { iconSize } from "../../stores/iconSize";
     import CommandViewer from "./CommandViewer.svelte";
+    import SingleUserSelector from "../home/SingleUserSelector.svelte";
 
     const client = getContext<OpenChat>("client");
 
     interface Props {
         valid: boolean;
         onUpdate: (bot: ExternalBot) => void;
+        candidate: ExternalBot;
+        nameDirty: boolean;
     }
 
-    let { valid = $bindable(), onUpdate }: Props = $props();
+    let { valid = $bindable(), onUpdate, candidate, nameDirty }: Props = $props();
     let selectedCommand = $state<SlashCommandSchema | undefined>(undefined);
     let selectedCommandIndex = $state<number | undefined>(undefined);
     let debug = $state(false);
-    let candidate = $state<ExternalBot>(emptyBotInstance());
     let schemaLoaded = $state(false);
     let schemaLoading = $state(false);
     let showNext = $derived(
@@ -49,7 +51,7 @@
             () => [$state.snapshot(candidate)],
             async () => {
                 const errors = validateBot(candidate);
-                if (errors.get("bot_name").length == 0) {
+                if (errors.get("bot_name").length == 0 && nameDirty) {
                     errors.addErrors("bot_name", await checkUsername(candidate.name));
                 }
                 return errors;
@@ -100,7 +102,7 @@
     // let editing = $derived(bot !== undefined);
 
     $effect(() => {
-        const isValid = errors.size === 0;
+        const isValid = errors.size === 0 && schemaLoaded;
         if (isValid !== valid) {
             valid = isValid;
         }
@@ -123,6 +125,15 @@
         selectedCommandIndex = index;
     }
 
+    function endpointChanged() {
+        schemaLoaded = false;
+        candidate.definition = {
+            kind: "bot_definition",
+            description: "",
+            commands: [],
+        };
+    }
+
     function loadDefinition() {
         if (!schemaLoading && validEndpoint(candidate.endpoint)) {
             schemaLoading = true;
@@ -173,6 +184,22 @@
         bind:value={candidate.id}>
     </ValidatingInput>
 
+    <Legend
+        required
+        label={i18nKey("bots.builder.ownerLabel")}
+        rules={i18nKey("bots.builder.ownerRules")}></Legend>
+    <SingleUserSelector
+        invalid={errors.has("bot_owner")}
+        error={errors.get("bot_owner")}
+        border={false}
+        direction={"up"}
+        mentionSelf
+        on:userSelected={(ev) => (candidate.ownerId = ev.detail.userId)}
+        on:userRemoved={(_) => (candidate.ownerId = "")}
+        selectedReceiver={$userStore.get(candidate.ownerId)}
+        placeholder={"bots.builder.ownerLabel"}
+        autofocus={false} />
+
     <Legend
         required
         label={i18nKey("bots.builder.nameLabel")}
@@ -197,13 +224,17 @@
                 maxlength={200}
                 invalid={errors.has("bot_endpoint")}
                 error={errors.get("bot_endpoint")}
+                oninput={endpointChanged}
+                onenter={loadDefinition}
                 placeholder={i18nKey("https://my_openchat_bot")}
                 bind:value={candidate.endpoint} />
         </div>
         <div class="icon">
             {#if !errors.has("bot_endpoint")}
-                <HoverIcon onclick={loadDefinition}>
-                    <Reload size={$iconSize} color={"var(--icon-txt)"}></Reload>
+                <HoverIcon title={"load definition"} onclick={loadDefinition}>
+                    <Reload
+                        size={$iconSize}
+                        color={schemaLoaded ? "var(--icon-txt)" : "var(--accent)"}></Reload>
                 </HoverIcon>
             {/if}
         </div>

frontend/app/src/components/bots/BotAvatar.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import { AvatarSize } from "openchat-client";
+    import Avatar from "../Avatar.svelte";
+
+    interface Props {
+        bot: { avatarUrl?: string };
+    }
+
+    let { bot }: Props = $props();
+</script>
+
+<Avatar url={bot.avatarUrl ?? "/assets/bot_avatar.svg"} size={AvatarSize.Default} />

frontend/app/src/components/bots/BotBuilder.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
     import {
+        currentUser,
         emptyBotInstance,
         emptySlashCommandPermissions,
         OpenChat,
@@ -33,7 +34,7 @@
     let selectedCommand = $state<SlashCommandSchema | undefined>(undefined);
     let selectedCommandIndex = $state<number | undefined>(undefined);
     let debug = $state(false);
-    let candidate = $state<ExternalBot>(emptyBotInstance());
+    let candidate = $state<ExternalBot>(emptyBotInstance($currentUser.userId));
 
     let errors = $derived.by(
         debouncedDerived(