[arvados] created: 2.7.0-5776-gfabc97343f

git repository hosting git at public.arvados.org
Fri Jan 5 20:21:30 UTC 2024


        at  fabc97343f1b74c66890c00295c5c1911d5e096a (commit)


commit fabc97343f1b74c66890c00295c5c1911d5e096a
Author: Lisa Knox <lisaknox83 at gmail.com>
Date:   Fri Jan 5 15:21:12 2024 -0500

    21316: adjusted margins so collapse button doesnt hide on small(er) screens Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox at curii.com>

diff --git a/services/workbench2/src/views-components/side-panel-button/side-panel-button.tsx b/services/workbench2/src/views-components/side-panel-button/side-panel-button.tsx
index 6acbb16118..47b2316831 100644
--- a/services/workbench2/src/views-components/side-panel-button/side-panel-button.tsx
+++ b/services/workbench2/src/views-components/side-panel-button/side-panel-button.tsx
@@ -121,7 +121,7 @@ export const SidePanelButton = withStyles(styles)(
                 menuItems = React.createElement(React.Fragment, null,
                     pluginConfig.newButtonMenuList.reduce(reduceItemsFn, React.Children.toArray(menuItems.props.children)));
 
-                return <Toolbar>
+                return <Toolbar style={{paddingRight: 0}}>
                     <Grid container>
                         <Grid container item xs alignItems="center" justify="flex-start">
                             <Button data-cy="side-panel-button" variant="contained" disabled={!enabled}
diff --git a/services/workbench2/src/views-components/side-panel/side-panel.tsx b/services/workbench2/src/views-components/side-panel/side-panel.tsx
index ebcf9e41d6..e19daefa87 100644
--- a/services/workbench2/src/views-components/side-panel/side-panel.tsx
+++ b/services/workbench2/src/views-components/side-panel/side-panel.tsx
@@ -60,10 +60,8 @@ export const SidePanel = withStyles(styles)(
             if (!splitPane) return;
 
             const observer = new ResizeObserver((entries)=>{
-                for (let i = 0; i < entries.length; i++) {
-                    const width = entries[i].contentRect.width
-                    props.setCurrentSideWidth(width)
-                }
+                const width = entries[0].contentRect.width
+                props.setCurrentSideWidth(width)
             })
 
             observer.observe(splitPane)

commit cb690390d4f253c3bbb9c543e243cf988f39fbb3
Merge: 92a91b8274 1416f698b7
Author: Lisa Knox <lisaknox83 at gmail.com>
Date:   Fri Jan 5 13:56:55 2024 -0500

    21316: Merge commit '1416f698b72de4b09350d9c2fb25c1405c3247bc' into 21316-left-panel-collapse
    
    Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox at curii.com>

diff --cc services/workbench2/src/views-components/side-panel-tree/side-panel-tree.tsx
index f8cd9efe46,0000000000..f338687de9
mode 100644,000000..100644
--- a/services/workbench2/src/views-components/side-panel-tree/side-panel-tree.tsx
+++ b/services/workbench2/src/views-components/side-panel-tree/side-panel-tree.tsx
@@@ -1,92 -1,0 +1,93 @@@
 +// Copyright (C) The Arvados Authors. All rights reserved.
 +//
 +// SPDX-License-Identifier: AGPL-3.0
 +
 +import React from "react";
 +import { Dispatch } from "redux";
 +import { connect } from "react-redux";
 +import { TreePicker, TreePickerProps } from "../tree-picker/tree-picker";
 +import { TreeItem } from "components/tree/tree";
 +import { ProjectResource } from "models/project";
 +import { ListItemTextIcon } from "components/list-item-text-icon/list-item-text-icon";
 +import { ProcessIcon, ProjectIcon, FilterGroupIcon, FavoriteIcon, ProjectsIcon, ShareMeIcon, TrashIcon, PublicFavoriteIcon, GroupsIcon, TerminalIcon, ResourceIcon } from 'components/icon/icon';
 +import { activateSidePanelTreeItem, toggleSidePanelTreeItemCollapse, SIDE_PANEL_TREE, SidePanelTreeCategory } from 'store/side-panel-tree/side-panel-tree-actions';
 +import { openSidePanelContextMenu } from 'store/context-menu/context-menu-actions';
 +import { noop } from 'lodash';
 +import { ResourceKind } from "models/resource";
 +import { IllegalNamingWarning } from "components/warning/warning";
 +import { GroupClass } from "models/group";
 +
 +export interface SidePanelTreeProps {
 +    onItemActivation: (id: string) => void;
 +    sidePanelProgress?: boolean;
 +    isCollapsed?: boolean
++    setCurrentSideWidth: (width: number) => void
 +}
 +
 +type SidePanelTreeActionProps = Pick<TreePickerProps<ProjectResource | string>, 'onContextMenu' | 'toggleItemActive' | 'toggleItemOpen' | 'toggleItemSelection'>;
 +
 +const mapDispatchToProps = (dispatch: Dispatch, props: SidePanelTreeProps): SidePanelTreeActionProps => ({
 +    onContextMenu: (event, { id }) => {
 +        dispatch<any>(openSidePanelContextMenu(event, id));
 +    },
 +    toggleItemActive: (_, { id }) => {
 +        dispatch<any>(activateSidePanelTreeItem(id));
 +        props.onItemActivation(id);
 +    },
 +    toggleItemOpen: (_, { id }) => {
 +        dispatch<any>(toggleSidePanelTreeItemCollapse(id));
 +    },
 +    toggleItemSelection: noop,
 +});
 +
 +export const SidePanelTree = connect(undefined, mapDispatchToProps)(
 +    (props: SidePanelTreeActionProps) =>
 +        <div data-cy="side-panel-tree">
 +            <TreePicker {...props} render={renderSidePanelItem} pickerId={SIDE_PANEL_TREE} />
 +        </div>);
 +
 +const renderSidePanelItem = (item: TreeItem<ProjectResource>) => {
 +    const name = typeof item.data === 'string' ? item.data : item.data.name;
 +    const warn = typeof item.data !== 'string' && item.data.kind === ResourceKind.PROJECT
 +        ? <IllegalNamingWarning name={name} />
 +        : undefined;
 +    return <ListItemTextIcon
 +        icon={getProjectPickerIcon(item)}
 +        name={name}
 +        nameDecorator={warn}
 +        isActive={item.active}
 +        hasMargin={true}
 +    />;
 +};
 +
 +const getProjectPickerIcon = (item: TreeItem<ProjectResource | string>) =>
 +    typeof item.data === 'string'
 +        ? getSidePanelIcon(item.data)
 +        : (item.data && item.data.groupClass === GroupClass.FILTER)
 +            ? FilterGroupIcon
 +            : ProjectsIcon;
 +
 +export const getSidePanelIcon = (category: string) => {
 +    switch (category) {
 +        case SidePanelTreeCategory.FAVORITES:
 +            return FavoriteIcon;
 +        case SidePanelTreeCategory.PROJECTS:
 +            return ProjectsIcon;
 +        case SidePanelTreeCategory.SHARED_WITH_ME:
 +            return ShareMeIcon;
 +        case SidePanelTreeCategory.TRASH:
 +            return TrashIcon;
 +        case SidePanelTreeCategory.PUBLIC_FAVORITES:
 +            return PublicFavoriteIcon;
 +        case SidePanelTreeCategory.ALL_PROCESSES:
 +            return ProcessIcon;
 +        case SidePanelTreeCategory.INSTANCE_TYPES:
 +            return ResourceIcon;
 +        case SidePanelTreeCategory.GROUPS:
 +            return GroupsIcon;
 +        case SidePanelTreeCategory.SHELL_ACCESS:
 +            return TerminalIcon
 +        default:
 +            return ProjectIcon;
 +    }
 +};
diff --cc services/workbench2/src/views/workbench/workbench.tsx
index b094b769cb,0000000000..3020e0d298
mode 100644,000000..100644
--- a/services/workbench2/src/views/workbench/workbench.tsx
+++ b/services/workbench2/src/views/workbench/workbench.tsx
@@@ -1,445 -1,0 +1,464 @@@
 +// Copyright (C) The Arvados Authors. All rights reserved.
 +//
 +// SPDX-License-Identifier: AGPL-3.0
 +
- import React from "react";
++import React, { useEffect, useState } from "react";
 +import { StyleRulesCallback, WithStyles, withStyles } from "@material-ui/core/styles";
 +import { Route, Switch } from "react-router";
 +import { ProjectPanel } from "views/project-panel/project-panel";
 +import { DetailsPanel } from "views-components/details-panel/details-panel";
 +import { ArvadosTheme } from "common/custom-theme";
 +import { ContextMenu } from "views-components/context-menu/context-menu";
 +import { FavoritePanel } from "../favorite-panel/favorite-panel";
 +import { TokenDialog } from "views-components/token-dialog/token-dialog";
 +import { RichTextEditorDialog } from "views-components/rich-text-editor-dialog/rich-text-editor-dialog";
 +import { Snackbar } from "views-components/snackbar/snackbar";
 +import { CollectionPanel } from "../collection-panel/collection-panel";
 +import { RenameFileDialog } from "views-components/rename-file-dialog/rename-file-dialog";
 +import { FileRemoveDialog } from "views-components/file-remove-dialog/file-remove-dialog";
 +import { MultipleFilesRemoveDialog } from "views-components/file-remove-dialog/multiple-files-remove-dialog";
 +import { Routes } from "routes/routes";
 +import { SidePanel } from "views-components/side-panel/side-panel";
 +import { ProcessPanel } from "views/process-panel/process-panel";
 +import { ChangeWorkflowDialog } from "views-components/run-process-dialog/change-workflow-dialog";
 +import { CreateProjectDialog } from "views-components/dialog-forms/create-project-dialog";
 +import { CreateCollectionDialog } from "views-components/dialog-forms/create-collection-dialog";
 +import { CopyCollectionDialog, CopyMultiCollectionDialog } from "views-components/dialog-forms/copy-collection-dialog";
 +import { CopyProcessDialog } from "views-components/dialog-forms/copy-process-dialog";
 +import { UpdateCollectionDialog } from "views-components/dialog-forms/update-collection-dialog";
 +import { UpdateProcessDialog } from "views-components/dialog-forms/update-process-dialog";
 +import { UpdateProjectDialog } from "views-components/dialog-forms/update-project-dialog";
 +import { MoveProcessDialog } from "views-components/dialog-forms/move-process-dialog";
 +import { MoveProjectDialog } from "views-components/dialog-forms/move-project-dialog";
 +import { MoveCollectionDialog } from "views-components/dialog-forms/move-collection-dialog";
 +import { FilesUploadCollectionDialog } from "views-components/dialog-forms/files-upload-collection-dialog";
 +import { PartialCopyToNewCollectionDialog } from "views-components/dialog-forms/partial-copy-to-new-collection-dialog";
 +import { PartialCopyToExistingCollectionDialog } from "views-components/dialog-forms/partial-copy-to-existing-collection-dialog";
 +import { PartialCopyToSeparateCollectionsDialog } from "views-components/dialog-forms/partial-copy-to-separate-collections-dialog";
 +import { PartialMoveToNewCollectionDialog } from "views-components/dialog-forms/partial-move-to-new-collection-dialog";
 +import { PartialMoveToExistingCollectionDialog } from "views-components/dialog-forms/partial-move-to-existing-collection-dialog";
 +import { PartialMoveToSeparateCollectionsDialog } from "views-components/dialog-forms/partial-move-to-separate-collections-dialog";
 +import { RemoveProcessDialog } from "views-components/process-remove-dialog/process-remove-dialog";
 +import { MainContentBar } from "views-components/main-content-bar/main-content-bar";
 +import { Grid } from "@material-ui/core";
 +import { TrashPanel } from "views/trash-panel/trash-panel";
 +import { SharedWithMePanel } from "views/shared-with-me-panel/shared-with-me-panel";
 +import { RunProcessPanel } from "views/run-process-panel/run-process-panel";
 +import SplitterLayout from "react-splitter-layout";
 +import { WorkflowPanel } from "views/workflow-panel/workflow-panel";
 +import { RegisteredWorkflowPanel } from "views/workflow-panel/registered-workflow-panel";
 +import { SearchResultsPanel } from "views/search-results-panel/search-results-panel";
 +import { SshKeyPanel } from "views/ssh-key-panel/ssh-key-panel";
 +import { SshKeyAdminPanel } from "views/ssh-key-panel/ssh-key-admin-panel";
 +import { SiteManagerPanel } from "views/site-manager-panel/site-manager-panel";
 +import { UserProfilePanel } from "views/user-profile-panel/user-profile-panel";
 +import { SharingDialog } from "views-components/sharing-dialog/sharing-dialog";
 +import { NotFoundDialog } from "views-components/not-found-dialog/not-found-dialog";
 +import { AdvancedTabDialog } from "views-components/advanced-tab-dialog/advanced-tab-dialog";
 +import { ProcessInputDialog } from "views-components/process-input-dialog/process-input-dialog";
 +import { VirtualMachineUserPanel } from "views/virtual-machine-panel/virtual-machine-user-panel";
 +import { VirtualMachineAdminPanel } from "views/virtual-machine-panel/virtual-machine-admin-panel";
 +import { RepositoriesPanel } from "views/repositories-panel/repositories-panel";
 +import { KeepServicePanel } from "views/keep-service-panel/keep-service-panel";
 +import { ApiClientAuthorizationPanel } from "views/api-client-authorization-panel/api-client-authorization-panel";
 +import { LinkPanel } from "views/link-panel/link-panel";
 +import { RepositoriesSampleGitDialog } from "views-components/repositories-sample-git-dialog/repositories-sample-git-dialog";
 +import { RepositoryAttributesDialog } from "views-components/repository-attributes-dialog/repository-attributes-dialog";
 +import { CreateRepositoryDialog } from "views-components/dialog-forms/create-repository-dialog";
 +import { RemoveRepositoryDialog } from "views-components/repository-remove-dialog/repository-remove-dialog";
 +import { CreateSshKeyDialog } from "views-components/dialog-forms/create-ssh-key-dialog";
 +import { PublicKeyDialog } from "views-components/ssh-keys-dialog/public-key-dialog";
 +import { RemoveApiClientAuthorizationDialog } from "views-components/api-client-authorizations-dialog/remove-dialog";
 +import { RemoveKeepServiceDialog } from "views-components/keep-services-dialog/remove-dialog";
 +import { RemoveLinkDialog } from "views-components/links-dialog/remove-dialog";
 +import { RemoveSshKeyDialog } from "views-components/ssh-keys-dialog/remove-dialog";
 +import { VirtualMachineAttributesDialog } from "views-components/virtual-machines-dialog/attributes-dialog";
 +import { RemoveVirtualMachineDialog } from "views-components/virtual-machines-dialog/remove-dialog";
 +import { RemoveVirtualMachineLoginDialog } from "views-components/virtual-machines-dialog/remove-login-dialog";
 +import { VirtualMachineAddLoginDialog } from "views-components/virtual-machines-dialog/add-login-dialog";
 +import { AttributesApiClientAuthorizationDialog } from "views-components/api-client-authorizations-dialog/attributes-dialog";
 +import { AttributesKeepServiceDialog } from "views-components/keep-services-dialog/attributes-dialog";
 +import { AttributesLinkDialog } from "views-components/links-dialog/attributes-dialog";
 +import { AttributesSshKeyDialog } from "views-components/ssh-keys-dialog/attributes-dialog";
 +import { UserPanel } from "views/user-panel/user-panel";
 +import { UserAttributesDialog } from "views-components/user-dialog/attributes-dialog";
 +import { CreateUserDialog } from "views-components/dialog-forms/create-user-dialog";
 +import { HelpApiClientAuthorizationDialog } from "views-components/api-client-authorizations-dialog/help-dialog";
 +import { DeactivateDialog } from "views-components/user-dialog/deactivate-dialog";
 +import { ActivateDialog } from "views-components/user-dialog/activate-dialog";
 +import { SetupDialog } from "views-components/user-dialog/setup-dialog";
 +import { GroupsPanel } from "views/groups-panel/groups-panel";
 +import { RemoveGroupDialog } from "views-components/groups-dialog/remove-dialog";
 +import { GroupAttributesDialog } from "views-components/groups-dialog/attributes-dialog";
 +import { GroupDetailsPanel } from "views/group-details-panel/group-details-panel";
 +import { RemoveGroupMemberDialog } from "views-components/groups-dialog/member-remove-dialog";
 +import { GroupMemberAttributesDialog } from "views-components/groups-dialog/member-attributes-dialog";
 +import { PublicFavoritePanel } from "views/public-favorites-panel/public-favorites-panel";
 +import { LinkAccountPanel } from "views/link-account-panel/link-account-panel";
 +import { FedLogin } from "./fed-login";
 +import { CollectionsContentAddressPanel } from "views/collection-content-address-panel/collection-content-address-panel";
 +import { AllProcessesPanel } from "../all-processes-panel/all-processes-panel";
 +import { NotFoundPanel } from "../not-found-panel/not-found-panel";
 +import { AutoLogout } from "views-components/auto-logout/auto-logout";
 +import { RestoreCollectionVersionDialog } from "views-components/collections-dialog/restore-version-dialog";
 +import { WebDavS3InfoDialog } from "views-components/webdav-s3-dialog/webdav-s3-dialog";
 +import { pluginConfig } from "plugins";
 +import { ElementListReducer } from "common/plugintypes";
 +import { COLLAPSE_ICON_SIZE } from "views-components/side-panel-toggle/side-panel-toggle";
 +import { Banner } from "views-components/baner/banner";
 +import { InstanceTypesPanel } from "views/instance-types-panel/instance-types-panel";
 +
 +type CssRules = "root" | "container" | "splitter" | "asidePanel" | "contentWrapper" | "content";
 +
 +const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
 +    root: {
 +        paddingTop: theme.spacing.unit * 7,
 +        background: theme.palette.background.default,
 +    },
 +    container: {
 +        position: "relative",
 +    },
 +    splitter: {
 +        "& > .layout-splitter": {
 +            width: "3px",
 +        },
 +        "& > .layout-splitter-disabled": {
 +            pointerEvents: "none",
 +            cursor: "pointer",
 +        },
 +    },
 +    asidePanel: {
 +        paddingTop: theme.spacing.unit,
 +        height: "100%",
 +    },
 +    contentWrapper: {
 +        paddingTop: theme.spacing.unit,
 +        minWidth: 0,
 +    },
 +    content: {
 +        minWidth: 0,
 +        paddingLeft: theme.spacing.unit * 3,
 +        paddingRight: theme.spacing.unit * 3,
 +        // Reserve vertical space for app bar + MainContentBar
 +        minHeight: `calc(100vh - ${theme.spacing.unit * 16}px)`,
 +        display: "flex",
 +    },
 +});
 +
 +interface WorkbenchDataProps {
 +    isUserActive: boolean;
 +    isNotLinking: boolean;
 +    sessionIdleTimeout: number;
 +    sidePanelIsCollapsed: boolean;
++    isTransitioning: boolean;
++    currentSideWidth: number;
 +}
 +
 +type WorkbenchPanelProps = WithStyles<CssRules> & WorkbenchDataProps;
 +
 +const defaultSplitterSize = 90;
 +
 +const getSplitterInitialSize = () => {
 +    const splitterSize = localStorage.getItem("splitterSize");
 +    return splitterSize ? Number(splitterSize) : defaultSplitterSize;
 +};
 +
 +const saveSplitterSize = (size: number) => localStorage.setItem("splitterSize", size.toString());
 +
 +let routes = (
 +    <>
 +        <Route
 +            path={Routes.PROJECTS}
 +            component={ProjectPanel}
 +        />
 +        <Route
 +            path={Routes.COLLECTIONS}
 +            component={CollectionPanel}
 +        />
 +        <Route
 +            path={Routes.FAVORITES}
 +            component={FavoritePanel}
 +        />
 +        <Route
 +            path={Routes.ALL_PROCESSES}
 +            component={AllProcessesPanel}
 +        />
 +        <Route
 +            path={Routes.PROCESSES}
 +            component={ProcessPanel}
 +        />
 +        <Route
 +            path={Routes.TRASH}
 +            component={TrashPanel}
 +        />
 +        <Route
 +            path={Routes.SHARED_WITH_ME}
 +            component={SharedWithMePanel}
 +        />
 +        <Route
 +            path={Routes.RUN_PROCESS}
 +            component={RunProcessPanel}
 +        />
 +        <Route
 +            path={Routes.REGISTEREDWORKFLOW}
 +            component={RegisteredWorkflowPanel}
 +        />
 +        <Route
 +            path={Routes.WORKFLOWS}
 +            component={WorkflowPanel}
 +        />
 +        <Route
 +            path={Routes.SEARCH_RESULTS}
 +            component={SearchResultsPanel}
 +        />
 +        <Route
 +            path={Routes.VIRTUAL_MACHINES_USER}
 +            component={VirtualMachineUserPanel}
 +        />
 +        <Route
 +            path={Routes.VIRTUAL_MACHINES_ADMIN}
 +            component={VirtualMachineAdminPanel}
 +        />
 +        <Route
 +            path={Routes.REPOSITORIES}
 +            component={RepositoriesPanel}
 +        />
 +        <Route
 +            path={Routes.SSH_KEYS_USER}
 +            component={SshKeyPanel}
 +        />
 +        <Route
 +            path={Routes.SSH_KEYS_ADMIN}
 +            component={SshKeyAdminPanel}
 +        />
 +        <Route
 +            path={Routes.INSTANCE_TYPES}
 +            component={InstanceTypesPanel}
 +        />
 +        <Route
 +            path={Routes.SITE_MANAGER}
 +            component={SiteManagerPanel}
 +        />
 +        <Route
 +            path={Routes.KEEP_SERVICES}
 +            component={KeepServicePanel}
 +        />
 +        <Route
 +            path={Routes.USERS}
 +            component={UserPanel}
 +        />
 +        <Route
 +            path={Routes.API_CLIENT_AUTHORIZATIONS}
 +            component={ApiClientAuthorizationPanel}
 +        />
 +        <Route
 +            path={Routes.MY_ACCOUNT}
 +            component={UserProfilePanel}
 +        />
 +        <Route
 +            path={Routes.USER_PROFILE}
 +            component={UserProfilePanel}
 +        />
 +        <Route
 +            path={Routes.GROUPS}
 +            component={GroupsPanel}
 +        />
 +        <Route
 +            path={Routes.GROUP_DETAILS}
 +            component={GroupDetailsPanel}
 +        />
 +        <Route
 +            path={Routes.LINKS}
 +            component={LinkPanel}
 +        />
 +        <Route
 +            path={Routes.PUBLIC_FAVORITES}
 +            component={PublicFavoritePanel}
 +        />
 +        <Route
 +            path={Routes.LINK_ACCOUNT}
 +            component={LinkAccountPanel}
 +        />
 +        <Route
 +            path={Routes.COLLECTIONS_CONTENT_ADDRESS}
 +            component={CollectionsContentAddressPanel}
 +        />
 +    </>
 +);
 +
 +const reduceRoutesFn: (a: React.ReactElement[], b: ElementListReducer) => React.ReactElement[] = (a, b) => b(a);
 +
 +routes = React.createElement(
 +    React.Fragment,
 +    null,
 +    pluginConfig.centerPanelList.reduce(reduceRoutesFn, React.Children.toArray(routes.props.children))
 +);
 +
