Merge pull request #1437 from plone/issue-1436

Fix browsing large folders with `selectableTypes` constraint
plone · Feb 19, 2025 · ee76f94 · ee76f94
2 parents afd8870 + fc88196
commit ee76f94
Show file tree

Hide file tree

Showing 7 changed files with 213 additions and 192 deletions.
diff --git a/src/pat/contentbrowser/README.md b/src/pat/contentbrowser/README.md
@@ -18,6 +18,8 @@ Show a widget to select items in an offcanvas miller-column browser.
 |          rootUrl           | string  |                                         |                                                               Browsing/searching root url.                                                                |
 |          basePath          | string  |            set to rootPath.             |                                                             Start browse/search in this path.                                                             |
 |        contextPath         | string  |                                         |                         Path of the object, which is currently edited. If this path is given, this object will not be selectable.                         |
+|       selectableTypes      |  array  |                   []                    |                                                           List of portal_types to be selectable                                                           |
+|       browseableTypes      |  array  |               ["Folder"]                |                                                           List of portal_types to be browseable                                                           |
 |         favorites          |  array  |                   []                    |     Array of objects. These are favorites, which can be used to quickly jump to different locations. Objects have the attributes "title" and "path".      |
 |    maximumSelectionSize    | integer |                   -1                    |            The maximum number of items that can be selected in a multi-select control. If this number is less than 1 selection is not limited.            |
 |           mode             | string  |                "browse"                 |                                                            Toggle between "browse" and "search"                                                           |

diff --git a/src/pat/contentbrowser/contentbrowser.js b/src/pat/contentbrowser/contentbrowser.js
@@ -34,6 +34,7 @@ parser.addArgument("base-path");
 parser.addArgument("context-path");
 parser.addArgument("maximum-selection-size");
 parser.addArgument("selectable-types");
+parser.addArgument("browseable-types");
 parser.addArgument("separator");
 parser.addArgument("selection");
 parser.addArgument("selection-template");

diff --git a/src/pat/contentbrowser/src/App.svelte b/src/pat/contentbrowser/src/App.svelte
@@ -23,6 +23,7 @@
     export let rootUrl = "";
     export let basePath = "";
     export let selectableTypes = [];
+    export let browseableTypes = ["Folder"];
     export let maximumSelectionSize = -1;
     export let separator;
     export let selection = [];
@@ -73,6 +74,7 @@
         rootUrl: rootUrl,
         basePath: basePath,
         selectableTypes: selectableTypes,
+        browseableTypes: browseableTypes,
         maximumSelectionSize: maximumSelectionSize,
         separator: separator,
         selection: selection,

diff --git a/src/pat/contentbrowser/src/ContentBrowser.svelte b/src/pat/contentbrowser/src/ContentBrowser.svelte
@@ -323,7 +323,14 @@
     }
 
     function itemInPath(item) {
-        return $config.mode == "browse" && $currentPath.indexOf(item.path) != -1;
+        const item_path = item.path.split("/");
+        const curr_path = $currentPath.split("/");
+        let in_path = true;
+        for(const idx in item_path) {
+            // check path parts to be equal
+            in_path = in_path && (item_path[idx] === curr_path[idx]);
+        }
+        return in_path;
     }
 
     const searchItemsKeyup = utils.debounce(async (e) => {
@@ -430,7 +437,7 @@
                 </div>
                 <RecentlyUsed on:selectItem={selectRecentlyUsed} />
                 <Favorites on:selectItem={selectFavorite} />
-                {#if $config.uploadEnabled}
+                {#if $config.uploadEnabled && $config.mode == "browse"}
                     <div class="ms-2">
                         <button
                             type="button"

diff --git a/src/pat/contentbrowser/src/ContentStore.js b/src/pat/contentbrowser/src/ContentStore.js
@@ -9,6 +9,7 @@ export default function (config, pathCache) {
             vocabularyUrl: config.vocabularyUrl,
             attributes: config.attributes,
             pageSize: config.pageSize,
+            browseableTypes: config.browseableTypes,
         };
         query = {
             ...defaults,

diff --git a/src/pat/contentbrowser/src/utils.js b/src/pat/contentbrowser/src/utils.js
@@ -11,6 +11,7 @@ export async function request({
     searchPath = null,
     levelInfoPath = null,
     selectableTypes = [],
+    browseableTypes = [],
     pageSize = 100,
     page = 1,
 }) {
@@ -30,6 +31,15 @@ export async function request({
             sort_on: "getObjPositionInParent",
             sort_order: "ascending",
         };
+        if (selectableTypes.length) {
+            // we need to append browseableTypes here in order to
+            // preserve browsing subitems
+            vocabQuery.criteria.push({
+                i: "portal_type",
+                o: "plone.app.querystring.operation.list.contains",
+                v: selectableTypes.concat(browseableTypes),
+            })
+        }
     }
     if (levelInfoPath) {
         // query exact path
@@ -222,5 +232,5 @@ export function formatDate(dateval) {
     // see: https://github.com/plone/mockup/issues/1429
     const d = Date.parse(dateval);
     const i18n = new I18n();
-    return new Date(d).toLocaleString(i18n.currentLanguage.replace("_", "-"));    
+    return new Date(d).toLocaleString(i18n.currentLanguage.replace("_", "-"));
 }