completed member addition by autocomplete form

frontend/src/Components/Autocomplete.svelte

@@ -7,6 +7,16 @@
     let text = $state('')
     let options = $state({});
 
+    async function ondblclick(evt){
+        var select = evt.target;
+        let key = select.value;
+        text = options[key];
+        let result = {};
+        result[key]=text;
+        options={};
+        onSelect(result);
+    }
+
     async function onkeyup(evt){
         var select = evt.target;
         var key = evt.key;
@@ -17,12 +27,7 @@
             return;
         }
         if (key == 'Enter'){
-            let key = select.value;
-            text = options[key];
-            let result = {};
-            result[key]=text;
-            options={};
-            onSelect(result);
+            ondblclick(evt);
             return;
         }
         if (key == 'Backspace'){
@@ -41,7 +46,7 @@
         min-width: 200px;
     }
 </style>
-<select size={Object.keys(options).length<2?2:Object.keys(options).length+1} {onkeyup} autofocus width="40">
+<select size={Object.keys(options).length<2?2:Object.keys(options).length+1} {onkeyup} {ondblclick} autofocus width="40">
     <option>{text}</option>
     {#each Object.entries(options) as [val,caption]}
     <option value={val}>{caption}</option>

frontend/src/Components/MemberEditor.svelte

@@ -3,7 +3,11 @@
     import { t } from '../translations.svelte.js';
     import Autocomplete from './Autocomplete.svelte';
     import PermissionSelector from './PermissionSelector.svelte';
-    let { members, updatePermission = (uid,perm) => console.log({user:uid,perm:perm}) } = $props();
+    let {
+        members,
+        updatePermission = (uid,perm) => console.log(`no handler for updatePermission(${uid}, ${perm})`),
+        addMember        = (entry)    => console.log(`no handler for addMember(${entry})`)
+    } = $props();
     let error = $state(null);
     let sortedMembers = $derived.by(() => Object.values(members).sort((a, b) => a.user.name.localeCompare(b.user.name)));
 
@@ -34,8 +38,8 @@
         }
     }
 
-    function onSelect(name){
-        console.log({selected_user:name})
+    function onSelect(entry){
+        addMember(entry);
     }
 
     onMount(loadPermissions);

frontend/src/routes/project/View.svelte

@@ -14,6 +14,12 @@
     let estimated_time = $state({sum:0});
     let showSettings = $state(false);
 
+    async function addMember(entry){
+        const ids = Object.keys(entry);
+        console.log({entry:entry,ids:ids});
+        if (ids) update({new_member:+ids.pop()});
+    }
+
     async function loadProject(){
         const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/project/${id}`;
         const resp = await fetch(url,{credentials:'include'});
@@ -125,6 +131,6 @@
 {#if showSettings}
 <fieldset class="project settings">
     <legend>{t('settings')}</legend>
-    <MemberEditor members={project.members} {updatePermission} />
+    <MemberEditor members={project.members} {updatePermission} {addMember} />
 </fieldset>
 {/if}