pending: chatgpt web

package.json

@@ -47,7 +47,7 @@
     "tsup": "^6.7.0",
     "typescript": "^4.9.5",
     "unstated-next": "^1.1.0",
-    "uuid": "^9.0.0",
+    "uuid": "^8.0.0",
     "webextension-polyfill": "^0.10.0"
   },
   "scripts": {
@@ -58,5 +58,8 @@
   },
   "lint-staged": {
     "*.{js,css,md,ts,tsx}": "prettier --write"
+  },
+  "dependencies": {
+    "@types/uuid": "^9.0.2"
   }
 }

src/background/index.ts

@@ -2,6 +2,7 @@ import { EventName } from '@/common/event-name'
 import { getSetting } from '@/common/store/settings'
 import type { MessagePayload } from '@/common/types'
 import browser from 'webextension-polyfill'
+import { v4 as uuidv4 } from '../../node_modules/uuid/dist/esm-browser/index'
 
 browser.runtime.onMessage.addListener(
   (message: MessagePayload<EventName.openOptionsPage>) => {
@@ -20,6 +21,42 @@ browser.runtime.onMessage.addListener(
   }
 )
 
+browser.runtime.onMessage.addListener(
+  (message: MessagePayload<EventName.chat>, _, sendResponse) => {
+    if (message.type === EventName.chat) {
+      fetch('https://chat.openai.com/backend-api/conversation', {
+        method: 'POST',
+        body: JSON.stringify({
+          action: 'next',
+          messages: {
+            action: 'next',
+            messages: [
+              {
+                id: uuidv4(),
+                author: { role: 'user' },
+                content: { content_type: 'text', parts: ['prompt'] },
+                metadata: {},
+              },
+            ],
+            parent_message_id: uuidv4(),
+            model: 'text-davinci-002-render-sha',
+          },
+        }),
+        headers: {
+          Authorization:
+            'Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6Ik1UaEVOVUpHTkVNMVFURTRNMEZCTWpkQ05UZzVNRFUxUlRVd1FVSkRNRU13UmtGRVFrRXpSZyJ9.eyJodHRwczovL2FwaS5vcGVuYWkuY29tL3Byb2ZpbGUiOnsiZW1haWwiOiJhbmNoYW85NTEyMjBAZ21haWwuY29tIiwiZW1haWxfdmVyaWZpZWQiOnRydWV9LCJodHRwczovL2FwaS5vcGVuYWkuY29tL2F1dGgiOnsidXNlcl9pZCI6InVzZXItZG1CSVIxZmNKeDlwdXNqcUowbnd0a250In0sImlzcyI6Imh0dHBzOi8vYXV0aDAub3BlbmFpLmNvbS8iLCJzdWIiOiJnb29nbGUtb2F1dGgyfDEwNDIzODIwODM0NzUwMzUwNjcxNiIsImF1ZCI6WyJodHRwczovL2FwaS5vcGVuYWkuY29tL3YxIiwiaHR0cHM6Ly9vcGVuYWkub3BlbmFpLmF1dGgwYXBwLmNvbS91c2VyaW5mbyJdLCJpYXQiOjE2ODYyNzkyNzQsImV4cCI6MTY4NzQ4ODg3NCwiYXpwIjoiVGRKSWNiZTE2V29USHROOTVueXl3aDVFNHlPbzZJdEciLCJzY29wZSI6Im9wZW5pZCBwcm9maWxlIGVtYWlsIG1vZGVsLnJlYWQgbW9kZWwucmVxdWVzdCBvcmdhbml6YXRpb24ucmVhZCBvcmdhbml6YXRpb24ud3JpdGUifQ.T3a0h_-Xe08w9nc__AKVw2xbg9MHXloYVGmWB06FTvVkRIHXIwSxXJw_ZfyZqU_F3LSYMG8YiN4gHaXvOT0tS0WMxgS_OGEh0_pl3GAUYAdV98GJctnbGoYPXdyy4rD_DLpDDcvgHErvguHXICXGurpF-mM8MPwiMbJSGOt8QbmGAQ_0ILl2Msz6fX1yGXRZC4mrRBCluWVlx3RXOOgqSD9NJh0wQRKq_VVAxoAYaidcD3TsriMxDSokxEg-lCMNrCyNh9efSLZf3FUaYbGmYfR9kSemTOqNT6XJwWWfdvyhWgEZJ4TfQ0_gWGJ_vqHdx5iXOPiPspNBfL81n2xH7w',
+          Cookie:
+            '_ga=GA1.1.556654635.1681808779; intercom-device-id-dgkjq2bp=9c45a83e-18a4-4702-b5a8-2203d361ad66; cf_clearance=xNY3BpTMCKwRYgj8d8A4xO5yK9kbazchNTGUsf6G6NU-1682172462-0-1-10aa0fbb.3be4d628.47ab505b-160; intercom-id-dgkjq2bp=2683af41-1ba7-4a8b-9f89-39c8188e7280; _ga_9YTZJE58M9=GS1.1.1684550495.4.0.1684550495.0.0.0; __Host-next-auth.csrf-token=c8ab9587cf99b7608c065eb2306e7de96ee737c954dbae9429d1b87466d3ff65%7C1614d4358d6fe2281a1fa1b7dc1e09be27425385d7569a1c1be67577d37c488b; __Secure-next-auth.callback-url=https%3A%2F%2Fchat.openai.com; _cfuvid=6sXapOBWmKQtfgTwl8Jph0FGqbn5XTd78jsomr3zXwQ-1687092916799-0-604800000; __cf_bm=W57tWnbY8L6ZpmzXWovTRDX26VsuZAlroYuTtwysPwU-1687095927-0-AeaYmvUjnhuPvSp50NFqMZMZt96t2phXc+CBIEHU1UHhTneO5oPDbk/gaCQcUw1h2Y5e/j9KH1KVHdrMTWhJMzMQi13tY7d9eguB5DThNLhH; __Secure-next-auth.session-token=eyJhbGciOiJkaXIiLCJlbmMiOiJBMjU2R0NNIn0..nHUBYs09rJKQ9ZrK.wSt7oiNu4BTX5LGxa2nNKR-aZmtn_yQQmZMEJNTetPiKQ3H5eTBx1ZIWN-cQMBQyspzv-j-mBB2F_X0a6zGW27yMtda1hu_Ugxhfmq76-f-lkRWqiIfjCoY3FY0kRb55yZSaztTYGMpIxtJx3eK7zRPJfpipwnYlIqrrmcjHMemvAkYw2-uAA0xbkJaganNtvoqENgzDWCcvkSo9vD3yzXqM4WL3JNEI7EB9a76MktjxxSBeiuUaiKzXh77_5W-m4LYJLgp7B2zu5o78l6JvkLELOKyw13DVOdcOf-2Cfuxs34yNZhCKd4ghkTjvczJ0EaJijrSta3Dv7wG38L9LagW3_nxiZBZrPbzFR6J3MnT8k774LKamZci31NtI8m8A3qLlt3dCDkXr2Qjz09WEkLYzoJ33sBituKo4ifSk3BceIv-Kqmktar9bhOoIC7RFbkl7QE9jpQxr16SdshjsunqnddYSOiU4_gE407nPc9t_K4HTSHpgxh9KHiF0e5p2wd1HouaX2Ti-H_4rbbAiQTza7Sq-GATwnDnAuz1pojb-CEJANKCDxSRp95Lm-Yu8_Z9-PpceGiCBNcbqkNzpQyb8VVinvJC9lUg-uqjSN2oWVu396GO08-BEu0HmruMEIQJo-CkFNJK0ZvzGlzY7WPSbcNEWKpQy9GNepf2cCK7Q6h6c1IX_s_xoxVWcPweoUqdSmoXIkN4lV-7pAqH5Q25CanvrEgq_FdGchi0JpcDfniqVGxYgoyuCdkbf8FABLXyK7h4P9DAC6IU11R3lKBptQ4xUkHnwV7KcXGfI9WQqk_GLnwpis9zUYJMPvQENqDGqry8zxfXiWt4PU72Zn2QqSRk54xkHmVkw_k-eLm8WVofAXZoP9nZO32LTOmMH6ZvpnWDOHG2Osotdl0xBiJoXRYWghUKcP5GD_VYTkKeHDZYZjFBYe2-InBs3UIKQJv9AOXiS_GcZRwe5_kG-aZy3kGF9QtJ0h_ajXehdAV0EeTEIBzfBbCYG1_PFGeSEtsdf5naIbPrU1X8Jrbi2w2EM_XnzMjkjQ2vVr3Sg_Hzlr_D_zMr8k30CP8N07ETgTANV5xh984_94G85PmRTTVnQ6Jnyrp6-V43tUiZkGFgQQDodIaOzSeyOpfA7Uj9-o11oQgbJwaTCulBRr3FUMMDALu1NUzMgYgfoPb5FJSIKAvI_C8OWTBLDucqsoRQMM_mAYKw2ZhW-8lbvs_ti6b3t0Us0yudTuDqU32Em8gIwRloYeawB8DOch2wCbz3BPZpy4zbrgEqr780O47VeSBxq25ExTboGYGGBXh8m7cYV5NkdtOb50rt2E5JuaucM-4G6O_mQGcuALbzDcIRe1_7HHv5R3qsDlzamY8U8xwjskIDt45BXDl4m-BQXwqvG-0H8NoSpQyjSatrTqpuSKY63XCCQcDwVvq2PaQdbWQU5r8it59QTzJlAQVZxwAk3WYSAZ7GCS58Tb3FapxxK5y901AJ-qLUS2HxNlAtw-EupMNLQSfrixRuPUB7gO4nAESOWf5ii3dj9qriLL7C5LxxIuVLzCWCU6TPSAWSTHmvDk2T-B_aXsw8kP4PEychQbDtnSpgOpJKQb_oozT9egmeNSLSIZx7GuV-2OcVJVaQLMuLcVWiyXAiG3Tsy6gsJdSA1Fwst3V6ymP3U9v9LsAeBLpZkYs5d0GdbHUZyVoTf6bf9jBcjEIxBohelplE7mfy4643TCurZAOXABcBka_D26177jaZhrppus3gak6kWNFwQuYhk-UmiU_LoPkacKsdBMl0aSFEXRoUAg19NE6hbTm1wqkO1GPGrb2iXpEDm-awM04h4M8Fq1LHvKDG6jsl8oLzatAQB9YDln1fwlW-usQFTLhhKSFJx2CdT4Rt2T7HEjOTekMtp68RZ6EZmCv4m3qCumbSTOs1mqBJQRuzrpF0EZcDiaHtRBqTgTrRjL2Vi9SFk4q46X25WwJyf9QbonCYQbLpybmlYoFbzsmI8KD3ei01p0Aopyu1vjr8zuLq61gE2lsvmHOXLbyOimLvk9jTKcI5iY6XaWEaT_dYHKE6nniQSAB3feCFUqmtFcU7JnTkAGg7xCTKD8fbhXU70-M-zLdisset7DbrxTBEE41_fgvJvP9u1LzTeOy-8MKE0FR23jfLyCpxlT0NethIHfffVtE9Zu69dE8FxXQZAVjy_TR_0RdGLqqDQnslamhQiuYXLHy9-P4gm47AfQrfsNAToaMJ7nKJsWzO4lyB5ZGRHEBkPMxlh5G1iLfSriXPESl3O8C8yTI24aUzxKxpqDXlG-l1PJoCSHDNcvWt_EADwKB0fijBpHLnzydVkcZg8bYlzvSZIkQBF8IgcnGzOaNnrHSbxJvYQ-evKqrzhUSS8dUSMuE4tDTg9RuFkr4yVpUjfGgJIVfCQXJh-HEwo-V2J0s5baWc4f_hP1KxCM_p9oaboifa8EojlyU6HA3MzCC0Y5lBwndmkegslJG6JUh_NLK47zY6E0IbD58N91UykBTvvwbBS_g.NuQbW-JN4Dkemb3WyhEr8A; intercom-session-dgkjq2bp=eS9BU1JmRHNyc0ptOU1XcVFDYk41djJYeDNUck9xYXozOHRacDJJYVFRNktpNkZxU2dPQURwN1NXNmZCc3hiUy0tY3hJZHFmTjdabTljOC82bW9ZY2ZTdz09--ace1bf1e30552219b64bb29010d4ac14d6759cde; _dd_s=rum=0&expire=1687097165195',
+        },
+      })
+        .then((res) => res.json())
+        .then(sendResponse)
+
+      return true
+    }
+  }
+)
+
 browser.contextMenus.create({
   title: 'Launch writely',
   id: 'writely',

src/common/api/openai.ts

@@ -4,9 +4,9 @@ import { useEffect, useMemo, useRef, useState } from 'react'
 import { logger } from '../debug'
 import { defaultSetting, useSettings } from '../store/settings'
 import { ServiceProvider } from '@/options/types'
-import browser from 'webextension-polyfill'
-import { EventName } from '../event-name'
 import { getToken } from './writely'
+import { EventName } from '../event-name'
+import browser from 'webextension-polyfill'
 
 const useOpenAPI = () => {
   const { settings } = useSettings()
@@ -126,7 +126,9 @@ export const useQueryOpenAIPrompt = () => {
 
     const abortController = new AbortController()
 
-    if (isChat) {
+    if (settings.serviceProvider === ServiceProvider.ChatGPT) {
+      sendToChatGPTWeb(prompt)
+    } else if (isChat) {
       openAI?.current?.createChatCompletion(
         {
           ...commonOption,
@@ -256,3 +258,12 @@ const ensureUsing0613Model = (model: string) => {
 
   return model
 }
+
+const sendToChatGPTWeb = async (prompt: string) => {
+  console.log(
+    'hi',
+    await browser.runtime.sendMessage({
+      type: EventName.chat,
+    })
+  )
+}

src/common/event-name.ts

@@ -6,4 +6,5 @@ export enum EventName {
   openOptionsPage = 'open-options-page',
   getToken = 'get-token',
   token = 'token',
+  chat = 'chat',
 }

src/common/locale/zh-CN.json

@@ -80,5 +80,6 @@
   "Extension Settings": "插件设置",
   "to connect": "关联",
   "Using the services provided by Writely, there are 10 free times per day": "使用 Writely 提供的服务，每天有 10 次的免费次数",
-  "By using the services provided by OpenAI API Key, you can permanently use Writely software for free": "使用 OpenAI API Key 提供的服务，您可以永久免费使用 Writely 软件"
+  "By using the services provided by OpenAI API Key, you can permanently use Writely software for free": "使用 OpenAI API Key 提供的服务，您可以永久免费使用 Writely 软件",
+  "By using the services provided by ChatGPT, you can permanently use Writely software for free": "使用 ChatGPT 提供的服务，您可以永久免费使用 Writely 软件"
 }

src/common/store/settings.ts

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useState } from 'react'
 import { createContainer } from 'unstated-next'
 import browser from 'webextension-polyfill'
-import { uniqueId } from 'lodash-es'
+import { omit, uniqueId } from 'lodash-es'
 import { ServiceProvider, Settings } from '../../options/types'
 
 const key = 'writingly-settings'
@@ -26,12 +26,7 @@ const _useSettings = () => {
         ...newSettings,
       })
 
-      browser.storage.local.set({
-        [key]: {
-          ...settings,
-          ...newSettings,
-        },
-      })
+      saveSetting(newSettings)
     },
     [settings]
   )
@@ -59,7 +54,10 @@ const { useContainer: useSettings, Provider: SettingsProvider } =
 export { useSettings, SettingsProvider }
 
 export const getSetting = async () => {
-  const res = (await browser.storage.local.get(key))?.[key] || {}
+  const res = {
+    ...((await browser.storage.local.get(key))?.[key] || {}),
+    ...((await browser.storage.sync.get(key))?.[key] || {}),
+  }
 
   patchDefaultSetting(res)
   patchCustomInstructions(res)
@@ -72,14 +70,26 @@ export const getSetting = async () => {
 }
 
 export const saveSetting = async (newSettings: Partial<Settings>) => {
-  const settings = await getSetting()
+  const settings = {
+    ...(await getSetting()),
+    ...newSettings,
+  }
 
-  browser.storage.local.set({
-    [key]: {
-      ...settings,
-      ...newSettings,
-    },
+  // 只有 customInstruction 存在本地
+  const localNewSettings = settings.customInstructions
+    ? {
+        customInstructions: settings.customInstructions,
+      }
+    : null
+  const remoteSettings = omit(settings, 'customInstructions')
+
+  browser.storage.sync.set({
+    [key]: localNewSettings,
   })
+
+  if (localNewSettings) {
+    browser.storage.local.set({ [key]: remoteSettings })
+  }
 }
 
 const patchCustomInstructions = (setting: Settings) => {

src/components/icon/chatgpt.tsx

@@ -0,0 +1,16 @@
+import { SVGProps } from 'react'
+
+export const ChatGPTIcon: React.FC<SVGProps<SVGSVGElement>> = (props) => {
+  return (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2406 2406" {...props}>
+      <path
+        d="M1 578.4C1 259.5 259.5 1 578.4 1h1249.1c319 0 577.5 258.5 577.5 577.4V2406H578.4C259.5 2406 1 2147.5 1 1828.6V578.4z"
+        fill="#74aa9c"
+      />
+      <path
+        d="M1107.3 299.1c-198 0-373.9 127.3-435.2 315.3C544.8 640.6 434.9 720.2 370.5 833c-99.3 171.4-76.6 386.9 56.4 533.8-41.1 123.1-27 257.7 38.6 369.2 98.7 172 297.3 260.2 491.6 219.2 86.1 97 209.8 152.3 339.6 151.8 198 0 373.9-127.3 435.3-315.3 127.5-26.3 237.2-105.9 301-218.5 99.9-171.4 77.2-386.9-55.8-533.9v-.6c41.1-123.1 27-257.8-38.6-369.8-98.7-171.4-297.3-259.6-491-218.6-86.6-96.8-210.5-151.8-340.3-151.2zm0 117.5-.6.6c79.7 0 156.3 27.5 217.6 78.4-2.5 1.2-7.4 4.3-11 6.1L952.8 709.3c-18.4 10.4-29.4 30-29.4 51.4V1248l-155.1-89.4V755.8c-.1-187.1 151.6-338.9 339-339.2zm434.2 141.9c121.6-.2 234 64.5 294.7 169.8 39.2 68.6 53.9 148.8 40.4 226.5-2.5-1.8-7.3-4.3-10.4-6.1l-360.4-208.2c-18.4-10.4-41-10.4-59.4 0L1024 984.2V805.4L1372.7 604c51.3-29.7 109.5-45.4 168.8-45.5zM650 743.5v427.9c0 21.4 11 40.4 29.4 51.4l421.7 243-155.7 90L597.2 1355c-162-93.8-217.4-300.9-123.8-462.8C513.1 823.6 575.5 771 650 743.5zm807.9 106 348.8 200.8c162.5 93.7 217.6 300.6 123.8 462.8l.6.6c-39.8 68.6-102.4 121.2-176.5 148.2v-428c0-21.4-11-41-29.4-51.4l-422.3-243.7 155-89.3zM1201.7 997l177.8 102.8v205.1l-177.8 102.8-177.8-102.8v-205.1L1201.7 997zm279.5 161.6 155.1 89.4v402.2c0 187.3-152 339.2-339 339.2v-.6c-79.1 0-156.3-27.6-217-78.4 2.5-1.2 8-4.3 11-6.1l360.4-207.5c18.4-10.4 30-30 29.4-51.4l.1-486.8zM1380 1421.9v178.8l-348.8 200.8c-162.5 93.1-369.6 38-463.4-123.7h.6c-39.8-68-54-148.8-40.5-226.5 2.5 1.8 7.4 4.3 10.4 6.1l360.4 208.2c18.4 10.4 41 10.4 59.4 0l421.9-243.7z"
+        fill="white"
+      />
+    </svg>
+  )
+}

src/options/setting-form/provider.tsx

@@ -8,13 +8,15 @@ import { MaterialSymbolsAddLink } from '@/components/icon/link'
 import { useUser } from '@/common/api/writely'
 import Link from 'antd/es/typography/Link'
 import { MaterialSymbolsCheckCircleRounded } from '@/components/icon/checked'
+import { ChatGPTIcon } from '@/components/icon/chatgpt'
 
 export const ProviderSetting: React.FC = () => {
   const value = Form.useWatch('serviceProvider')
   const activeClassNames = 'bg-black text-white'
 
   const isCheckedWritely = value === ServiceProvider.Writely
   const isCheckedOpenAI = value === ServiceProvider.OpenAI
+  const isCheckedChatGPT = value === ServiceProvider.ChatGPT
 
   return (
     <Card title={i18next.t('Service Provider')} hoverable>
@@ -65,6 +67,26 @@ export const ProviderSetting: React.FC = () => {
                 </div>
               </Tooltip>
             </Radio>
+            {/* <Radio value={ServiceProvider.ChatGPT}>
+              <Tooltip
+                title={i18next.t(
+                  'By using the services provided by ChatGPT, you can permanently use Writely software for free'
+                )}
+              >
+                <div
+                  style={{
+                    boxShadow: isCheckedChatGPT ? '0px 3px rgb(252,211,77)' : '',
+                  }}
+                  className={classNames(
+                    'items-center py-3 px-5 rounded-full flex gap-2',
+                    isCheckedChatGPT ? activeClassNames : ''
+                  )}
+                >
+                  <ChatGPTIcon className="h-11 w-auto" />
+                  <span className="font-semibold text-3xl">ChatGPT</span>
+                </div>
+              </Tooltip>
+            </Radio> */}
           </Radio.Group>
         </div>
       </Form.Item>

src/options/types/settings.ts

@@ -8,6 +8,7 @@ export type Instruction = {
 export enum ServiceProvider {
   Writely = 'writely',
   OpenAI = 'openai',
+  ChatGPT = 'chatgpt',
 }
 
 export type Settings = {

yarn.lock

@@ -369,6 +369,11 @@
   dependencies:
     "@types/node" "*"
 
+"@types/uuid@^9.0.2":
+  version "9.0.2"
+  resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-9.0.2.tgz#ede1d1b1e451548d44919dc226253e32a6952c4b"
+  integrity sha512-kNnC1GFBLuhImSnV7w4njQkUiJi0ZXUycu1rUaouPqiKlXkh77JKgdRnTAp1x5eBwcIwbtI+3otwzuIDEuDoxQ==
+
 "@types/webextension-polyfill@^0.10.0":
   version "0.10.0"
   resolved "https://registry.yarnpkg.com/@types/webextension-polyfill/-/webextension-polyfill-0.10.0.tgz#e87b5e2c101599779a584cdb043887ad73b37b0e"
@@ -2839,10 +2844,10 @@ util-deprecate@^1.0.2:
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
   integrity sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==
 
-uuid@^9.0.0:
-  version "9.0.0"
-  resolved "https://registry.yarnpkg.com/uuid/-/uuid-9.0.0.tgz#592f550650024a38ceb0c562f2f6aa435761efb5"
-  integrity sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==
+uuid@^8.0.0:
+  version "8.3.2"
+  resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2"
+  integrity sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==
 
 void-elements@3.1.0:
   version "3.1.0"