Fix expandables (#7655)

Signed-off-by: Andrey Sobolev <haiodo@gmail.com>

packages/ui/src/components/Expandable.svelte

@@ -26,6 +26,9 @@
   export let expandable = true
   export let contentColor = false
   export let showChevron = true
+
+  let wasExpanded = expanded
+  $: if (expanded) wasExpanded = true
 </script>
 
 <div class="flex-col">
@@ -56,7 +59,9 @@
     {/if}
   </div>
   <ExpandCollapse isExpanded={expanded}>
+    {#if wasExpanded}
       <slot />
+    {/if}
   </ExpandCollapse>
 </div>
 

plugins/workbench-resources/src/components/ServerManagerUsers.svelte

@@ -5,7 +5,7 @@
   import presentation, { createQuery, isAdminUser, type OverviewStatistics } from '@hcengineering/presentation'
   import { Button, CheckBox, ticker } from '@hcengineering/ui'
   import Expandable from '@hcengineering/ui/src/components/Expandable.svelte'
-  import { ObjectPresenter } from '@hcengineering/view-resources'
+  import { FixedColumn, ObjectPresenter } from '@hcengineering/view-resources'
   import { workspacesStore } from '../utils'
 
   const token: string = getMetadata(presentation.metadata.Token) ?? ''
@@ -36,8 +36,14 @@
     employees = emp
   })
   let realUsers: boolean
+  let showActive5: boolean
 
-  $: byService = groupByArray(data?.workspaces ?? [], (it) => it.service)
+  $: byService = groupByArray(
+    (data?.workspaces ?? []).filter((it) => !showActive5 || it.sessions.some((sit) => sit.current.tx > 0)),
+    (it) => it.service
+  )
+
+  const isSystemAccount = (it: string): boolean => it === systemAccountEmail || it === 'huly.ai.bot@hc.engineering'
 </script>
 
 <div class="p-6">
@@ -48,22 +54,51 @@
     <CheckBox bind:checked={realUsers} />
     <div class="ml-1">Show only users</div>
   </div>
+  <div class="flex-row-center">
+    <CheckBox bind:checked={showActive5} />
+    <div class="ml-1">Show active in 5mins</div>
+  </div>
 </div>
 <div class="flex-column p-3 h-full" style:overflow="auto">
   {#each byService.keys() as s}
+    {@const ss = byService.get(s) ?? []}
+    <Expandable bordered expandable showChevron>
+      <svelte:fragment slot="title">
+        <div class="flex-row-center p-1">
+          <FixedColumn key="service">
+            <span class="p-1">
               Service: {s}
-    {#each byService.get(s) ?? [] as act}
+            </span>
+          </FixedColumn>
+          <span class="p-1">
+            Workspaces: {ss.length}
+          </span>
+
+          <span class="p-1">
+            Connections: {ss.reduce((it, itm) => it + itm.sessions.length, 0)}
+          </span>
+          <span class="p-1">
+            Users: {ss.reduce((it, itm) => it + itm.sessions.filter((it) => !isSystemAccount(it.userId)).length, 0)}
+          </span>
+          <span class="p-1">
+            Active {ss.reduce((it, itm) => it + itm.sessions.filter((it) => it.current.tx > 0).length, 0)} /
+            {ss.reduce((it, itm) => it + itm.sessions.filter((it) => it.mins5.tx > 0 || it.current.tx > 0).length, 0)}
+          </span>
+        </div>
+      </svelte:fragment>
+      <div class="p-1">
+        {#each ss as act}
           {@const wsInstance = $workspacesStore.find((it) => it.workspaceId === act.wsId)}
           {@const totalFind = act.sessions.reduce((it, itm) => itm.total.find + it, 0)}
           {@const totalTx = act.sessions.reduce((it, itm) => itm.total.tx + it, 0)}
 
           {@const currentFind = act.sessions.reduce((it, itm) => itm.current.find + it, 0)}
           {@const currentTx = act.sessions.reduce((it, itm) => itm.current.tx + it, 0)}
-      {@const employeeGroups = Array.from(new Set(act.sessions.map((it) => it.userId))).filter(
+          {@const employeeGroups = Array.from(
-        (it) => systemAccountEmail !== it || !realUsers
+            new Set(act.sessions.filter((it) => !showActive5 || it.current.tx > 0).map((it) => it.userId))
-      )}
+          ).filter((it) => !isSystemAccount(it) || !realUsers)}
           {@const realGroup = Array.from(new Set(act.sessions.map((it) => it.userId))).filter(
-        (it) => systemAccountEmail !== it
+            (it) => !isSystemAccount(it)
           )}
           {#if employeeGroups.length > 0}
             <span class="flex-col">
@@ -80,9 +115,12 @@
                         size={'small'}
                         kind={'ghost'}
                         on:click={() => {
-                      void fetch(endpoint + `/api/v1/manage?token=${token}&operation=force-close&wsId=${act.wsId}`, {
+                          void fetch(
+                            endpoint + `/api/v1/manage?token=${token}&operation=force-close&wsId=${act.wsId}`,
+                            {
                               method: 'PUT'
-                      })
+                            }
+                          )
                         }}
                       />
                     {/if}
@@ -144,6 +182,8 @@
             </span>
           {/if}
         {/each}
+      </div>
+    </Expandable>
   {/each}
 </div>