fix: can't set proxy for email account (IMAP) #326

web/src/api/account/api.ts

@@ -152,7 +152,6 @@ export interface AccountModel {
     created_user_email: string;
     created_at: number;
     updated_at: number;
-    use_proxy?: number;
     use_dangerous: boolean;
     pgp_key?: string;
     imap_quota_window?: QuotaWindow;

web/src/features/accounts/account-new.tsx

@@ -111,12 +111,14 @@ export function AccountNewPage() {
 
   const onSubmit = useCallback(
     (data: AccountFormValues) => {
+      const { use_proxy, ...imapRest } = data.imap;
       createMutation.mutate({
         email: data.email,
         account_name: data.account_name,
         login_name: data.login_name,
         imap: {
-          ...data.imap,
+          ...imapRest,
+          use_proxy,
           auth: {
             ...data.imap.auth,
             password: data.imap.auth.auth_type === 'OAuth2' ? undefined : data.imap.auth.password,

web/src/features/accounts/account-settings-page.tsx

@@ -44,15 +44,12 @@ const emptyImap = {
   port: 0,
   encryption: "None" as const,
   auth: { auth_type: "Password" as const, password: undefined },
-  use_proxy: undefined,
+  use_proxy: null,
 };
 
 function mapAccountToFormValues(account: AccountModel): AccountFormValues {
   const imap = { ...(account.imap ?? emptyImap) };
   imap.auth = { ...imap.auth, password: undefined };
-  if ((imap as any).use_proxy === null) {
-    (imap as any).use_proxy = undefined;
-  }
 
   return {
     account_name: account.account_name ?? undefined,
@@ -137,12 +134,14 @@ export function AccountSettingsPage({ accountId }: AccountSettingsPageProps) {
 
   const onSubmit = useCallback(
     (data: AccountFormValues) => {
+      const { use_proxy, ...imapRest } = data.imap;
       const payload: Record<string, any> = {
         email: data.email,
         account_name: data.account_name,
         login_name: data.login_name,
         imap: {
-          ...data.imap,
+          ...imapRest,
+          use_proxy,
           auth: {
             ...data.imap.auth,
             password: data.imap.auth.auth_type === 'OAuth2'

web/src/features/accounts/components/tab-server.tsx

@@ -37,6 +37,7 @@ import {
 } from "@/components/ui/select";
 import { PasswordInput } from "@/components/password-input";
 import { AccountFormValues } from "./schema";
+import useProxyList from "@/hooks/use-proxy";
 
 interface TabServerProps {
   isEdit?: boolean;
@@ -46,6 +47,7 @@ export function TabServer({ isEdit }: TabServerProps) {
   const { t } = useTranslation();
   const { control, watch } = useFormContext<AccountFormValues>();
   const authType = watch('imap.auth.auth_type');
+  const { proxyOptions } = useProxyList();
 
   return (
     <div className="space-y-6">
@@ -161,6 +163,38 @@ export function TabServer({ isEdit }: TabServerProps) {
         />
       )}
 
+      <FormField
+        control={control}
+        name="imap.use_proxy"
+        render={({ field }) => (
+          <FormItem>
+            <FormLabel>{t('accounts.useProxyOptional')}</FormLabel>
+            <Select
+              onValueChange={(v) => field.onChange(v === 'none' ? undefined : Number(v))}
+              defaultValue={field.value?.toString()}
+            >
+              <FormControl>
+                <SelectTrigger>
+                  <SelectValue placeholder={t('accounts.selectProxy')}/>
+                </SelectTrigger>
+              </FormControl>
+              <SelectContent>
+                <SelectItem key="none" value="none">{t('accounts.useNoProxy')}</SelectItem>
+                {proxyOptions.map((opt) => (
+                  <SelectItem key={opt.value} value={opt.value}>
+                    <span className="max-w-[280px] truncate block" title={opt.label}>
+                      {opt.label}
+                    </span>
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+            <FormDescription>{t('accounts.imapProxy')}</FormDescription>
+            <FormMessage />
+          </FormItem>
+        )}
+      />
+
       <FormField
         control={control}
         name="use_dangerous"