[19.0][IMP] fs_folder: Disable FsFolderItem clicks while processing

fs_folder/static/src/fs_folder/fs_folder.esm.js

@@ -22,7 +22,14 @@ export class FsFolder extends Component {
         this.dropzone = useRef("dropzone");
         this.dialog = useService("dialog");
         this.fileViewer = usePreviewIframeViewer();
-        this.state = useState({path: [], data: [], copy: false, sort: [], hide: []});
+        this.state = useState({
+            path: [],
+            data: [],
+            copy: false,
+            sort: [],
+            hide: [],
+            isItemActionProcessing: false,
+        });
         this.notificationService = useService("fs_folder_notification");
         useBus(this.notificationService.bus, "folder_modified", this.onFolderModified);
         useEffect(
@@ -36,17 +43,26 @@ export class FsFolder extends Component {
         );
         useDropzone(this.dropzone, this.onDropFile.bind(this), "");
         useSubEnv({
-            onClickDirectory: (record) => {
-                this.onClickDirectory(record);
-            },
-            onClickPreview: (record) => {
-                this.onClickPreview(record);
-            },
-            onClickDownload: (record) => {
-                this.onClickDownload(record);
-            },
+            onClickDirectory: (record) =>
+                this.withItemActionLock(() => this.onClickDirectory(record)),
+            onClickPreview: (record) =>
+                this.withItemActionLock(() => this.onClickPreview(record)),
+            onClickDownload: (record) =>
+                this.withItemActionLock(() => this.onClickDownload(record)),
+            onRunItemAction: (callback) => this.withItemActionLock(callback),
         });
     }
+    async withItemActionLock(callback) {
+        if (this.state.isItemActionProcessing) {
+            return;
+        }
+        this.state.isItemActionProcessing = true;
+        try {
+            return await callback();
+        } finally {
+            this.state.isItemActionProcessing = false;
+        }
+    }
     onFolderModified(event) {
         const {resId, resModel, fieldName} = event.detail;
         if (
@@ -224,7 +240,7 @@ export class FsFolder extends Component {
     }
     async onClickDirectory(record) {
         this.state.path = [...this.state.path, record.name];
-        this.setData();
+        await this.setData();
     }
     async onClickDownload(record) {
         await downloadFile(

fs_folder/static/src/fs_folder/fs_folder.scss

@@ -1,5 +1,8 @@
 .o_field_fs_folder {
     width: 100%;
+    .o_fs_folder_item_actions_locked {
+        pointer-events: none;
+    }
     .o_fs_folder_clickable {
         cursor: pointer;
     }

fs_folder/static/src/fs_folder/fs_folder.xml

@@ -144,7 +144,9 @@
                         </th>
                     </tr>
                 </thead>
-                <tbody>
+                <tbody
+                    t-att-class="state.isItemActionProcessing ? 'o_fs_folder_item_actions_locked' : ''"
+                >
                     <t t-foreach="state.data" t-as="record" t-key="record.name">
                         <FsFolderItem
                             record="record"

fs_folder/static/src/fs_folder/fs_folder_item/fs_folder_item.esm.js

@@ -22,11 +22,11 @@ export class FsFolderItem extends Component {
                 return a.sequence < b.sequence ? -1 : 1;
             });
     }
-    onClick() {
+    async onClick() {
         if (this.props.record.type === "directory") {
-            this.env.onClickDirectory(this.props.record);
+            await this.env.onClickDirectory(this.props.record);
         } else {
-            this.env.onClickPreview(this.props.record);
+            await this.env.onClickPreview(this.props.record);
         }
     }
 }

fs_folder/static/src/fs_folder/fs_folder_item/fs_folder_item.xml

@@ -41,7 +41,7 @@
                         <t t-foreach="items" t-as="item" t-key="item_index">
                             <DropdownItem
                                 class="item.class_name"
-                                onSelected="() => item.callback(this.props.record)"
+                                onSelected="() => this.env.onRunItemAction(() => item.callback(this.props.record))"
                                 t-on-pointerdown.prevent="() => {}"
                             >
                                 <i