@humandialog/forms.svelte 1.3.17 → 1.4.1

package/tenant.members.svelte

@@ -4,7 +4,8 @@
                 FaPen,
                 FaInfoCircle,
                 FaUserSlash,
-                FaChevronDown} from 'svelte-icons/fa'
+                FaChevronDown,
+                FaInfo} from 'svelte-icons/fa'
     
     import Page from './page.svelte'
     import List from './components/list/list.svelte'
@@ -32,6 +33,7 @@
     export let nameAttrib = "Name";
     export let emailAttrib = "login";
     export let refAttrib = "$ref";
+    export let hrefAttrib = ''
     export let showFiles = false;
     //export let show_admin = true;
     export let showAccessRoles = false;
@@ -101,7 +103,10 @@
                         avatar_url : "",
                         invitation_not_accepted: false,
                         removed: false,
-                        membership_tag: ""
+                        membership_tag: "",
+                        ... hrefAttrib ? { 
+                            [hrefAttrib]: u[hrefAttrib] 
+                         } : { }
                     }
                 )
             })
@@ -110,7 +115,7 @@
         //fake_users = [];
         //add_fake_users(fake_users);
 
-        await fetch_details();
+      //  await fetch_details();
  
     }
 
@@ -136,6 +141,13 @@
 
     }
 
+    async function fetch_user_details(reef_user)
+    {
+        let details = await reef.get(`/sys/user_details?email=${reef_user[emailAttrib]}`)
+        set_user_info(reef_user, details);
+        list?.reload(reef_users);
+    }
+
     function set_user_info(user, info)
     {
         user.auth_group = info.auth_group ?? 0;
@@ -285,25 +297,27 @@
     }
 
     let page_operations={
-        opver: 1,
+        opver: 2,
+        fab: 'M00',
         operations: [
             {
                 caption: 'View',
                 operations: [
                     {
                         icon: FaUserPlus,
-                        caption: '',
+                        caption: 'Add user',
                         action: (focused) => { create_new_user(); },
-                        fab: 'M10',
+                    //    fab: 'M10',
                         tbr: 'A'
                     },
-                    {
+                    // przenieść na stronie /profile
+                  /*  {
                         icon: FaUserSlash,
-                        caption: '',
+                        caption: 'Delete application account',
                         action: (f) => {askToDeleteApplicationAccount();},
-                        fab: 'S00',
+                        //fab: 'S00',
                         tbr: 'C'
-                    }
+                    }*/
                 ]
             }
         ]
@@ -317,18 +331,14 @@
                 action: (focused) =>  { list.edit(user, nameAttrib) }
             },
             {
-                caption: 'Users management',
+                caption: 'Users management (auth role)',
                 action: (focused) => { list.edit(user, 'Privileges') }
             }];
 
         if(showAccessRoles)
         {
             operations.push({
-                separator: true
-            });
-
-            operations.push({
-                caption: 'Access role',
+                caption: 'Access role (app role)',
                 action: (focused) => { list.edit(user, 'Access') }
             });
         }
@@ -336,7 +346,7 @@
         if(showFiles)
         {
             operations.push({
-                caption: 'External files',
+                caption: 'External files (files role)',
                 action: (focused) => { list.edit(user, 'Files') }
             });
         }
