(NII-Proposal) add plugin architecture for file actions by yacchin1205 · Pull Request #841 · CenterForOpenScience/angular-osf

yacchin1205 · 2026-01-05T13:09:47Z

This Draft Pull Request is for reference purposes. The details will be discussed in the COS-NII meeting.

Ticket: []
Feature flag: n/a

Purpose

Add a plugin architecture for file browser actions (context menu and toolbar). Extensions are included in the codebase but can be enabled/disabled at build time via extensions.config.ts.

Summary of Changes

Add FileActionExtension interface for menu/toolbar/both targets
Add ExtensionRegistry service for dynamic extension loading
Add extensions.config.ts for build-time configuration
Add "Copy Link" as example extension (in Share submenu)
Add "OnlyOffice" as example extension (dummy implementation)

See docs/file-extensions.md for usage.

Screenshot(s)

Example: Copy Link

extensions.config.ts:

export const extensionConfig: ExtensionConfig[] = [
  {
    load: () => import('./extensions/copy-links'),
    factory: 'copyLinksExtensionFactory',
    enabled: true,
  },
];

Copy Link (Menu Item):

Example: OnlyOffice Integration (dummy)

extensions.config.ts:

export const extensionConfig: ExtensionConfig[] = [
  // ... other extensions ...

  // Edit by OnlyOffice
  {
    load: () => import('./extensions/onlyoffice'),
    factory: 'editByOnlyOfficeExtensionFactory',
    enabled: true,
    config: { editorUrl: 'https://...' },
  },
  // Create File
  {
    load: () => import('./extensions/onlyoffice'),
    factory: 'createFileExtensionFactory',
    enabled: true,
    config: { editorUrl: 'https://...' },
  },
];

Edit by OnlyOffice(Menu Item/Toolbar Item in the file detail):

screenshot-edit-with-onlyoffice-in-detail

Create File (Toolbar Item in the file list):

Side Effects

New prebuild, prestart, pretest npm scripts that generate extensions.config.ts
src/app/extensions.config.ts is now git-ignored (generated from extensions.config.default.ts)

QA Notes

Test file context menu on file list and file detail pages
Verify "Copy Link" appears in Share submenu for files
Verify extensions can be enabled/disabled via extensions.config.ts

- Add FileActionExtension for menu/toolbar/both targets - Add ExtensionRegistry service for dynamic extension loading - Add extensions.config.ts for configuration - Add Copy Link as example extension - Add OnlyOffice as example extension (dummy implementation) See docs/file-extensions.md for usage.

nsemets

Overall, the extension system appears well-designed. I reviewed it as I would a standard PR to ensure everything is in order and to identify any potential issues. I have added some questions and suggestions for consideration. Additionally, I am wondering about translations: are they required in this case?

nsemets · 2026-01-12T11:26:29Z

src/app/core/provider/extension.initialization.provider.ts

+async function loadExtension(extConfig: ExtensionConfig, registry: ExtensionRegistry): Promise<void> {
+  const module = await extConfig.load();
+  const factory = (module as Record<string, FactoryFunction>)[extConfig.factory];
+
+  if (typeof factory !== 'function') {
+    throw new Error(`Extension factory "${extConfig.factory}" not found in module`);
+  }
+
+  const extensions = factory(extConfig.config);
+  registry.register(extensions);
+}


It’s better to add error handling here to be safe.

nsemets · 2026-01-12T11:30:49Z

src/app/core/provider/extension.initialization.provider.ts

+export const EXTENSION_INITIALIZATION_PROVIDER: Provider = {
+  provide: APP_INITIALIZER,
+  useFactory: (registry: ExtensionRegistry) => {
+    return () => loadExtensions(registry);
+  },
+  deps: [ExtensionRegistry],
+  multi: true,
+};


APP_INITIALIZER is deprecated in favor of theprovideAppInitializer function. Use export const EXTENSION_INITIALIZATION_PROVIDER = provideExtensionInitialization();.

nsemets · 2026-01-12T11:32:35Z

src/app/core/provider/extension.initialization.provider.ts

+  for (const ext of extensionConfig) {
+    if (!ext.enabled) continue;
+    await loadExtension(ext, registry);
+  }


I think it is better to use parallel loading with Promise.all or Promise.allSettled.

nsemets · 2026-01-12T11:43:32Z

src/app/shared/components/file-menu/file-menu.component.ts


