diff --git a/CHANGELOG.md b/CHANGELOG.md index cb199dc..a9923f7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,6 +18,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - `auth_service.py` `get_google_user_info` now returns `access_token`, `refresh_token`, `expires_in`, and `scope` alongside user info so the login endpoint can persist Gmail credentials in the same request. ### Fixed +- Fixed mailbox edit form: username field was marked `required` but was never pre-populated (the backend intentionally excludes credentials from responses), making it impossible to save edits without re-entering the username. In edit mode the username is now pre-populated with the account's `email_address`, marked as `required` only when creating, and rendered as disabled together with the other immutable connection fields (protocol, host, port, Use SSL/TLS). The Auto-Detect button is also hidden in edit mode since server settings are locked after creation. +- Fixed mailbox edit form silently overwriting stored credentials with an empty string: when the password field was left blank during an edit the frontend sent `password: ""`, which the backend encrypted and stored, locking the user out. The frontend now only includes `password` in the update payload when it is non-empty, and the backend additionally guards against empty-string passwords. +- Fixed mailbox edit form sending all `MailAccountCreate` fields (including immutable ones like `username`, `host`, `port`) on update requests. The submit handler now builds a `MailAccountUpdate` payload containing only the fields the backend accepts for update (`name`, `forward_to`, `delivery_method`, `is_enabled`, `check_interval_minutes`, `max_emails_per_check`, `delete_after_forward`, and optionally `password`). - Gmail API `verify_access()` returning 403 for tokens that lacked a read-capable scope: added `gmail.readonly` to all scope lists. - Fixed three ESLint errors that caused CI to fail: removed unused `_setUser` store binding and unused `useAuthStore` import from `login/page.tsx`; replaced unused `_err` catch binding with a bare `catch {}` in `login/page.tsx`; removed a `useEffect` in `settings/page.tsx` that called `setProfileForm` synchronously (flagged by `react-hooks/set-state-in-effect`) — the effect was redundant because `useState` already initialises the form from the auth store's `user` object, which is the same value passed as `initialData` to `useQuery`. diff --git a/backend/app/api/v1/endpoints/mail_accounts.py b/backend/app/api/v1/endpoints/mail_accounts.py index f5f28b2..196b142 100644 --- a/backend/app/api/v1/endpoints/mail_accounts.py +++ b/backend/app/api/v1/endpoints/mail_accounts.py @@ -146,9 +146,9 @@ async def update_mail_account( update_data = account_update.model_dump(exclude_unset=True) if "password" in update_data: - update_data["encrypted_password"] = encrypt_credential( - update_data.pop("password") - ) + password = update_data.pop("password") + if password: # Only update when a non-empty password is provided + update_data["encrypted_password"] = encrypt_credential(password) for field, value in update_data.items(): setattr(account, field, value) diff --git a/docs/TODO.md b/docs/TODO.md index ee4e0f0..9b0bc4e 100644 --- a/docs/TODO.md +++ b/docs/TODO.md @@ -215,6 +215,7 @@ because the API client layer is missing. - [x] Mail accounts list with CRUD operations + enable/disable toggle - [x] Settings page — Profile, Gmail API connection, SMTP relay, Account info, Security - [x] `AddMailAccountModal` component (auto-detect, test connection, all required fields, is_enabled checkbox) +- [x] Fix `AddMailAccountModal` edit mode: pre-populate username from `email_address`; make connection fields (username, protocol, host, port, SSL) read-only; remove hard `required` on username; send only `MailAccountUpdate`-compatible payload on edit; skip empty-string password both in the frontend payload and as a backend guard - [x] `DashboardLayout` with responsive sidebar - [x] `AuthGuard` for protected routes - [x] Fix wizard grey screen (Tailwind v4 `bg-opacity` → `/75` syntax, modal restructure) diff --git a/frontend/src/components/AddMailAccountModal.tsx b/frontend/src/components/AddMailAccountModal.tsx index 8b3c834..9bf51ed 100644 --- a/frontend/src/components/AddMailAccountModal.tsx +++ b/frontend/src/components/AddMailAccountModal.tsx @@ -2,9 +2,9 @@ import { useState } from 'react'; import { useMutation, useQueryClient } from '@tanstack/react-query'; -import { mailAccountsApi, MailAccount, MailAccountCreate } from '@/lib/api'; +import { mailAccountsApi, MailAccount, MailAccountCreate, MailAccountUpdate } from '@/lib/api'; import { useAuthStore } from '@/store/authStore'; -import { X, Loader2, CheckCircle, XCircle } from 'lucide-react'; +import { X, Loader2, CheckCircle, XCircle, Lock } from 'lucide-react'; import { ProviderWizard } from './ProviderWizard'; interface AddMailAccountModalProps { @@ -17,10 +17,11 @@ type WizardStep = 'provider' | 'form'; export function AddMailAccountModal({ account, onClose }: AddMailAccountModalProps) { const queryClient = useQueryClient(); const { user } = useAuthStore(); + const isEditMode = !!account; const [testStatus, setTestStatus] = useState<'idle' | 'testing' | 'success' | 'error'>('idle'); const [testMessage, setTestMessage] = useState(''); const [autoDetecting, setAutoDetecting] = useState(false); - const [wizardStep, setWizardStep] = useState(account ? 'form' : 'provider'); + const [wizardStep, setWizardStep] = useState(isEditMode ? 'form' : 'provider'); const [formData, setFormData] = useState({ name: account?.name || '', @@ -28,7 +29,7 @@ export function AddMailAccountModal({ account, onClose }: AddMailAccountModalPro protocol: account?.protocol || 'pop3_ssl', host: account?.host || '', port: account?.port || 995, - username: '', + username: account?.email_address || '', password: '', use_ssl: account?.use_ssl ?? true, use_tls: account?.use_tls ?? false, @@ -40,13 +41,19 @@ export function AddMailAccountModal({ account, onClose }: AddMailAccountModalPro delete_after_forward: account?.delete_after_forward ?? true, }); + const onMutationSuccess = () => { + queryClient.invalidateQueries({ queryKey: ['mail-accounts'] }); + onClose(); + }; + const createMutation = useMutation({ - mutationFn: (data: MailAccountCreate) => - account ? mailAccountsApi.update(account.id, data) : mailAccountsApi.create(data), - onSuccess: () => { - queryClient.invalidateQueries({ queryKey: ['mail-accounts'] }); - onClose(); - }, + mutationFn: (data: MailAccountCreate) => mailAccountsApi.create(data), + onSuccess: onMutationSuccess, + }); + + const updateMutation = useMutation({ + mutationFn: (data: MailAccountUpdate) => mailAccountsApi.update(account!.id, data), + onSuccess: onMutationSuccess, }); const handleChange = (e: React.ChangeEvent) => { @@ -138,7 +145,26 @@ export function AddMailAccountModal({ account, onClose }: AddMailAccountModalPro const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); try { - await createMutation.mutateAsync(formData); + if (isEditMode) { + // For updates only send the fields the backend allows changing. + // Never send an empty password – the backend treats a non-empty value + // as an intentional credential change. + const updateData: MailAccountUpdate = { + name: formData.name, + forward_to: formData.forward_to, + delivery_method: formData.delivery_method, + is_enabled: formData.is_enabled, + check_interval_minutes: formData.check_interval_minutes, + max_emails_per_check: formData.max_emails_per_check, + delete_after_forward: formData.delete_after_forward, + }; + if (formData.password) { + updateData.password = formData.password; + } + await updateMutation.mutateAsync(updateData); + } else { + await createMutation.mutateAsync(formData); + } } catch (error) { const errorMessage = error instanceof Error && 'response' in error ? (error as { response?: { data?: { detail?: string } } }).response?.data?.detail @@ -157,7 +183,7 @@ export function AddMailAccountModal({ account, onClose }: AddMailAccountModalPro

