Custom FileAction not shown

Hi,

I’m currently developing a custom Nextcloud app, and I’m trying to add a custom action to the standard ‘Files’ app for PDF documents in the ‘All files’ list.

The first goal is to add a ‘Direct sign’ action that will send the selected PDF to an external signing service via REST and open the viewer in a new tab so that it can be signed.

I created the app here and set up the dev environment with Docker; it’s version 34.

My script is loaded, but I think I’ve done it the wrong way because I can’t see any custom actions in the Files UI.

This is my Application.php file, which loads the JavaScript file.

class Application extends App implements IBootstrap {
	public const APP_ID = 'signapp';

	/** @psalm-suppress PossiblyUnusedMethod */
	public function __construct() {
		parent::__construct(self::APP_ID);
		
	}

	public function register(IRegistrationContext $context): void {
		Util::addScript(self::APP_ID, self::APP_ID. '-pdfContextMenu', 'files');
	}

	public function boot(IBootContext $context): void {
	}
}

Here is my JavaScript code. In the console, I can see ‘load pdfContextMenu.js’ so loading should not be the problem. However, the enabled function is neither entered nor executed.

import {
	FileAction,
	registerFileAction,
	FileListAction,
	registerFileListAction,
} from "@nextcloud/files";
import { t } from "@nextcloud/l10n";

import SvgIcon from "../img/file-sign.svg";
console.log("load pdfContextMenu.js");

registerFileAction(
	new FileAction({
		id: "sign_file_local",
		displayName: () => t("sign_file", "sign file"),
		mime: "application/pdf",
		enabled: (nodes) => {
			console.log("Test enabled for nodes", nodes);
			return nodes.every((node) => node.mime === "application/pdf");
		},
		iconSvgInline: () => SvgIcon,
		async exec(file, view, dir) {
			console.log("Demo");
			return true;
		},
	}),
);

registerFileListAction(
	new FileListAction({
		id: "sign_file_local_list",
		displayName: () => t("sign_file_list", "sign file (list)"),
		mime: "application/pdf",
		iconSvgInline: () => SvgIcon,
		enabled: (nodes) => {
			console.log("Test list enabled for nodes", nodes);
			return nodes.every((node) => node.mime === "application/pdf");
		},
		exec: (files) => {
			console.log("Demo list");
		},
	}),
);

Is it possible to add one or more custom actions like this, and if so, what is required?

Once the first goal has been achieved, I would like to add an action that opens a modal. Inside the modal, the user has to enter an email address and send the document there for remote signing.

Thank you in advance, and kind regards.

Jan

Had to use node.js v24.x and @nextcloud/files in version >=4.0.0.

Works fine now.