feat(media-hosting): add multi-provider configurable upload with fallback

Add Random/Preferred/None modes, preferred provider selection, and provider-order fallback. Catbox/Imgur/PostImages on Android via WebView; Electron CDP automation for Imgur/PostImages. Hide upload controls on web runtime.
2026-08-03 07:41:04 +02:00 · 2026-02-18 18:51:02 +08:00
parent 72b70915fd
commit 96a4aaec0e
63 changed files with 1991 additions and 201 deletions
@@ -4,7 +4,7 @@ import { createRoot, Root } from 'react-dom/client';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { Capacitor } from '@capacitor/core';
 import FileUploader from '../../plugins/file-uploader';
-import { uploadToCatbox } from '../../lib/utils/catbox-utils';
+import { orchestrateElectronUpload } from '../../lib/media-hosting/upload-orchestrator';
 import { useFileUpload } from '../use-file-upload';

 // Enable React's act environment for hook state updates in tests.
@@ -27,9 +27,23 @@ vi.mock('../../lib/utils/catbox-utils', () => ({
  uploadToCatbox: vi.fn(),
 }));

-const selectedProviderRef = vi.hoisted(() => ({ value: 'catbox' as string }));
+vi.mock('../../lib/media-hosting/upload-orchestrator', () => ({
+  orchestrateElectronUpload: vi.fn(),
+}));
+
+vi.mock('../../lib/media-hosting/provider-order', () => ({
+  getProviderOrder: vi.fn((opts: { mode: string; preferredProvider: string; runtime: string }) => {
+    if (opts.mode === 'none') return [];
+    if (opts.runtime === 'web') return opts.preferredProvider === 'catbox' ? ['catbox'] : [];
+    return opts.mode === 'preferred' ? [opts.preferredProvider] : ['catbox', 'imgur', 'postimages'];
+  }),
+}));
+
+const uploadModeRef = vi.hoisted(() => ({ value: 'random' as 'random' | 'preferred' | 'none' }));
+const preferredProviderRef = vi.hoisted(() => ({ value: 'catbox' as 'catbox' | 'imgur' | 'postimages' }));
 vi.mock('../../stores/use-media-hosting-store', () => ({
-  default: (selector: (s: { selectedProvider: string }) => unknown) => selector({ selectedProvider: selectedProviderRef.value }),
+  default: (selector: (s: { uploadMode: string; preferredProvider: string }) => unknown) =>
+    selector({ uploadMode: uploadModeRef.value, preferredProvider: preferredProviderRef.value }),
 }));

 type HookSnapshot = ReturnType<typeof useFileUpload>;