+  private actionContext = computed((): FileActionContext => {
+    const file = this.file();
+    if (!file) throw new Error('file is required for actionContext');


We need to add a translation key here.

nsemets · 2026-01-12T11:50:54Z

src/app/shared/components/file-menu/file-menu.component.html

+        [class.p-disabled]="item.disabled"
+        [attr.aria-disabled]="item.disabled ?? false"


Why do we need it? PrimeNG's TieredMenu should handle disabled items automatically.

nsemets · 2026-01-12T12:10:11Z

src/app/features/files/pages/file-detail/file-detail.component.ts


+  protected actionContext = computed((): FileActionContext => {
+    const file = this.file();
+    if (!file) throw new Error('file is required for actionContext');


Need translation key.

nsemets · 2026-01-12T12:11:23Z

src/app/features/files/pages/files/files.component.ts

    () => this.isButtonDisabled() || (this.googleFilePickerComponent()?.isGFPDisabled() ?? false)
  );

+  protected actionContext = computed((): FileActionContext => {


Suggested change

protected actionContext = computed((): FileActionContext => {

actionContext = computed((): FileActionContext => {

nsemets · 2026-01-12T12:11:41Z

src/app/features/files/pages/files/files.component.ts


+  protected actionContext = computed((): FileActionContext => {
+    const folder = this.currentFolder();
+    if (!folder) throw new Error('folder is required for actionContext');


Add translation key.

nsemets · 2026-01-12T12:14:30Z

src/app/features/files/pages/files/files.component.ts

+    const extensions = this.extensionRegistry
+      .extensions()
+      .filter((ext) => !ext.parentId)
+      .filter((ext) => !ext.visible || ext.visible(ctx));


Can we use only 1 filter?

nsemets · 2026-01-12T12:15:46Z

src/app/features/files/pages/files/files.extensions.spec.ts

Why do we need it as separate file? Also, need improvements.

futa-ikeda · 2026-01-12T18:31:29Z

docs/file-extensions.md

+  return [
+    {
+      id: 'copy-link',
+      label: 'Copy Link',


This should be a translatable string.

yacchin1205 · 2026-01-13T22:17:35Z

@nsemets @futa-ikeda Thanks for the review! I'll take a look at each comment and work on addressing them.

futa-ikeda · 2026-01-13T23:52:14Z

src/app/extensions/onlyoffice/create-file.ts

+          new: 'true',
+          path: ctx.target.path!,
+        });
+        window.open(`${config.editorUrl}?${params}`, '_blank');


From our conversation at ARB: is there some changes to WaterButler and/or GravyValet that is needed to support this feature?

futa-ikeda · 2026-01-13T23:53:00Z

src/app/extensions/onlyoffice/edit-by-onlyoffice.ts

+      icon: 'fas fa-edit',
+      command: (ctx) => {
+        const editorUrl = `${config.editorUrl}?fileId=${ctx.target.id}`;
+        window.open(editorUrl, '_blank');


Similar question here: Will this feature need some changes in WaterButler and/or GravyValet

yacchin1205 · 2026-01-22T05:13:23Z

Hi @nsemets @futa-ikeda — thanks a lot for reviewing!
Following the COS–NII meeting advice, I rebuilt this using a feature-flag approach and opened a new PR (#857).
I’d appreciate your thoughts on #857 when you have time.
(For now, I’d prefer to treat the OnlyOffice discussion separately. 🙏 )

yacchin1205 force-pushed the feature/file-menu-extension-upstream branch from ceb269e to 9f95349 Compare January 7, 2026 22:55

nsemets reviewed Jan 12, 2026

View reviewed changes

futa-ikeda reviewed Jan 12, 2026

View reviewed changes

docs/file-extensions.md

return [

{

id: 'copy-link',

label: 'Copy Link',

Copy link

Contributor

futa-ikeda Jan 12, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be a translatable string.

futa-ikeda reviewed Jan 13, 2026

View reviewed changes

yacchin1205 mentioned this pull request Jan 21, 2026

(NII-Proposal) feat(files): add social media sharing feature flag and copy link option #857

Draft

		[class.p-disabled]="item.disabled"
		[attr.aria-disabled]="item.disabled ?? false"

	protected actionContext = computed((): FileActionContext => {
	actionContext = computed((): FileActionContext => {

Conversation

yacchin1205 commented Jan 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Purpose

Summary of Changes

Screenshot(s)

Example: Copy Link

Example: OnlyOffice Integration (dummy)

Side Effects

QA Notes

Uh oh!

nsemets left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

nsemets Jan 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

yacchin1205 commented Jan 13, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

yacchin1205 commented Jan 22, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

yacchin1205 commented Jan 5, 2026 •

edited

Loading

nsemets Jan 12, 2026 •

edited

Loading