@gen3/workspaces 0.12.48 → 0.12.49

package/dist/index/esm/index.js

@@ -1,12 +1,12 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import React, { useCallback, useMemo, useState, useRef, useEffect, createContext, useImperativeHandle } from 'react';
+import React, { useCallback, useMemo, useState, useRef, useEffect, createContext, useImperativeHandle, forwardRef } from 'react';
 import { mergeDefaultTailwindClassnames, ACTIVITY_CHANNEL, convertSecondsToMilliseconds, InfoRolloverButton, OverflowTooltippedLabel, PanelErrorBoundary, ProtectedContent, NavPageLayout, ContentSource, getNavPageLayoutPropsFromConfig } from '@gen3/frontend';
 import { Card, Stack, Badge, Text, List, Group, Tooltip, Button, LoadingOverlay, Alert, Loader, Divider, Select, ActionIcon, TextInput, Textarea, Table, Scroller, Tabs, Center } from '@mantine/core';
 import { Icon } from '@iconify-icon/react';
 import { GEN3_API, GEN3_WORKSPACE_API, gen3Api, useCoreSelector, selectJEGActiveWorkspaceStatus, useCoreDispatch, setJEGActiveWorkspaceStatus, WorkspaceStatus, setJEGRequestedWorkspaceStatus, RequestedWorkspaceStatus, setJEGActiveWorkspaceId, isFetchBaseQueryError, selectJEGRequestedWorkspaceStatus, selectJEGRequestedWorkspaceStatusTimestamp, isTimeGreaterThan, formatUptimeInMinutes, selectJEGKernelIds, removeManyJEGActiveKernels, upsertManyJEGActiveKernels, normalizeRtkError, selectAllJEGKernels, addJEGActiveKernel, selectWorkspaceTier, setWorkspaceTier, selectWorkspaceFullscreen, setWorkspaceFullscreen, useGetDictionaryFromUrlQuery, useUserAuth, GEN3_COMMONS_NAME } from '@gen3/core';
 import { useDeepCompareEffect } from 'use-deep-compare';
 import { notifications } from '@mantine/notifications';
-import { useElementSize, useDisclosure } from '@mantine/hooks';
+import { useElementSize, useDisclosure, useResizeObserver } from '@mantine/hooks';
 import { IoSettingsSharp } from 'react-icons/io5';
 import { BsFillInfoCircleFill } from 'react-icons/bs';
 import { MdKeyboardArrowDown, MdKeyboardArrowRight } from 'react-icons/md';
@@ -2229,7 +2229,7 @@ const SettingsPanel = ({ showKernels, expanded, setExpanded, width = 380 })=>{
     });
 };
 
-const WorkspaceToolbar = ({ toolbarConfiguration })=>{
+const WorkspaceToolbar = /*#__PURE__*/ forwardRef(({ toolbarConfiguration }, ref)=>{
     const workspaceTier = useCoreSelector((state)=>selectWorkspaceTier(state));
     const workspaceStatus = useCoreSelector((state)=>selectJEGActiveWorkspaceStatus(state));
     const isFullscreen = useCoreSelector((state)=>selectWorkspaceFullscreen(state));
@@ -2248,6 +2248,7 @@ const WorkspaceToolbar = ({ toolbarConfiguration })=>{
     const fullscreenLabel = isFullscreen ? 'Exit Fullscreen' : 'Fullscreen View';
     const statusLabel = workspaceStatus === WorkspaceStatus.NotFound ? 'Not Running' : workspaceStatus;
     return /*#__PURE__*/ jsxs("div", {
+        ref: ref,
         role: "toolbar",
         "aria-label": "Workspace toolbar",
         className: "flex items-center justify-between px-4 border-b-2 border-base-lighter pb-4",
@@ -2361,7 +2362,8 @@ const WorkspaceToolbar = ({ toolbarConfiguration })=>{
             })
         ]
     });
-};
+});
+WorkspaceToolbar.displayName = 'WorkspaceToolbar';
 
 // Streaming LLM client — OpenAI, Anthropic, Gemini, Ollama
 // All requests go directly from the browser to provider APIs (no backend proxy).
