19783: All done
authorPeter Amstutz <peter.amstutz@curii.com>
Fri, 9 Dec 2022 04:31:10 +0000 (23:31 -0500)
committerPeter Amstutz <peter.amstutz@curii.com>
Fri, 9 Dec 2022 04:31:10 +0000 (23:31 -0500)
Arvados-DCO-1.1-Signed-off-by: Peter Amstutz <peter.amstutz@curii.com>

src/store/side-panel-tree/side-panel-tree-actions.ts
src/store/tree-picker/tree-picker-actions.ts
src/views-components/projects-tree-picker/projects-tree-picker.tsx

index dd56b42870d2486a5d887caee3f54a3b134eb447..f6015fbfa0c9d4f6201373eb4bed1f5c71708a05 100644 (file)
@@ -20,7 +20,7 @@ import { CategoriesListReducer } from 'common/plugintypes';
 import { pluginConfig } from 'plugins';
 
 export enum SidePanelTreeCategory {
-    PROJECTS = 'Projects',
+    PROJECTS = 'Home Projects',
     SHARED_WITH_ME = 'Shared with me',
     PUBLIC_FAVORITES = 'Public Favorites',
     FAVORITES = 'My Favorites',
index e6c4e09b721a22a4d6eac4242dd4fe0e269ee0a9..cabc9f7211ca40d279677803895696bc8efebafd 100644 (file)
@@ -233,7 +233,7 @@ export const initUserProject = (pickerId: string) =>
             dispatch(receiveTreePickerData({
                 id: '',
                 pickerId,
-                data: [{ uuid, name: 'Projects' }],
+                data: [{ uuid, name: 'Home Projects' }],
                 extractNodeData: value => ({
                     id: value.uuid,
                     status: TreeNodeStatus.INITIAL,
index 13f43e8122181ba7d40a1fc1452814c0d76e8b60..de7362d93cdd70b19086b7ae1d67a4a622baad48 100644 (file)
@@ -42,11 +42,14 @@ interface ProjectsTreePickerActionProps {
     onCollectionFilter: (value: string) => void;
 }
 
-const mapStateToProps = (state: RootState, props: ToplevelPickerProps): ProjectsTreePickerSearchProps => ({
-    projectSearch: state.treePickerSearch.projectSearchValues[props.pickerId],
-    collectionFilter: state.treePickerSearch.collectionFilterValues[props.pickerId],
-    ...props
-});
+const mapStateToProps = (state: RootState, props: ToplevelPickerProps): ProjectsTreePickerSearchProps => {
+    const { search } = getProjectsTreePickerIds(props.pickerId);
+    return {
+        ...props,
+        projectSearch: state.treePickerSearch.projectSearchValues[search],
+        collectionFilter: state.treePickerSearch.collectionFilterValues[search],
+    };
+};
 
 const mapDispatchToProps = (dispatch: Dispatch, props: ToplevelPickerProps): (ProjectsTreePickerActionProps & DispatchProp) => {
     const { home, shared, favorites, publicFavorites, search } = getProjectsTreePickerIds(props.pickerId);
@@ -74,17 +77,21 @@ const mapDispatchToProps = (dispatch: Dispatch, props: ToplevelPickerProps): (Pr
     }
 };
 
-type CssRules = 'pickerHeight' | 'searchFlex';
+type CssRules = 'pickerHeight' | 'searchFlex' | 'scrolledBox';
 
 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     pickerHeight: {
-        height: "80vh"
+        height: "70vh"
     },
     searchFlex: {
         display: "flex",
         justifyContent: "space-around",
         paddingBottom: "1em"
     },
+    scrolledBox: {
+        height: "100%",
+        overflow: "scroll"
+    }
 });
 
 type ProjectsTreePickerCombinedProps = ToplevelPickerProps & ProjectsTreePickerSearchProps & ProjectsTreePickerActionProps & DispatchProp & WithStyles<CssRules>;
@@ -128,34 +135,39 @@ export const ProjectsTreePicker = connect(mapStateToProps, mapDispatchToProps)(
                     includeFiles: this.props.includeFiles,
                     showSelection: this.props.showSelection,
                     options: this.props.options,
+                    toggleItemActive: this.props.toggleItemActive,
+                    toggleItemSelection: this.props.toggleItemSelection,
                     relatedTreePickers,
                     disableActivation,
                 };
                 return <div className={this.props.classes.pickerHeight} >
                     <span className={this.props.classes.searchFlex}>
-                        <SearchInput value="" label="Search Projects" selfClearProp='' onSearch={onProjectSearch} debounce={200} />
-                        <SearchInput value="" label="Filter Collections inside Projects" selfClearProp='' onSearch={onCollectionFilter} debounce={200} />
+                        <SearchInput value="" label="Search all Projects" selfClearProp='' onSearch={onProjectSearch} debounce={200} />
+                        {this.props.includeCollections &&
+                            <SearchInput value="" label="Filter Collections inside Projects" selfClearProp='' onSearch={onCollectionFilter} debounce={200} />}
                     </span>
 
-                    {this.props.projectSearch !== "" ?
-                        <div data-cy="projects-tree-search-picker">
-                            <SearchProjectsPicker {...p} pickerId={search} />
-                        </div>
-                        :
-                        <>
-                            <div data-cy="projects-tree-home-tree-picker">
-                                <HomeTreePicker {...p} pickerId={home} />
-                            </div>
-                            <div data-cy="projects-tree-shared-tree-picker">
-                                <SharedTreePicker {...p} pickerId={shared} />
-                            </div>
-                            <div data-cy="projects-tree-public-favourites-tree-picker">
-                                <PublicFavoritesTreePicker {...p} pickerId={publicFavorites} />
-                            </div>
-                            <div data-cy="projects-tree-favourites-tree-picker">
-                                <FavoritesTreePicker {...p} pickerId={favorites} />
+                    <div className={this.props.classes.scrolledBox}>
+                        {this.props.projectSearch ?
+                            <div data-cy="projects-tree-search-picker">
+                                <SearchProjectsPicker {...p} pickerId={search} />
                             </div>
-                        </>}
+                            :
+                            <>
+                                <div data-cy="projects-tree-home-tree-picker">
+                                    <HomeTreePicker {...p} pickerId={home} />
+                                </div>
+                                <div data-cy="projects-tree-shared-tree-picker">
+                                    <SharedTreePicker {...p} pickerId={shared} />
+                                </div>
+                                <div data-cy="projects-tree-public-favourites-tree-picker">
+                                    <PublicFavoritesTreePicker {...p} pickerId={publicFavorites} />
+                                </div>
+                                <div data-cy="projects-tree-favourites-tree-picker">
+                                    <FavoritesTreePicker {...p} pickerId={favorites} />
+                                </div>
+                            </>}
+                    </div>
                 </div >;
             }
         }));