From b694203d2656924775eef6c0c787f0b47b8a4007 Mon Sep 17 00:00:00 2001
From: chrox <chrox.huang@gmail.com>
Date: Fri, 6 Dec 2024 13:36:38 +0100
Subject: [PATCH] Fix DeepL on Web Readest and avoid cli parsing for Web

---
 apps/readest-app/next.config.mjs                     |  8 ++++++++
 .../app/reader/components/annotator/DeepLPopup.tsx   | 12 +++++++++---
 apps/readest-app/src/helpers/cli.ts                  |  5 ++++-
 3 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/apps/readest-app/next.config.mjs b/apps/readest-app/next.config.mjs
index 0302f5da..13b54a4b 100644
--- a/apps/readest-app/next.config.mjs
+++ b/apps/readest-app/next.config.mjs
@@ -19,6 +19,14 @@ const nextConfig = {
   // Configure assetPrefix or else the server won't properly resolve your assets.
   assetPrefix: isProd ? '' : `http://${internalHost}:3000`,
   reactStrictMode: true,
+  async rewrites() {
+    return [
+      {
+        source: '/api/deepl/:path*',
+        destination: 'https://api-free.deepl.com/v2/:path*',
+      },
+    ];
+  },
 };
 
 export default nextConfig;
diff --git a/apps/readest-app/src/app/reader/components/annotator/DeepLPopup.tsx b/apps/readest-app/src/app/reader/components/annotator/DeepLPopup.tsx
index 64ead4f9..ee19d66b 100644
--- a/apps/readest-app/src/app/reader/components/annotator/DeepLPopup.tsx
+++ b/apps/readest-app/src/app/reader/components/annotator/DeepLPopup.tsx
@@ -1,8 +1,8 @@
 import React, { useEffect, useState } from 'react';
 import Popup from '@/components/Popup';
 import { Position } from '@/utils/sel';
-import { fetch } from '@tauri-apps/plugin-http';
 import { useSettingsStore } from '@/store/settingsStore';
+import { isWebAppPlatform } from '@/services/environment';
 
 const LANGUAGES = {
   AUTO: 'Auto Detect',
@@ -65,8 +65,15 @@ const DeepLPopup: React.FC<DeepLPopupProps> = ({
         console.error('DeepL API key not found. Set NEXT_PUBLIC_DEEPL_API_KEY in .env.local');
       }
 
+      const { fetch, url } = isWebAppPlatform()
+        ? { fetch: window.fetch, url: '/api/deepl/translate' }
+        : {
+            fetch: (await import('@tauri-apps/plugin-http')).fetch,
+            url: 'https://api-free.deepl.com/v2/translate',
+          };
+
       try {
-        const response = await fetch('https://api-free.deepl.com/v2/translate', {
+        const response = await fetch(url, {
           method: 'POST',
           headers: {
             'Content-Type': 'application/json',
@@ -82,7 +89,6 @@ const DeepLPopup: React.FC<DeepLPopupProps> = ({
         if (!response.ok) {
           throw new Error('Failed to fetch translation');
         }
-
         const data = await response.json();
         const translatedText = data.translations[0]?.text;
         const detectedSource = data.translations[0]?.detected_source_language;
diff --git a/apps/readest-app/src/helpers/cli.ts b/apps/readest-app/src/helpers/cli.ts
index af0dbb90..bf0e6a0f 100644
--- a/apps/readest-app/src/helpers/cli.ts
+++ b/apps/readest-app/src/helpers/cli.ts
@@ -1,4 +1,4 @@
-import { getMatches } from '@tauri-apps/plugin-cli';
+import { isWebAppPlatform } from '@/services/environment';
 
 declare global {
   interface Window {
@@ -16,6 +16,7 @@ const parseWindowOpenWithFiles = () => {
 };
 
 const parseCLIOpenWithFiles = async () => {
+  const { getMatches } = await import('@tauri-apps/plugin-cli');
   const matches = await getMatches();
   const args = matches?.args;
   const files: string[] = [];
@@ -32,6 +33,8 @@ const parseCLIOpenWithFiles = async () => {
 };
 
 export const parseOpenWithFiles = async () => {
+  if (isWebAppPlatform()) return [];
+
   let files = parseWindowOpenWithFiles();
   if (!files) {
     files = await parseCLIOpenWithFiles();