@@ -73,7 +87,8 @@ const selectFileFromHiddenInput = async (file: File | null) => {
 describe('useFileUpload', () => {
  beforeEach(() => {
    vi.clearAllMocks();
-    selectedProviderRef.value = 'catbox';
+    uploadModeRef.value = 'random';
+    preferredProviderRef.value = 'catbox';
    latestHook = null;
    container = document.createElement('div');
    document.body.append(container);
@@ -93,10 +108,13 @@ describe('useFileUpload', () => {
  });

  it('uploads via Android plugin and updates state', async () => {
+    uploadModeRef.value = 'preferred';
+    preferredProviderRef.value = 'catbox';
    vi.mocked(Capacitor.getPlatform).mockReturnValue('android');
    vi.mocked(FileUploader.pickAndUploadMedia).mockResolvedValue({
      url: 'https://files.catbox.moe/android.jpg',
      fileName: 'android.jpg',
+      provider: 'catbox',
    });

    const { onUploadComplete, hook } = mountHook();
@@ -111,10 +129,12 @@ describe('useFileUpload', () => {
    expect(hook().isUploading).toBe(false);
  });

-  it('uploads via Electron file picker + catbox utility', async () => {
+  it('uploads via Electron file picker + orchestrator', async () => {
+    uploadModeRef.value = 'preferred';
+    preferredProviderRef.value = 'catbox';
    vi.mocked(Capacitor.getPlatform).mockReturnValue('ios');
    window.electronApi = { isElectron: true } as any;
-    vi.mocked(uploadToCatbox).mockResolvedValue('https://files.catbox.moe/electron.png');
+    vi.mocked(orchestrateElectronUpload).mockResolvedValue('https://files.catbox.moe/electron.png');

    const selectedFile = new File(['abc'], 'electron.png', { type: 'image/png' });
    const { onUploadComplete, hook } = mountHook();
@@ -128,13 +148,15 @@ describe('useFileUpload', () => {
      await uploadPromise;
    });

-    expect(uploadToCatbox).toHaveBeenCalledWith(selectedFile);
+    expect(orchestrateElectronUpload).toHaveBeenCalledWith(selectedFile, ['catbox']);
    expect(onUploadComplete).toHaveBeenCalledWith('https://files.catbox.moe/electron.png', 'electron.png');
    expect(hook().uploadedFileName).toBe('electron.png');
    expect(hook().isUploading).toBe(false);
  });

  it('shows web fallback alert and does not upload', async () => {
+    uploadModeRef.value = 'preferred';
+    preferredProviderRef.value = 'catbox';
    vi.mocked(Capacitor.getPlatform).mockReturnValue('web');
    window.electronApi = undefined;
    const { onUploadComplete, hook } = mountHook();
@@ -144,13 +166,15 @@ describe('useFileUpload', () => {
    });

    expect(window.alert).toHaveBeenCalledWith('upload_not_supported_web');
-    expect(uploadToCatbox).not.toHaveBeenCalled();
+    expect(orchestrateElectronUpload).not.toHaveBeenCalled();
    expect(FileUploader.pickAndUploadMedia).not.toHaveBeenCalled();
    expect(onUploadComplete).not.toHaveBeenCalled();
    expect(hook().isUploading).toBe(false);
  });

  it('silently ignores file selection cancellation', async () => {
+    uploadModeRef.value = 'preferred';
+    preferredProviderRef.value = 'catbox';
    vi.mocked(Capacitor.getPlatform).mockReturnValue('ios');
    window.electronApi = { isElectron: true } as any;
    const { onUploadComplete, hook } = mountHook();
@@ -164,13 +188,15 @@ describe('useFileUpload', () => {
      await uploadPromise;
    });

-    expect(uploadToCatbox).not.toHaveBeenCalled();
+    expect(orchestrateElectronUpload).not.toHaveBeenCalled();
    expect(window.alert).not.toHaveBeenCalled();
    expect(onUploadComplete).not.toHaveBeenCalled();
    expect(hook().isUploading).toBe(false);
  });

-  it('alerts on upload failure and resets uploading state', async () => {
+  it('alerts on preferred mode upload failure with actionable guidance', async () => {
+    uploadModeRef.value = 'preferred';
+    preferredProviderRef.value = 'catbox';
    vi.mocked(Capacitor.getPlatform).mockReturnValue('android');
    vi.mocked(FileUploader.pickAndUploadMedia).mockRejectedValue(new Error('boom'));
    const { onUploadComplete, hook } = mountHook();
@@ -179,17 +205,18 @@ describe('useFileUpload', () => {
      await hook().handleUpload();
    });

-    expect(window.alert).toHaveBeenCalledWith('upload_failed: boom');
+    expect(window.alert).toHaveBeenCalledWith('upload_failed: boom. upload_failed_preferred_guidance');
    expect(onUploadComplete).not.toHaveBeenCalled();
    expect(hook().isUploading).toBe(false);
  });

-  it('returns early when selectedProvider is none (no upload, no alert)', async () => {
-    selectedProviderRef.value = 'none';
+  it('returns early when uploadMode is none (no upload, no alert)', async () => {
+    uploadModeRef.value = 'none';
    vi.mocked(Capacitor.getPlatform).mockReturnValue('android');
    vi.mocked(FileUploader.pickAndUploadMedia).mockResolvedValue({
      url: 'https://files.catbox.moe/skip.jpg',
      fileName: 'skip.jpg',
+      provider: 'catbox',
    });
    const { onUploadComplete, hook } = mountHook();

@@ -203,18 +230,95 @@ describe('useFileUpload', () => {
    expect(hook().isUploading).toBe(false);
  });

-  it('returns early when selectedProvider is unknown (no crash, no upload)', async () => {
-    selectedProviderRef.value = 'unknown-provider';
-    vi.mocked(Capacitor.getPlatform).mockReturnValue('ios');
-    window.electronApi = { isElectron: true } as any;
+  it('shows web unsupported alert when preferred provider not available on web', async () => {
+    uploadModeRef.value = 'preferred';
+    preferredProviderRef.value = 'imgur';
+    vi.mocked(Capacitor.getPlatform).mockReturnValue('web');
    const { onUploadComplete, hook } = mountHook();

    await act(async () => {
      await hook().handleUpload();
    });

-    expect(uploadToCatbox).not.toHaveBeenCalled();
-    expect(window.alert).not.toHaveBeenCalled();
+    expect(window.alert).toHaveBeenCalledWith('upload_not_supported_web');
+    expect(orchestrateElectronUpload).not.toHaveBeenCalled();
+    expect(onUploadComplete).not.toHaveBeenCalled();
+    expect(hook().isUploading).toBe(false);
+  });
+
+  it('Android call includes provider order payload', async () => {
+    uploadModeRef.value = 'random';
+    preferredProviderRef.value = 'catbox';
+    vi.mocked(Capacitor.getPlatform).mockReturnValue('android');
+    vi.mocked(FileUploader.pickAndUploadMedia).mockResolvedValue({
+      url: 'https://files.catbox.moe/random.jpg',
+      fileName: 'random.jpg',
+      provider: 'catbox',
+    });
+
+    const { onUploadComplete, hook } = mountHook();
+
+    await act(async () => {
+      await hook().handleUpload();
+    });
+
+    expect(FileUploader.pickAndUploadMedia).toHaveBeenCalledWith({
+      providerOrder: expect.any(Array),
+    });
+    const call = vi.mocked(FileUploader.pickAndUploadMedia).mock.calls[0][0];
+    expect(call?.providerOrder).toEqual(expect.arrayContaining(['catbox']));
+    expect(onUploadComplete).toHaveBeenCalledWith('https://files.catbox.moe/random.jpg', 'random.jpg');
+  });
+
+  it('random mode: Electron upload succeeds when orchestrator resolves', async () => {
+    uploadModeRef.value = 'random';
+    preferredProviderRef.value = 'catbox';
+    vi.mocked(Capacitor.getPlatform).mockReturnValue('ios');
+    window.electronApi = { isElectron: true } as any;
+    vi.mocked(orchestrateElectronUpload).mockResolvedValue('https://imgur.com/abc');
+
+    const selectedFile = new File(['xyz'], 'pic.png', { type: 'image/png' });
+    const { onUploadComplete, hook } = mountHook();
+
+    let uploadPromise: Promise<void> | undefined;
+    await act(async () => {
+      uploadPromise = hook().handleUpload();
+    });
+    await selectFileFromHiddenInput(selectedFile);
+    await act(async () => {
+      await uploadPromise;
+    });
+
+    expect(orchestrateElectronUpload).toHaveBeenCalledWith(selectedFile, expect.any(Array));
+    expect(onUploadComplete).toHaveBeenCalledWith('https://imgur.com/abc', 'pic.png');
+    expect(hook().isUploading).toBe(false);
+  });
+
+  it('random mode: all providers fail shows aggregated alert', async () => {
+    uploadModeRef.value = 'random';
+    preferredProviderRef.value = 'catbox';
+    vi.mocked(Capacitor.getPlatform).mockReturnValue('ios');
+    window.electronApi = { isElectron: true } as any;
+    const err = new Error('All providers failed') as Error & { attempts: { provider: string; error: string }[] };
+    err.attempts = [
+      { provider: 'catbox', error: 'timeout' },
+      { provider: 'imgur', error: 'rate limit' },
+    ];
+    vi.mocked(orchestrateElectronUpload).mockRejectedValue(err);
+
+    const selectedFile = new File(['x'], 'fail.png', { type: 'image/png' });
+    const { onUploadComplete, hook } = mountHook();
+
+    let uploadPromise: Promise<void> | undefined;
+    await act(async () => {
+      uploadPromise = hook().handleUpload();
+    });
+    await selectFileFromHiddenInput(selectedFile);
+    await act(async () => {
+      await uploadPromise;
+    });
+
+    expect(window.alert).toHaveBeenCalledWith('upload_failed. upload_failed_all_providers: catbox: timeout; imgur: rate limit');
    expect(onUploadComplete).not.toHaveBeenCalled();
    expect(hook().isUploading).toBe(false);
  });