- const applyCollapsedState = isCollapsed => {
-     const rightPanel: Element = document.getElementsByClassName("layout-pane")[1];
-     const totalWidth: number = document.getElementsByClassName("splitter-layout")[0]?.clientWidth;
-     const rightPanelExpandedWidth = (totalWidth - COLLAPSE_ICON_SIZE) / (totalWidth / 100);
-     if (rightPanel) {
-         rightPanel.setAttribute("style", `width: ${isCollapsed ? `calc(${rightPanelExpandedWidth}% - 1rem)` : `${getSplitterInitialSize()}%`}`);
-     }
-     const splitter = document.getElementsByClassName("layout-splitter")[0];
-     isCollapsed ? splitter?.classList.add("layout-splitter-disabled") : splitter?.classList.remove("layout-splitter-disabled");
- };
- 
 +export const WorkbenchPanel = withStyles(styles)((props: WorkbenchPanelProps) => {
-     //panel size will not scale automatically on window resize, so we do it manually
-     if (props && props.sidePanelIsCollapsed) window.addEventListener("resize", () => applyCollapsedState(props.sidePanelIsCollapsed));
-     applyCollapsedState(props.sidePanelIsCollapsed);
++const { classes, sidePanelIsCollapsed, isNotLinking, isTransitioning, isUserActive, sessionIdleTimeout, currentSideWidth } = props
++
++    const applyCollapsedState = (savedWidthInPx) => {
++        const rightPanel: Element = document.getElementsByClassName("layout-pane")[1];
++        const totalWidth: number = document.getElementsByClassName("splitter-layout")[0]?.clientWidth;
++        const savedWidthInPercent = (savedWidthInPx / totalWidth) * 100
++        const rightPanelExpandedWidth = (totalWidth - COLLAPSE_ICON_SIZE) / (totalWidth / 100);
++
++        if(isTransitioning && !!rightPanel) {
++            rightPanel.setAttribute('style', `width: ${sidePanelIsCollapsed ? `calc(${savedWidthInPercent}% - 1rem)` : `${getSplitterInitialSize()}%`};`)
++        }
++
++        if (rightPanel) {
++            rightPanel.setAttribute("style", `width: ${sidePanelIsCollapsed ? `calc(${rightPanelExpandedWidth}% - 1rem)` : `${getSplitterInitialSize()}%`};`);
++        }
++        const splitter = document.getElementsByClassName("layout-splitter")[0];
++        sidePanelIsCollapsed ? splitter?.classList.add("layout-splitter-disabled") : splitter?.classList.remove("layout-splitter-disabled");
++    };
++
++    const [savedWidth, setSavedWidth] = useState<number>(0)
++
++    useEffect(()=>{
++        if (isTransitioning) setSavedWidth(currentSideWidth)
++    }, [isTransitioning, currentSideWidth])
++
++    useEffect(()=>{
++        if (isTransitioning) applyCollapsedState(savedWidth);
++        // eslint-disable-next-line react-hooks/exhaustive-deps
++    }, [isTransitioning, savedWidth])
++
++    applyCollapsedState(savedWidth);
 +
 +    return (
 +        <Grid
 +            container
 +            item
 +            xs
-             className={props.classes.root}
++            className={classes.root}
 +        >
-             {props.sessionIdleTimeout > 0 && <AutoLogout />}
++            {sessionIdleTimeout > 0 && <AutoLogout />}
 +            <Grid
 +                container
 +                item
 +                xs
-                 className={props.classes.container}
++                className={classes.container}
 +            >
 +                <SplitterLayout
-                     customClassName={props.classes.splitter}
++                    customClassName={classes.splitter}
 +                    percentage={true}
 +                    primaryIndex={0}
 +                    primaryMinSize={10}
 +                    secondaryInitialSize={getSplitterInitialSize()}
 +                    secondaryMinSize={40}
 +                    onSecondaryPaneSizeChange={saveSplitterSize}
 +                >
-                     {props.isUserActive && props.isNotLinking && (
++                    {isUserActive && isNotLinking && (
 +                        <Grid
 +                            container
 +                            item
 +                            xs
 +                            component="aside"
 +                            direction="column"
-                             className={props.classes.asidePanel}
++                            className={classes.asidePanel}
 +                        >
 +                            <SidePanel />
 +                        </Grid>
 +                    )}
 +                    <Grid
 +                        container
 +                        item
 +                        xs
 +                        component="main"
 +                        direction="column"
-                         className={props.classes.contentWrapper}
++                        className={classes.contentWrapper}
 +                    >
 +                        <Grid
 +                            item
 +                            xs
 +                        >
-                             {props.isNotLinking && <MainContentBar />}
++                            {isNotLinking && <MainContentBar />}
 +                        </Grid>
 +                        <Grid
 +                            item
 +                            xs
-                             className={props.classes.content}
++                            className={classes.content}
 +                        >
 +                            <Switch>
 +                                {routes.props.children}
 +                                <Route
 +                                    path={Routes.NO_MATCH}
 +                                    component={NotFoundPanel}
 +                                />
 +                            </Switch>
 +                        </Grid>
 +                    </Grid>
 +                </SplitterLayout>
 +            </Grid>
 +            <Grid item>
 +                <DetailsPanel />
 +            </Grid>
 +            <AdvancedTabDialog />
 +            <AttributesApiClientAuthorizationDialog />
 +            <AttributesKeepServiceDialog />
 +            <AttributesLinkDialog />
 +            <AttributesSshKeyDialog />
 +            <ChangeWorkflowDialog />
 +            <ContextMenu />
 +            <CopyCollectionDialog />
 +            <CopyMultiCollectionDialog />
 +            <CopyProcessDialog />
 +            <CreateCollectionDialog />
 +            <CreateProjectDialog />
 +            <CreateRepositoryDialog />
 +            <CreateSshKeyDialog />
 +            <CreateUserDialog />
 +            <TokenDialog />
 +            <FileRemoveDialog />
 +            <FilesUploadCollectionDialog />
 +            <GroupAttributesDialog />
 +            <GroupMemberAttributesDialog />
 +            <HelpApiClientAuthorizationDialog />
 +            <MoveCollectionDialog />
 +            <MoveProcessDialog />
 +            <MoveProjectDialog />
 +            <MultipleFilesRemoveDialog />
 +            <PublicKeyDialog />
 +            <PartialCopyToNewCollectionDialog />
 +            <PartialCopyToExistingCollectionDialog />
 +            <PartialCopyToSeparateCollectionsDialog />
 +            <PartialMoveToNewCollectionDialog />
 +            <PartialMoveToExistingCollectionDialog />
 +            <PartialMoveToSeparateCollectionsDialog />
 +            <ProcessInputDialog />
 +            <RestoreCollectionVersionDialog />
 +            <RemoveApiClientAuthorizationDialog />
 +            <RemoveGroupDialog />
 +            <RemoveGroupMemberDialog />
 +            <RemoveKeepServiceDialog />
 +            <RemoveLinkDialog />
 +            <RemoveProcessDialog />
 +            <RemoveRepositoryDialog />
 +            <RemoveSshKeyDialog />
 +            <RemoveVirtualMachineDialog />
 +            <RemoveVirtualMachineLoginDialog />
 +            <VirtualMachineAddLoginDialog />
 +            <RenameFileDialog />
 +            <RepositoryAttributesDialog />
 +            <RepositoriesSampleGitDialog />
 +            <RichTextEditorDialog />
 +            <SharingDialog />
 +            <NotFoundDialog />
 +            <Snackbar />
 +            <UpdateCollectionDialog />
 +            <UpdateProcessDialog />
 +            <UpdateProjectDialog />
 +            <UserAttributesDialog />
 +            <DeactivateDialog />
 +            <ActivateDialog />
 +            <SetupDialog />
 +            <VirtualMachineAttributesDialog />
 +            <FedLogin />
 +            <WebDavS3InfoDialog />
 +            <Banner />
 +            {React.createElement(React.Fragment, null, pluginConfig.dialogs)}
 +        </Grid>
 +    );
 +});

commit 1416f698b72de4b09350d9c2fb25c1405c3247bc
Author: Lisa Knox <lisaknox83 at gmail.com>
Date:   Thu Jan 4 14:36:00 2024 -0500

    21316: collapsed sidebar splitter no longer moves when opening details panel Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox at curii.com>

diff --git a/src/store/details-panel/details-panel-action.ts b/src/store/details-panel/details-panel-action.ts
index b708ad622c..e14c70ace7 100644
--- a/src/store/details-panel/details-panel-action.ts
+++ b/src/store/details-panel/details-panel-action.ts
@@ -19,7 +19,9 @@ export const SLIDE_TIMEOUT = 500;
 export const detailsPanelActions = unionize({
     TOGGLE_DETAILS_PANEL: ofType<{}>(),
     OPEN_DETAILS_PANEL: ofType<number>(),
-    LOAD_DETAILS_PANEL: ofType<string>()
+    LOAD_DETAILS_PANEL: ofType<string>(),
+    START_TRANSITION: ofType<{}>(),
+    END_TRANSITION: ofType<{}>(),
 });
 
 export type DetailsPanelAction = UnionOf<typeof detailsPanelActions>;
@@ -41,6 +43,7 @@ export const loadDetailsPanel = (uuid: string) =>
 
 export const openDetailsPanel = (uuid?: string, tabNr: number = 0) =>
     (dispatch: Dispatch) => {
+        startDetailsPanelTransition(dispatch)
         dispatch(detailsPanelActions.OPEN_DETAILS_PANEL(tabNr));
         if (uuid !== undefined) {
             dispatch<any>(loadDetailsPanel(uuid));
@@ -69,8 +72,16 @@ export const toggleDetailsPanel = () => (dispatch: Dispatch, getState: () => Roo
     setTimeout(() => {
         window.dispatchEvent(new Event('resize'));
     }, SLIDE_TIMEOUT);
+    startDetailsPanelTransition(dispatch)
     dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
     if (getState().detailsPanel.isOpened) {
         dispatch<any>(loadDetailsPanel(getState().detailsPanel.resourceUuid));
     }
 };
+
+const startDetailsPanelTransition = (dispatch) => {
+        dispatch(detailsPanelActions.START_TRANSITION())
+    setTimeout(() => {
+        dispatch(detailsPanelActions.END_TRANSITION())
+    }, SLIDE_TIMEOUT);
+}
\ No newline at end of file
diff --git a/src/store/details-panel/details-panel-reducer.ts b/src/store/details-panel/details-panel-reducer.ts
index 6c32551cbf..8a0e1d5cd3 100644
--- a/src/store/details-panel/details-panel-reducer.ts
+++ b/src/store/details-panel/details-panel-reducer.ts
@@ -8,12 +8,14 @@ export interface DetailsPanelState {
     resourceUuid: string;
     isOpened: boolean;
     tabNr: number;
+    isTransitioning: boolean;
 }
 
 const initialState = {
     resourceUuid: '',
     isOpened: false,
-    tabNr: 0
+    tabNr: 0,
+    isTransitioning: false
 };
 
 export const detailsPanelReducer = (state: DetailsPanelState = initialState, action: DetailsPanelAction) =>
@@ -22,4 +24,6 @@ export const detailsPanelReducer = (state: DetailsPanelState = initialState, act
         LOAD_DETAILS_PANEL: resourceUuid => ({ ...state, resourceUuid }),
         OPEN_DETAILS_PANEL: tabNr => ({ ...state, isOpened: true, tabNr }),
         TOGGLE_DETAILS_PANEL: () => ({ ...state, isOpened: !state.isOpened }),
+        START_TRANSITION: () => ({...state, isTransitioning: true}),
+        END_TRANSITION: () => ({...state, isTransitioning: false})
     });
diff --git a/src/store/side-panel/side-panel-action.ts b/src/store/side-panel/side-panel-action.ts
index e4f53ceaa6..644f76cd4a 100644
--- a/src/store/side-panel/side-panel-action.ts
+++ b/src/store/side-panel/side-panel-action.ts
@@ -6,7 +6,8 @@ import { Dispatch } from 'redux';
 import { navigateTo } from 'store/navigation/navigation-action';
 
 export const sidePanelActions = {
-    TOGGLE_COLLAPSE: 'TOGGLE_COLLAPSE'
+    TOGGLE_COLLAPSE: 'TOGGLE_COLLAPSE',
+    SET_CURRENT_WIDTH: 'SET_CURRENT_WIDTH'
 }
 
 export const navigateFromSidePanel = (id: string) =>
@@ -18,4 +19,10 @@ export const toggleSidePanel = (collapsedState: boolean) => {
     return (dispatch) => {
         dispatch({type: sidePanelActions.TOGGLE_COLLAPSE, payload: !collapsedState})
     }
+}
+
+export const setCurrentSideWidth = (width: number) => {
+    return (dispatch) => {
+        dispatch({type: sidePanelActions.SET_CURRENT_WIDTH, payload: width})
+    }
 }
\ No newline at end of file
diff --git a/src/store/side-panel/side-panel-reducer.tsx b/src/store/side-panel/side-panel-reducer.tsx
index a6ed03b6ab..0d9b1ad3df 100644
--- a/src/store/side-panel/side-panel-reducer.tsx
+++ b/src/store/side-panel/side-panel-reducer.tsx
@@ -5,14 +5,17 @@
 import { sidePanelActions } from "./side-panel-action"
 
 interface SidePanelState {
-  collapsedState: boolean
+  collapsedState: boolean,
+  currentSideWidth: number
 }
 
 const sidePanelInitialState = {
-  collapsedState: false
+  collapsedState: false,
+  currentSideWidth: 0
 }
 
 export const sidePanelReducer = (state: SidePanelState = sidePanelInitialState, action)=>{
   if(action.type === sidePanelActions.TOGGLE_COLLAPSE) return {...state, collapsedState: action.payload}
+  if(action.type === sidePanelActions.SET_CURRENT_WIDTH) return {...state, currentSideWidth: action.payload}
   return state
 }
\ No newline at end of file
diff --git a/src/views-components/side-panel-tree/side-panel-tree.tsx b/src/views-components/side-panel-tree/side-panel-tree.tsx
index 19ab3184af..42d11d7718 100644
--- a/src/views-components/side-panel-tree/side-panel-tree.tsx
+++ b/src/views-components/side-panel-tree/side-panel-tree.tsx
@@ -21,6 +21,7 @@ export interface SidePanelTreeProps {
     onItemActivation: (id: string) => void;
     sidePanelProgress?: boolean;
     isCollapsed?: boolean
+    setCurrentSideWidth: (width: number) => void
 }
 
 type SidePanelTreeActionProps = Pick<TreePickerProps<ProjectResource | string>, 'onContextMenu' | 'toggleItemActive' | 'toggleItemOpen' | 'toggleItemSelection'>;
diff --git a/src/views-components/side-panel/side-panel.tsx b/src/views-components/side-panel/side-panel.tsx
index 18aed873aa..ebcf9e41d6 100644
--- a/src/views-components/side-panel/side-panel.tsx
+++ b/src/views-components/side-panel/side-panel.tsx
@@ -2,13 +2,13 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import React from 'react';
+import React, { useRef, useEffect } from 'react';
 import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core/styles';
 import { ArvadosTheme } from 'common/custom-theme';
 import { SidePanelTree, SidePanelTreeProps } from 'views-components/side-panel-tree/side-panel-tree';
 import { Dispatch } from 'redux';
 import { connect } from 'react-redux';
-import { navigateFromSidePanel } from 'store/side-panel/side-panel-action';
+import { navigateFromSidePanel, setCurrentSideWidth } from 'store/side-panel/side-panel-action';
 import { Grid } from '@material-ui/core';
 import { SidePanelButton } from 'views-components/side-panel-button/side-panel-button';
 import { RootState } from 'store/store';
@@ -36,30 +36,62 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
 const mapDispatchToProps = (dispatch: Dispatch): SidePanelTreeProps => ({
     onItemActivation: id => {
         dispatch<any>(navigateFromSidePanel(id));
+    },
+    setCurrentSideWidth: width => {
+        dispatch<any>(setCurrentSideWidth(width))
     }
 });
 
-const mapStateToProps = ({ router, sidePanel }: RootState) => ({
+const mapStateToProps = ({ router, sidePanel, detailsPanel }: RootState) => ({
     currentRoute: router.location ? router.location.pathname : '',
-    isCollapsed: sidePanel.collapsedState
+    isCollapsed: sidePanel.collapsedState,
+    isDetailsPanelTransitioning: detailsPanel.isTransitioning
 });
 
 export const SidePanel = withStyles(styles)(
     connect(mapStateToProps, mapDispatchToProps)(
-        ({ classes, ...props }: WithStyles<CssRules> & SidePanelTreeProps & { currentRoute: string }) =>
-            <Grid item xs>
-                {props.isCollapsed ? 
-                <>
-                    <SidePanelToggle />
-                    <SidePanelCollapsed />
-                </>
-                :
-                <>
-                    <Grid className={classes.topButtonContainer}>
-                        <SidePanelButton key={props.currentRoute} />
-                        <SidePanelToggle/>
+        ({ classes, ...props }: WithStyles<CssRules> & SidePanelTreeProps & { currentRoute: string, isDetailsPanelTransitioning: boolean }) =>{
+
+        const splitPaneRef = useRef<any>(null)
+
+        useEffect(()=>{
+            const splitPane = splitPaneRef?.current as Element
+
+            if (!splitPane) return;
+
+            const observer = new ResizeObserver((entries)=>{
+                for (let i = 0; i < entries.length; i++) {
+                    const width = entries[i].contentRect.width
+                    props.setCurrentSideWidth(width)
+                }
+            })
+
+            observer.observe(splitPane)
+
+            return ()=> observer.disconnect()
+        }, [props])
+
+            return (
+                <Grid item xs>
+                        {props.isCollapsed ? 
+                            <div ref={splitPaneRef}>
+                        <>
+
+                            <SidePanelToggle />
+                            <SidePanelCollapsed />
+                        </>
+                        </div>
+                            :
+                            <>
+                        <div ref={splitPaneRef}>
+                            <Grid className={classes.topButtonContainer}>
+                                <SidePanelButton key={props.currentRoute} />
+                                <SidePanelToggle/>
+                            </Grid>
+                            <SidePanelTree {...props} />
+                        </div>
+                        </>
+                        }
                     </Grid>
-                    <SidePanelTree {...props} />
-                </>}
-            </Grid>
+        )}
     ));
diff --git a/src/views/main-panel/main-panel-root.tsx b/src/views/main-panel/main-panel-root.tsx
index e5514d8ef6..cdfd0c300f 100644
--- a/src/views/main-panel/main-panel-root.tsx
+++ b/src/views/main-panel/main-panel-root.tsx
@@ -33,6 +33,8 @@ export interface MainPanelRootDataProps {
     siteBanner: string;
     sessionIdleTimeout: number;
     sidePanelIsCollapsed: boolean;
+    isTransitioning: boolean;
+    currentSideWidth: number;
 }
 
 interface MainPanelRootDispatchProps {
@@ -44,7 +46,7 @@ type MainPanelRootProps = MainPanelRootDataProps & MainPanelRootDispatchProps &
 export const MainPanelRoot = withStyles(styles)(
     ({ classes, loading, working, user, buildInfo, uuidPrefix,
         isNotLinking, isLinkingPath, siteBanner, sessionIdleTimeout, 
-        sidePanelIsCollapsed, toggleSidePanel }: MainPanelRootProps) =>{
+        sidePanelIsCollapsed, isTransitioning, currentSideWidth}: MainPanelRootProps) =>{
         return loading
             ? <WorkbenchLoadingScreen />
             : <>
@@ -62,7 +64,13 @@ export const MainPanelRoot = withStyles(styles)(
             <Grid container direction="column" className={classes.root}>
                 {user
                     ? (user.isActive || (!user.isActive && isLinkingPath)
-                    ? <WorkbenchPanel isNotLinking={isNotLinking} isUserActive={user.isActive} sessionIdleTimeout={sessionIdleTimeout} sidePanelIsCollapsed={sidePanelIsCollapsed}/>
+                    ? <WorkbenchPanel 
+                        isNotLinking={isNotLinking}
+                        isUserActive={user.isActive}
+                        sessionIdleTimeout={sessionIdleTimeout}
+                        sidePanelIsCollapsed={sidePanelIsCollapsed}
+                        isTransitioning={isTransitioning}
+                        currentSideWidth={currentSideWidth}/>
                     : <InactivePanel />)
                     : <LoginPanel />}
             </Grid>
diff --git a/src/views/main-panel/main-panel.tsx b/src/views/main-panel/main-panel.tsx
index fac3da6715..264390a8b3 100644
--- a/src/views/main-panel/main-panel.tsx
+++ b/src/views/main-panel/main-panel.tsx
@@ -24,6 +24,8 @@ const mapStateToProps = (state: RootState): MainPanelRootDataProps => {
         siteBanner: state.auth.config.clusterConfig.Workbench.SiteName,
         sessionIdleTimeout: parse(state.auth.config.clusterConfig.Workbench.IdleTimeout, 's') || 0,
         sidePanelIsCollapsed: state.sidePanel.collapsedState,
+        isTransitioning: state.detailsPanel.isTransitioning,
+        currentSideWidth: state.sidePanel.currentSideWidth
     };
 };
 
diff --git a/src/views/workbench/workbench.tsx b/src/views/workbench/workbench.tsx
index bc2396f7cf..59df6d01e2 100644
--- a/src/views/workbench/workbench.tsx
+++ b/src/views/workbench/workbench.tsx
@@ -2,7 +2,7 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { StyleRulesCallback, WithStyles, withStyles } from "@material-ui/core/styles";
 import { Route, Switch } from "react-router";
 import { ProjectPanel } from "views/project-panel/project-panel";
@@ -149,6 +149,8 @@ interface WorkbenchDataProps {
     isNotLinking: boolean;
     sessionIdleTimeout: number;
     sidePanelIsCollapsed: boolean;
+    isTransitioning: boolean;
+    currentSideWidth: number;
 }
 
 type WorkbenchPanelProps = WithStyles<CssRules> & WorkbenchDataProps;
@@ -287,38 +289,55 @@ routes = React.createElement(
     pluginConfig.centerPanelList.reduce(reduceRoutesFn, React.Children.toArray(routes.props.children))
 );
 
-const applyCollapsedState = isCollapsed => {
-    const rightPanel: Element = document.getElementsByClassName("layout-pane")[1];
-    const totalWidth: number = document.getElementsByClassName("splitter-layout")[0]?.clientWidth;
-    const rightPanelExpandedWidth = (totalWidth - COLLAPSE_ICON_SIZE) / (totalWidth / 100);
-    if (rightPanel) {
-        rightPanel.setAttribute("style", `width: ${isCollapsed ? `calc(${rightPanelExpandedWidth}% - 1rem)` : `${getSplitterInitialSize()}%`}`);
-    }
-    const splitter = document.getElementsByClassName("layout-splitter")[0];
-    isCollapsed ? splitter?.classList.add("layout-splitter-disabled") : splitter?.classList.remove("layout-splitter-disabled");
-};
-
 export const WorkbenchPanel = withStyles(styles)((props: WorkbenchPanelProps) => {
-    //panel size will not scale automatically on window resize, so we do it manually
-    if (props && props.sidePanelIsCollapsed) window.addEventListener("resize", () => applyCollapsedState(props.sidePanelIsCollapsed));
-    applyCollapsedState(props.sidePanelIsCollapsed);
+const { classes, sidePanelIsCollapsed, isNotLinking, isTransitioning, isUserActive, sessionIdleTimeout, currentSideWidth } = props
+
+    const applyCollapsedState = (savedWidthInPx) => {
+        const rightPanel: Element = document.getElementsByClassName("layout-pane")[1];
+        const totalWidth: number = document.getElementsByClassName("splitter-layout")[0]?.clientWidth;
+        const savedWidthInPercent = (savedWidthInPx / totalWidth) * 100
+        const rightPanelExpandedWidth = (totalWidth - COLLAPSE_ICON_SIZE) / (totalWidth / 100);
+
+        if(isTransitioning && !!rightPanel) {
+            rightPanel.setAttribute('style', `width: ${sidePanelIsCollapsed ? `calc(${savedWidthInPercent}% - 1rem)` : `${getSplitterInitialSize()}%`};`)
+        }
+
+        if (rightPanel) {
+            rightPanel.setAttribute("style", `width: ${sidePanelIsCollapsed ? `calc(${rightPanelExpandedWidth}% - 1rem)` : `${getSplitterInitialSize()}%`};`);
+        }
+        const splitter = document.getElementsByClassName("layout-splitter")[0];
+        sidePanelIsCollapsed ? splitter?.classList.add("layout-splitter-disabled") : splitter?.classList.remove("layout-splitter-disabled");
+    };
+
+    const [savedWidth, setSavedWidth] = useState<number>(0)
+
+    useEffect(()=>{
+        if (isTransitioning) setSavedWidth(currentSideWidth)
+    }, [isTransitioning, currentSideWidth])
+
+    useEffect(()=>{
+        if (isTransitioning) applyCollapsedState(savedWidth);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [isTransitioning, savedWidth])
+
+    applyCollapsedState(savedWidth);
 
     return (
         <Grid
             container
             item
             xs
-            className={props.classes.root}
+            className={classes.root}
         >
-            {props.sessionIdleTimeout > 0 && <AutoLogout />}
+            {sessionIdleTimeout > 0 && <AutoLogout />}
             <Grid
                 container
                 item
                 xs
-                className={props.classes.container}
+                className={classes.container}
             >
                 <SplitterLayout
-                    customClassName={props.classes.splitter}
+                    customClassName={classes.splitter}
                     percentage={true}
                     primaryIndex={0}
                     primaryMinSize={10}
@@ -326,14 +345,14 @@ export const WorkbenchPanel = withStyles(styles)((props: WorkbenchPanelProps) =>
                     secondaryMinSize={40}
                     onSecondaryPaneSizeChange={saveSplitterSize}
                 >
-                    {props.isUserActive && props.isNotLinking && (
+                    {isUserActive && isNotLinking && (
                         <Grid
                             container
                             item
                             xs
                             component="aside"
                             direction="column"
-                            className={props.classes.asidePanel}
+                            className={classes.asidePanel}
                         >
                             <SidePanel />
                         </Grid>
@@ -344,18 +363,18 @@ export const WorkbenchPanel = withStyles(styles)((props: WorkbenchPanelProps) =>
                         xs
                         component="main"
                         direction="column"
-                        className={props.classes.contentWrapper}
+                        className={classes.contentWrapper}
                     >
                         <Grid
                             item
                             xs
                         >
-                            {props.isNotLinking && <MainContentBar />}
+                            {isNotLinking && <MainContentBar />}
                         </Grid>
                         <Grid
                             item
                             xs
-                            className={props.classes.content}
+                            className={classes.content}
                         >
                             <Switch>
                                 {routes.props.children}

commit 458978d2ac71811c72156f7a7a39e165aedc7357
Author: Lisa Knox <lisaknox83 at gmail.com>
Date:   Thu Dec 28 12:38:49 2023 -0500

    21316: centered collapse icon Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox at curii.com>

diff --git a/src/views-components/side-panel-toggle/side-panel-toggle.tsx b/src/views-components/side-panel-toggle/side-panel-toggle.tsx
index 47d34216cc..a7ec9d7d61 100644
--- a/src/views-components/side-panel-toggle/side-panel-toggle.tsx
+++ b/src/views-components/side-panel-toggle/side-panel-toggle.tsx
@@ -27,6 +27,7 @@ const SidePanelToggle = (props: collapseButtonProps) => {
         },
         icon: {
             opacity: '0.5',
+            marginBottom: '0.54rem'
         },
     }
 

commit 5c7b87f62d045b50e177f788ecdb907ab5402ad7
Merge: bf64b82d45 adbbc9e3c7
Author: Lisa Knox <lisaknox83 at gmail.com>
Date:   Thu Dec 21 09:06:01 2023 -0500

    Merge branch '21128-toolbar-context-menu'
    
    closes #21128
    
    Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox at curii.com>


-----------------------------------------------------------------------


hooks/post-receive
-- 




More information about the arvados-commits mailing list