From ae28ca6f42421a39992d183c8d52a365fd91eece Mon Sep 17 00:00:00 2001
From: josc146 <josStorer@outlook.com>
Date: Sat, 29 Apr 2023 22:19:10 +0800
Subject: [PATCH] feat: enabled API Modes option (#264)

---
 src/_locales/en/main.json                 |  3 ++-
 src/_locales/zh-hans/main.json            |  3 ++-
 src/_locales/zh-hant/main.json            |  3 ++-
 src/components/ConversationCard/index.jsx |  3 ++-
 src/config/index.mjs                      | 15 +++++++++++
 src/content-script/index.jsx              |  4 +++
 src/popup/sections/ApiModes.jsx           | 32 +++++++++++++++++++++++
 src/popup/sections/GeneralPart.jsx        |  3 ++-
 src/popup/sections/ModulesPart.jsx        |  5 ++++
 9 files changed, 66 insertions(+), 5 deletions(-)
 create mode 100644 src/popup/sections/ApiModes.jsx

diff --git a/src/_locales/en/main.json b/src/_locales/en/main.json
index b853f46..c0b85c7 100644
--- a/src/_locales/en/main.json
+++ b/src/_locales/en/main.json
@@ -110,5 +110,6 @@
   "Modules": "Modules",
   "API Params": "API Params",
   "API Url": "API Url",
-  "Others": "Others"
+  "Others": "Others",
+  "API Modes": "API Modes"
 }
diff --git a/src/_locales/zh-hans/main.json b/src/_locales/zh-hans/main.json
index 7511fa7..5144e9b 100644
--- a/src/_locales/zh-hans/main.json
+++ b/src/_locales/zh-hans/main.json
@@ -110,5 +110,6 @@
   "Modules": "模块",
   "API Params": "API参数",
   "API Url": "API地址",
-  "Others": "其他"
+  "Others": "其他",
+  "API Modes": "API模式"
 }
diff --git a/src/_locales/zh-hant/main.json b/src/_locales/zh-hant/main.json
index 5c9da2f..1c47737 100644
--- a/src/_locales/zh-hant/main.json
+++ b/src/_locales/zh-hant/main.json
@@ -110,5 +110,6 @@
   "Modules": "模組",
   "API Params": "API參數",
   "API Url": "API網址",
-  "Others": "其他"
+  "Others": "其他",
+  "API Modes": "API模式"
 }
diff --git a/src/components/ConversationCard/index.jsx b/src/components/ConversationCard/index.jsx
index b7f28a8..213d185 100644
--- a/src/components/ConversationCard/index.jsx
+++ b/src/components/ConversationCard/index.jsx
@@ -233,7 +233,8 @@ function ConversationCard(props) {
               else setSession(newSession)
             }}
           >