@@ -346,74 +356,63 @@
 
     let user_operations = (user) => { 
         
-        let operations = [];
+        let operations = [
+            {
+                caption: 'Fetch info',
+                icon: FaInfo,
+                action: (f) => fetch_user_details(user),
+                tbr: 'A'
+            }
+        ];
 
         if(user.removed)
         {
-            operations = [
+            operations = [ ...operations,
                 {
                     icon: FaUserPlus,
-                    caption: '',
+                    caption: 'Revert removing',
                     action: (f) => askToAddAgain(user),
-                    fab: 'M10',
-                    tbr: 'B'
+//                    fab: 'M10',
+                    tbr: 'A'
                 }
             ];
         }
         else
         {
             let edit_operations = get_edit_operations(user)
-            if(edit_operations.length == 1)
-            {
-                operations.push({
-                                    icon: FaPen,
-                                    caption: '',
-                                    action: edit_operations[0].action,
-                                    fab: 'M20',
-                                    tbr: 'B'
-                                });
-            }
-            else
-            {
-                operations.push({
-                                    icon: FaPen,
-                                    caption: '',
-                                    grid: edit_operations,
-                                    fab: 'M20',
-                                    tbr: 'B'
-                                });
-            }
-
+            
             operations.push({
-                                caption: '',
+                                icon: FaPen,
+                                caption: 'Change',
+                                menu: edit_operations,
+                                //fab: 'M20',
+                                tbr: 'A'
+                            });
+            
+            operations.push({
+                                caption: 'Remove user',
                                 icon: FaUserMinus,
                                 action: (focused) => askToRemove(user),
-                                fab: 'M30',
-                                tbr: 'B'
+                             //   fab: 'M30',
+                                tbr: 'A'
                             });
         }
 
         
         return {
-            opver: 1,
+            opver: 2,
+            fab: 'M00',
             operations: [
                 {
                     caption: 'User',
+                 //   tbr: 'B',
                     operations: operations
                 }
             ]
         }
     }
 
-    let user_context_menu = (user) => {
-        if(user.removed)
-            return [];
-
-        let edit_operations = get_edit_operations(user);
-        return {
-            grid: edit_operations
-        }
-    }
+    
 
     let data_item = 
     { 
@@ -695,7 +694,13 @@
         create_new_user();
     }
 
-   
+   function getHRefFunc()
+   {
+        if(!hrefAttrib)
+            return undefined
+        else
+            return (user) => { return user[hrefAttrib]} 
+   }
     
 </script>
 
@@ -713,9 +718,8 @@
     <List       objects={reef_users} 
                 title='Members' 
                 toolbarOperations={user_operations} 
-                contextMenu={user_context_menu}
                 bind:this={list}>
-            <ListTitle a={nameAttrib} onChange={on_name_changed}/>
+            <ListTitle a={nameAttrib} onChange={on_name_changed} hrefFunc={getHRefFunc()}/>
             <ListSummary a={emailAttrib} readonly/>
 
             <ListStaticProperty name="Membership" a="membership_tag"/>

package/tenant.members.svelte.d.ts

@@ -6,6 +6,7 @@ export default class Tenant extends SvelteComponentTyped<{
     nameAttrib?: string | undefined;
     emailAttrib?: string | undefined;
     refAttrib?: string | undefined;
+    hrefAttrib?: string | undefined;
     showFiles?: boolean | undefined;
     showAccessRoles?: boolean | undefined;
 }, {
@@ -22,6 +23,7 @@ declare const __propDef: {
         nameAttrib?: string | undefined;
         emailAttrib?: string | undefined;
         refAttrib?: string | undefined;
+        hrefAttrib?: string | undefined;
         showFiles?: boolean | undefined;
         showAccessRoles?: boolean | undefined;
     };

package/vertical.toolbar.svelte

@@ -28,10 +28,12 @@
 	import { popNavigationPage } from './utils';
     
 
-    export let appConfig;
+    export let appConfig = undefined;
     export let mobile=false;
     export let clearsContext = 'sel props'
     
+    export let definedTabs = undefined
+    export let mainToolbarConfig = undefined
     
     let tabs = new Array();
     let config = null;
@@ -46,10 +48,19 @@
     let can_add_new_group = false;
 
     $:  {
-        config = appConfig.mainToolbar;
-        has_selection_details = appConfig.selectionDetails;
-        if(has_selection_details)
-            selection_detils_caption = appConfig.selectionDetails.caption ?? 'Properties'
+        if(appConfig)
+        {
+            config = appConfig.mainToolbar;
+            has_selection_details = appConfig.selectionDetails;
+            if(has_selection_details)
+                selection_detils_caption = appConfig.selectionDetails.caption ?? 'Properties'
+        }
+        else
+        {
+            has_selection_details = false;
+            config = mainToolbarConfig;
+        }
+
         is_logged_in = $session.isActive;
         show_sign_in_out_icons = config.signin ? true : false;
         sign_in_href = $signInHRef;
@@ -57,23 +68,38 @@
 
         tabs = new Array();
 
-        Object.keys(appConfig.sidebar).forEach( (key) =>    
-            { 
-                const ctab = appConfig.sidebar[key];
-                const can_show = (ctab.authorized && is_logged_in) || (!ctab.authorized)
-                if(can_show)
-                    tabs.push({key: key, icon: ctab.icon}); 
-            });
-
-        // there is no current visible sidebar
-        if($main_sidebar_visible_store != '*')
+        if(definedTabs && Array.isArray(definedTabs) && definedTabs.length > 0)
         {
-            if(tabs.every( (e) => e.key != $main_sidebar_visible_store))
+            tabs = [...definedTabs]
+        }
+        else
+        {
+            Object.keys(appConfig.sidebar).forEach( (key) =>    
+                { 
+                    const ctab = appConfig.sidebar[key];
+                    const can_show = (ctab.authorized && is_logged_in) || (!ctab.authorized)
+                    if(can_show)
+                    {
+                        const tab = {
+                            key: key,
+                            icon: ctab.icon,
+                            onclick: (e) => on_navigator_tab_clicked(e, key)
+                        }
+
+                        tabs.push(tab); 
+                    }
+                });
+
+            // there is no current visible sidebar
+            if($main_sidebar_visible_store != '*')
             {
-                if(tabs.length)
-                    show_sidebar(tabs[0].key);
-                else
-                    hide_sidebar();
+                if(tabs.every( (e) => e.key != $main_sidebar_visible_store))
+                {
+                    if(tabs.length)
+                        show_sidebar(tabs[0].key);
+                    else
+                        hide_sidebar();
+                }
             }
         }
        
@@ -94,9 +120,11 @@
         
     }
 
-    function on_tab_clicked(key)
+    function on_navigator_tab_clicked(e, key)
     {
-        if(!mobile)
+        e.stopPropagation();
+       
+         if(!mobile)
             toggle_sidebar(key);
         else
         {
@@ -331,7 +359,7 @@
             <button
                 class="h-16 px-0 flex justify-center items-center w-full text-stone-300 hover:text-stone-100"
                 class:bg-orange-500={isSelected}
-                on:click|stopPropagation={()=> (on_tab_clicked(tab.key))}>
+                on:click={tab.onclick}>
                 
                 <Icon class="w-5 h-5" component={tab.icon}/>
             </button>

package/vertical.toolbar.svelte.d.ts

@@ -2,9 +2,11 @@
 /** @typedef {typeof __propDef.events}  VerticalEvents */
 /** @typedef {typeof __propDef.slots}  VerticalSlots */
 export default class Vertical extends SvelteComponentTyped<{
-    appConfig: any;
+    appConfig?: any;
     mobile?: boolean | undefined;
     clearsContext?: string | undefined;
+    definedTabs?: any;
+    mainToolbarConfig?: any;
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}> {
@@ -15,9 +17,11 @@ export type VerticalSlots = typeof __propDef.slots;
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
-        appConfig: any;
+        appConfig?: any;
         mobile?: boolean | undefined;
         clearsContext?: string | undefined;
+        definedTabs?: any;
+        mainToolbarConfig?: any;
     };
     events: {
         [evt: string]: CustomEvent<any>;