feat: Basic general context menu

toju-app/src/app/features/shell/native-context-menu.component.html

@@ -0,0 +1,82 @@
+@if (params()) {
+  <app-context-menu
+    [x]="params()!.posX"
+    [y]="params()!.posY"
+    [width]="'w-44'"
+    (closed)="close()"
+  >
+    @if (params()!.isEditable) {
+      <button
+        type="button"
+        class="context-menu-item"
+        [disabled]="!params()!.editFlags.canCut"
+        [class.opacity-40]="!params()!.editFlags.canCut"
+        (click)="execCommand('cut')"
+      >
+        Cut
+      </button>
+      <button
+        type="button"
+        class="context-menu-item"
+        [disabled]="!params()!.editFlags.canCopy"
+        [class.opacity-40]="!params()!.editFlags.canCopy"
+        (click)="execCommand('copy')"
+      >
+        Copy
+      </button>
+      <button
+        type="button"
+        class="context-menu-item"
+        [disabled]="!params()!.editFlags.canPaste"
+        [class.opacity-40]="!params()!.editFlags.canPaste"
+        (click)="execCommand('paste')"
+      >
+        Paste
+      </button>
+      <div class="context-menu-divider"></div>
+      <button
+        type="button"
+        class="context-menu-item"
+        [disabled]="!params()!.editFlags.canSelectAll"
+        [class.opacity-40]="!params()!.editFlags.canSelectAll"
+        (click)="execCommand('selectAll')"
+      >
+        Select All
+      </button>
+    } @else if (params()!.selectionText) {
+      <button
+        type="button"
+        class="context-menu-item"
+        (click)="execCommand('copy')"
+      >
+        Copy
+      </button>
+    }
+
+    @if (params()!.linkURL) {
+      @if (params()!.isEditable || params()!.selectionText) {
+        <div class="context-menu-divider"></div>
+      }
+      <button
+        type="button"
+        class="context-menu-item"
+        (click)="copyLink()"
+      >
+        Copy Link
+      </button>
+    }
+
+    @if (params()!.mediaType === 'image' && params()!.srcURL) {
+      @if (params()!.isEditable || params()!.selectionText || params()!.linkURL) {
+        <div class="context-menu-divider"></div>
+      }
+      <button
+        type="button"
+        class="context-menu-item"
+        (click)="copyImage()"
+      >
+        Copy Image
+      </button>
+    }
+  </app-context-menu>
+}

toju-app/src/app/features/shell/native-context-menu.component.ts

@@ -0,0 +1,75 @@
+import {
+  Component,
+  OnInit,
+  OnDestroy,
+  inject,
+  signal
+} from '@angular/core';
+import { ElectronBridgeService } from '../../core/platform/electron/electron-bridge.service';
+import { ContextMenuComponent } from '../../shared';
+import type { ContextMenuParams } from '../../core/platform/electron/electron-api.models';
+
+@Component({
+  selector: 'app-native-context-menu',
+  standalone: true,
+  imports: [ContextMenuComponent],
+  templateUrl: './native-context-menu.component.html'
+})
+export class NativeContextMenuComponent implements OnInit, OnDestroy {
+  params = signal<ContextMenuParams | null>(null);
+
+  private readonly electronBridge = inject(ElectronBridgeService);
+  private cleanup: (() => void) | null = null;
+
+  ngOnInit(): void {
+    const api = this.electronBridge.getApi();
+
+    if (!api?.onContextMenu) {
+      return;
+    }
+
+    this.cleanup = api.onContextMenu((incoming) => {
+      const hasContent = incoming.isEditable
+        || !!incoming.selectionText
+        || !!incoming.linkURL
+        || (incoming.mediaType === 'image' && !!incoming.srcURL);
+
+      this.params.set(hasContent ? incoming : null);
+    });
+  }
+
+  ngOnDestroy(): void {
+    this.cleanup?.();
+    this.cleanup = null;
+  }
+
+  close(): void {
+    this.params.set(null);
+  }
+
+  execCommand(command: string): void {
+    document.execCommand(command);
+    this.close();
+  }
+
+  copyLink(): void {
+    const url = this.params()?.linkURL;
+
+    if (url) {
+      navigator.clipboard.writeText(url).catch(() => {});
+    }
+
+    this.close();
+  }
+
+  copyImage(): void {
+    const srcURL = this.params()?.srcURL;
+    const api = this.electronBridge.getApi();
+
+    if (srcURL && api?.copyImageToClipboard) {
+      api.copyImageToClipboard(srcURL).catch(() => {});
+    }
+
+    this.close();
+  }
+}