-            {Object.entries(Models).map(([key, model]) => {
+            {config.activeApiModes.map((key) => {
+              const model = Models[key]
               return (
                 <option value={key} key={key} selected={key === session.modelName}>
                   {t(model.desc)}
diff --git a/src/config/index.mjs b/src/config/index.mjs
index ab50e53..044ef5c 100644
--- a/src/config/index.mjs
+++ b/src/config/index.mjs
@@ -118,6 +118,20 @@ export const defaultConfig = {
   // others
 
   alwaysCreateNewConversationWindow: false,
+  activeApiModes: [
+    'chatgptFree35',
+    'chatgptPlus4',
+    'chatgptApi35',
+    'bingFree4',
+    'bingFreeSydney',
+    'poeAiWebSage',
+    'poeAiWebGPT4',
+    'poeAiWebClaudePlus',
+    'chatgptApi4_8k',
+    'customModel',
+    'azureOpenAi',
+    'poeAiWebCustom',
+  ],
   activeSelectionTools: ['translate', 'summary', 'polish', 'code', 'ask'],
   activeSiteAdapters: [
     'bilibili',
@@ -139,6 +153,7 @@ export const defaultConfig = {
   // unchangeable
 
   userLanguage: getNavigatorLanguage(),
+  apiModes: Object.keys(Models),
   selectionTools: [
     'translate',
     'translateToEn',
diff --git a/src/content-script/index.jsx b/src/content-script/index.jsx
index e79b1fa..29252d4 100644
--- a/src/content-script/index.jsx
+++ b/src/content-script/index.jsx
@@ -304,6 +304,10 @@ async function overwriteAccessToken() {
 async function prepareForForegroundRequests() {
   if (location.hostname !== 'chat.openai.com') return
 
+  const userConfig = await getUserConfig()
+
+  if (!chatgptWebModelKeys.some((model) => userConfig.activeApiModes.includes(model))) return
+
   const div = document.createElement('div')
   document.body.append(div)
   render(<NotificationForChatGPTWeb container={div} />, div)
diff --git a/src/popup/sections/ApiModes.jsx b/src/popup/sections/ApiModes.jsx
new file mode 100644
index 0000000..ef421e1
--- /dev/null
+++ b/src/popup/sections/ApiModes.jsx
@@ -0,0 +1,32 @@
+import { useTranslation } from 'react-i18next'
+import PropTypes from 'prop-types'
+import { Models } from '../../config/index.mjs'
+
+ApiModes.propTypes = {
+  config: PropTypes.object.isRequired,
+  updateConfig: PropTypes.func.isRequired,
+}
+
+export function ApiModes({ config, updateConfig }) {
+  const { t } = useTranslation()
+
+  return (
+    <>
+      {config.apiModes.map((key) => (
+        <label key={key}>
+          <input
+            type="checkbox"
+            checked={config.activeApiModes.includes(key)}
+            onChange={(e) => {
+              const checked = e.target.checked
+              const activeApiModes = config.activeApiModes.filter((i) => i !== key)
+              if (checked) activeApiModes.push(key)
+              updateConfig({ activeApiModes })
+            }}
+          />
+          {t(Models[key].desc)}
+        </label>
+      ))}
+    </>
+  )
+}
diff --git a/src/popup/sections/GeneralPart.jsx b/src/popup/sections/GeneralPart.jsx
index 03f2a5d..94e7d27 100644
--- a/src/popup/sections/GeneralPart.jsx
+++ b/src/popup/sections/GeneralPart.jsx
@@ -94,7 +94,8 @@ export function GeneralPart({ config, updateConfig }) {
               updateConfig({ modelName: modelName })
             }}
           >
-            {Object.entries(Models).map(([key, model]) => {
+            {config.activeApiModes.map((key) => {
+              const model = Models[key]
               return (
                 <option value={key} key={key} selected={key === config.modelName}>
                   {t(model.desc)}
diff --git a/src/popup/sections/ModulesPart.jsx b/src/popup/sections/ModulesPart.jsx
index e22461c..4bec8ad 100644
--- a/src/popup/sections/ModulesPart.jsx
+++ b/src/popup/sections/ModulesPart.jsx
@@ -1,6 +1,7 @@
 import { useTranslation } from 'react-i18next'
 import PropTypes from 'prop-types'
 import { Tab, TabList, TabPanel, Tabs } from 'react-tabs'
+import { ApiModes } from './ApiModes'
 import { SelectionTools } from './SelectionTools'
 import { SiteAdapters } from './SiteAdapters'
 
@@ -16,10 +17,14 @@ export function ModulesPart({ config, updateConfig }) {
     <>
       <Tabs selectedTabClassName="popup-tab--selected">
         <TabList>
+          <Tab className="popup-tab">{t('API Modes')}</Tab>
           <Tab className="popup-tab">{t('Selection Tools')}</Tab>
           <Tab className="popup-tab">{t('Sites')}</Tab>
         </TabList>
 
+        <TabPanel>
+          <ApiModes config={config} updateConfig={updateConfig} />
+        </TabPanel>
         <TabPanel>
           <SelectionTools config={config} updateConfig={updateConfig} />
         </TabPanel>