feat: support DeepSeek (#1528)

src/browser-extension/manifest.ts

@@ -69,6 +69,7 @@ export function getManifest(browser: 'firefox' | 'chromium') {
  'https://*.volces.com/',
  'https://*.chatglm.cn/',
  'https://*.cohere.ai/',
+ 'https://*.deepseek.com/',
  ],
  }
 

src/common/components/Settings.tsx

@@ -1356,6 +1356,7 @@ function ProviderSelector({ value, onChange, hasPromotion }: IProviderSelectorPr
  { label: 'Moonshot', id: 'Moonshot' },
  { label: 'Groq', id: 'Groq' },
  { label: 'Claude', id: 'Claude' },
+ { label: 'DeepSeek', id: 'DeepSeek' },
  ] as {
  label: string
  id: Provider
@@ -1372,6 +1373,7 @@ function ProviderSelector({ value, onChange, hasPromotion }: IProviderSelectorPr
  { label: 'Moonshot', id: 'Moonshot' },
  { label: 'Groq', id: 'Groq' },
  { label: 'Claude', id: 'Claude' },
+ { label: 'DeepSeek', id: 'DeepSeek' },
  ] as {
  label: string
  id: Provider
@@ -2431,6 +2433,45 @@ export function InnerSettings({
  />
  </FormItem>
  </div>
+ <div
+ style={{
+ display: values.provider === 'DeepSeek' ? 'block' : 'none',
+ }}
+ >
+ <FormItem
+ required={values.provider === 'DeepSeek'}
+ name='deepSeekAPIKey'
+ label='DeepSeek API Key'
+ caption={
+ <div>
+ {t('Go to the')}{' '}
+ <a
+ target='_blank'
+ href='https://platform.deepseek.com/api_keys'
+ rel='noreferrer'
+ style={linkStyle}
+ >
+ DeepSeek Dashboard
+ </a>{' '}
+ {t('to get your API Key.')}
+ </div>
+ }
+ >
+ <Input autoFocus type='password' size='compact' onBlur={onBlur} />
+ </FormItem>
+ <FormItem
+ name='deepSeekAPIModel'
+ label={t('API Model')}
+ required={values.provider === 'DeepSeek'}
+ >
+ <APIModelSelector
+ provider='DeepSeek'
+ currentProvider={values.provider}
+ apiKey={values.deepSeekAPIKey}
+ onBlur={onBlur}
+ />
+ </FormItem>
+ </div>
  <div
  style={{
  display: values.provider === 'OpenAI' ? 'block' : 'none',

src/common/components/icons/DeepSeekIcon.tsx

@@ -0,0 +1,16 @@
+import { IconBaseProps } from 'react-icons'
+import Logo from '@/common/assets/images/deepseek.svg?react'
+import { createUseStyles } from 'react-jss'
+
+const useStyles = createUseStyles({
+ icon: {
+ '& path': {
+ fill: 'currentColor',
+ },
+ },
+})
+
+export function DeepSeekIcon(props: IconBaseProps) {
+ const styles = useStyles()
+ return <Logo className={styles.icon} width={props.size} height={props.size} />
+}

src/common/engines/deepseek.ts

@@ -0,0 +1,59 @@
+import { getSettings } from '../utils'
+import { AbstractOpenAI } from './abstract-openai'
+import { IModel } from './interfaces'
+
+export class DeepSeek extends AbstractOpenAI {
+ async listModels(apiKey_: string | undefined): Promise<IModel[]> {
+ let apiKey = apiKey_
+ if (!apiKey) {
+ apiKey = await this.getAPIKey()
+ }
+ const apiURL = await this.getAPIURL()
+ if (!apiKey || !apiURL) {
+ return []
+ }
+ const url = `${apiURL}/v1/models`
+ const response = await fetch(url, {
+ method: 'GET',
+ headers: {
+ 'Content-Type': 'application/json',
+ 'Authorization': `Bearer ${apiKey}`,
+ },
+ })
+ if (response.status !== 200) {
+ if (response.status === 401) {
+ throw new Error('Invalid API key')
+ }
+ if (response.status === 404) {
+ throw new Error('Invalid API URL')
+ }
+ if (response.status === 403) {
+ throw new Error('Invalid API Key')
+ }
+ throw new Error(`Failed to list models: ${response.statusText}`)
+ }
+ const json = await response.json()
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ return json.data.map((model: any) => {
+ return {
+ id: model.id,
+ name: model.id,
+ }
+ })
+ }
+
+ async getAPIModel(): Promise<string> {
+ const settings = await getSettings()
+ return settings.deepSeekAPIModel
+ }
+ async getAPIKey(): Promise<string> {
+ const settings = await getSettings()
+ return settings.deepSeekAPIKey
+ }
+ async getAPIURL(): Promise<string> {
+ return 'https://api.deepseek.com'
+ }
+ async getAPIURLPath(): Promise<string> {
+ return '/v1/chat/completions'
+ }
+}

src/common/engines/index.ts

@@ -23,6 +23,8 @@ import { ChatGLMIcon } from '@/common/components/icons/ChatGLMIcon'
 import { ChatGLM } from './chatglm'
 import { CohereIcon } from '@/common/components/icons/CohereIcon'
 import { Cohere } from './cohere'
+import { DeepSeekIcon } from '@/common/components/icons/DeepSeekIcon'
+import { DeepSeek } from './deepseek'
 
 export type Provider =
  | 'OpenAI'
@@ -37,6 +39,7 @@ export type Provider =
  | 'Kimi'
  | 'ChatGLM'
  | 'Cohere'
+ | 'DeepSeek'
 
 export const engineIcons: Record<Provider, IconType> = {
  OpenAI: RiOpenaiFill,
@@ -51,6 +54,7 @@ export const engineIcons: Record<Provider, IconType> = {
  Kimi: KimiIcon,
  ChatGLM: ChatGLMIcon,
  Cohere: CohereIcon,
+ DeepSeek: DeepSeekIcon,
 }
 
 export const providerToEngine: Record<Provider, { new (): IEngine }> = {
@@ -66,6 +70,7 @@ export const providerToEngine: Record<Provider, { new (): IEngine }> = {
  Kimi: Kimi,
  ChatGLM: ChatGLM,
  Cohere: Cohere,
+ DeepSeek: DeepSeek,
 }
 
 export function getEngine(provider: Provider): IEngine {

src/common/types.ts

@@ -72,6 +72,8 @@ export interface ISettings {
  geminiAPIModel: string
  moonshotAPIKey: string
  moonshotAPIModel: string
+ deepSeekAPIKey: string
+ deepSeekAPIModel: string
  autoTranslate: boolean
  defaultTranslateMode: Exclude<TranslateMode, 'big-bang'> | 'nop'
  defaultTargetLanguage: string

src/common/utils.ts

@@ -105,6 +105,8 @@ const settingKeys: Record<keyof ISettings, number> = {
  chatglmRefreshToken: 1,
  cohereAPIKey: 1,
  cohereAPIModel: 1,
+ deepSeekAPIKey: 1,
+ deepSeekAPIModel: 1,
  fontSize: 1,
  uiFontSize: 1,
  iconSize: 1,