@@ -3553,7 +3555,7 @@ const CompactDictionaryPanel = ({ schemaUrl = '_dictionary/_all' })=>{
     }
     return /*#__PURE__*/ jsxs("div", {
         ref: ref,
-        className: "relative flex h-full flex-col gap-2 overflow-hidden bg-base-lightest p-2",
+        className: "relative flex flex-col gap-2 bg-base-lightest p-2 h-full",
         children: [
             /*#__PURE__*/ jsx(LoadingOverlay, {
                 visible: isFetching
@@ -3573,7 +3575,7 @@ const CompactDictionaryPanel = ({ schemaUrl = '_dictionary/_all' })=>{
                 ]
             }),
             /*#__PURE__*/ jsx("div", {
-                className: "flex min-h-0 flex-1 flex-col gap-0.5 overflow-y-auto",
+                className: "flex h-full flex-1 flex-col gap-0.5 overflow-y-auto",
                 children: filtered.map((node)=>{
                     const isExpanded = expandedId === node.id;
                     const propCount = Object.keys(node.properties).length;
@@ -3611,18 +3613,12 @@ const CompactDictionaryPanel = ({ schemaUrl = '_dictionary/_all' })=>{
                                             })
                                         ]
                                     }),
-                                    isNarrow && /*#__PURE__*/ jsxs("div", {
+                                    isNarrow && /*#__PURE__*/ jsx("div", {
                                         className: "flex w-full items-center justify-between pl-5 pt-0.5",
-                                        children: [
-                                            node.category && /*#__PURE__*/ jsx("span", {
-                                                className: "truncate text-xs text-base-darker",
-                                                children: node.category
-                                            }),
-                                            /*#__PURE__*/ jsx(FieldLinkCountBadge, {
-                                                fieldsCount: propCount,
-                                                linksCount: linkCount
-                                            })
-                                        ]
+                                        children: node.category && /*#__PURE__*/ jsx("span", {
+                                            className: "truncate text-xs text-base-darker",
+                                            children: node.category
+                                        })
                                     })
                                 ]
                             }),
@@ -3753,12 +3749,12 @@ const TABS = [
 ];
 const DataToolsPanel = ({ schemaUrl = DEFAULT_DICTIONARY_SCHEMA_URL, kbUrl })=>{
     return /*#__PURE__*/ jsx("div", {
-        className: "flex shrink-0",
+        className: "flex flex-col h-full",
         children: /*#__PURE__*/ jsxs(Tabs, {
             defaultValue: "dictionary",
             variant: "outline",
             classNames: {
-                root: 'p-2'
+                root: 'flex flex-col p-2'
             },
             keepMounted: true,
             children: [
@@ -3771,7 +3767,7 @@ const DataToolsPanel = ({ schemaUrl = DEFAULT_DICTIONARY_SCHEMA_URL, kbUrl })=>{
                         }, tab.id))
                 }),
                 /*#__PURE__*/ jsx("div", {
-                    className: "min-h-0 flex-1 overflow-hidden pt-4",
+                    className: "flex-1 min-h-0 h-full pt-4",
                     children: /*#__PURE__*/ jsxs(PanelErrorBoundary, {
                         children: [
                             /*#__PURE__*/ jsx(Tabs.Panel, {
@@ -3809,26 +3805,44 @@ const WorkspaceLayout = ({ children, tierConfiguration })=>{
     const workspaceTier = useCoreSelector((state)=>selectWorkspaceTier(state));
     const [toolsExpanded, { set: setToolsExpanded }] = useDisclosure(true);
     const [settingsExpanded, { set: setSettingsExpanded }] = useDisclosure(true);
+    const [toolbarRef, toolbarRect] = useResizeObserver();
     const isFullScreen = useCoreSelector((state)=>selectWorkspaceFullscreen(state));
+    useEffect(()=>{
+        if (isFullScreen) {
+            setToolsExpanded(false);
+            setSettingsExpanded(false);
+        } else {
+            setToolsExpanded(true);
+            setSettingsExpanded(true);
+        }
+    }, [
+        isFullScreen,
+        setSettingsExpanded,
+        setToolsExpanded
+    ]);
     if (!workspaceTier) return null;
     return /*#__PURE__*/ jsxs("div", {
         className: "flex flex-col w-full grow",
         children: [
             /*#__PURE__*/ jsx(WorkspaceToolbar, {
-                toolbarConfiguration: tierConfiguration.toolbar
+                toolbarConfiguration: tierConfiguration.toolbar,
+                ref: toolbarRef
             }),
             /*#__PURE__*/ jsxs("div", {
-                className: "flex w-full grow",
+                className: "flex w-full nowrap",
+                style: {
+                    height: `calc(100% - ${toolbarRect?.height ?? 0}px`
+                },
                 children: [
                     tierConfiguration.dataAndTools.enabled && /*#__PURE__*/ jsx(ToolsPanel, {
-                        expanded: toolsExpanded && !isFullScreen,
+                        expanded: toolsExpanded,
                         setExpanded: setToolsExpanded,
                         width: tierConfiguration.dataAndTools.width
                     }),
                     children,
                     /*#__PURE__*/ jsx(SettingsPanel, {
                         showKernels: tierConfiguration.settings.showKernels,
-                        expanded: settingsExpanded && !isFullScreen,
+                        expanded: settingsExpanded,
                         setExpanded: setSettingsExpanded,
                         width: tierConfiguration.settings.width
                     })