- {account ? 'Edit Mail Account' : 'Add Mail Account'} + {isEditMode ? 'Edit Mail Account' : 'Add Mail Account'}

- {wizardStep === 'provider' && !account ? ( + {wizardStep === 'provider' && !isEditMode ? ( setWizardStep('form')} /> ) : (
- {!account && ( + {!isEditMode && ( + {!isEditMode && ( + + )}
+ {isEditMode && ( +

+ + Username and server settings cannot be changed after creation. +

+ )}
@@ -234,9 +269,9 @@ export function AddMailAccountModal({ account, onClose }: AddMailAccountModalPro name="password" value={formData.password} onChange={handleChange} - required={!account} + required={!isEditMode} className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" - placeholder={account ? 'Leave blank to keep current password' : 'Password'} + placeholder={isEditMode ? 'Leave blank to keep current password' : 'Password'} />
@@ -249,7 +284,8 @@ export function AddMailAccountModal({ account, onClose }: AddMailAccountModalPro name="protocol" value={formData.protocol} onChange={handleChange} - className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" + disabled={isEditMode} + className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:bg-gray-50 disabled:text-gray-500 disabled:cursor-not-allowed" > @@ -267,8 +303,9 @@ export function AddMailAccountModal({ account, onClose }: AddMailAccountModalPro name="host" value={formData.host} onChange={handleChange} - required - className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" + required={!isEditMode} + disabled={isEditMode} + className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:bg-gray-50 disabled:text-gray-500 disabled:cursor-not-allowed" placeholder="pop.gmail.com" /> @@ -282,8 +319,9 @@ export function AddMailAccountModal({ account, onClose }: AddMailAccountModalPro name="port" value={formData.port} onChange={handleChange} - required - className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" + required={!isEditMode} + disabled={isEditMode} + className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:bg-gray-50 disabled:text-gray-500 disabled:cursor-not-allowed" /> @@ -296,9 +334,10 @@ export function AddMailAccountModal({ account, onClose }: AddMailAccountModalPro id="use_ssl" checked={formData.use_ssl} onChange={handleChange} - className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded" + disabled={isEditMode} + className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded disabled:cursor-not-allowed" /> -