jodit icon indicating copy to clipboard operation
jodit copied to clipboard

FileBrowser Upload Button Not Disabled Based on Permissions

Open WatchfulEyeOfZod opened this issue 11 months ago • 1 comments

Jodit Version: 4.0.2

Browser: Chrome OS: Mac Is React App: False

Description

The Upload button on the FileBrowser is not Enabled/Disabled when changing sources based on the permissions returned by the back end. This seems to be due to the fact that the Upload Button is declared in config.ts with a getContent function which replaces the button with a container containing the UIFileInput class.

Code

Config.prototype.controls.filebrowser = {
	upload: {
		icon: 'plus',
		isInput: true,
		// isDisabled: (browser: IFileBrowser): boolean =>
		// 	!browser.dataProvider.canI('FileUpload'),
		isDisabled: (browser: IFileBrowser): boolean => {

                         // THIS FUNCTION DOES NOT EVER FIRE
                         // The getContent section below replaces the HTML of the element and therefore
                         // The button is not iterated through in the toolbar and is not enabled/disabled

			console.log('Checking Disabled Status of Upload Button');
			return !browser.dataProvider.canI('FileUpload');
		},
		getContent: (filebrowser: IFileBrowser): HTMLElement => {
			const btn = new UIFileInput(filebrowser, {
				onlyImages: filebrowser.state.onlyImages
			});
			filebrowser.e.fire('bindUploader.filebrowser', btn.container);
			return btn.container;
		}
	} as IControlType,

Expected behavior:

When the permission check !browser.dataProvider.canI('FileUpload'); returns false, this button should be disabled.

Actual behavior:

The Upload button is not enabled / disabled base on the permissions response - the isDisabled function is never called on the upload button at all.

WatchfulEyeOfZod avatar Mar 10 '24 04:03 WatchfulEyeOfZod

After a LOT of poking around, the solution to this is actually pretty simple:

The issue is that when getContent is used, the object becomes a ToolbarContent which extends UIButton, and there for the update function the is in the ToolbarButton is never invoked. This patch fixes that without changing all the inheritance which may be a bigger lift.

diff --git a/src/modules/toolbar/button/content.ts b/src/modules/toolbar/button/content.ts
index 5274cfab..09f33a2d 100644
--- a/src/modules/toolbar/button/content.ts
+++ b/src/modules/toolbar/button/content.ts
@@ -43,6 +43,10 @@ export class ToolbarContent<T extends IViewBased = IViewBased>
                        );
                }

+               this.state.disabled = this.control.isDisabled?.(this.j, this) || false;
+               this.state.activated = this.control.isActive?.(this.j, this) || false;
+               this.control.update?.(this.j, this);
+
                super.update();
        }

WatchfulEyeOfZod avatar Mar 11 '24 16:03 WatchfulEyeOfZod