update for shrink image size.

APP/src/app/features/expense/services/expense-api.service.ts

@@ -1,7 +1,8 @@
 import { Injectable } from '@angular/core';
 import { HttpClient, HttpParams } from '@angular/common/http';
-import { Observable } from 'rxjs';
+import { Observable, from, switchMap } from 'rxjs';
 import { ApiConfigService } from '../../../core/services/api-config.service';
+import { ImageUtils } from '../../../shared/utilities/image-utils';
 import {
   PagedResult, ExpenseListItemDto, ExpenseDto, CreateExpenseRequest, UpdateExpenseRequest,
   RejectExpenseRequest, PayExpenseRequest,
@@ -39,8 +40,15 @@ export class ExpenseApiService {
   reject(id: number, r: RejectExpenseRequest): Observable<void> { return this.http.post<void>(`${this.endpoint}/${id}/reject`, r); }
   pay(id: number, r: PayExpenseRequest): Observable<void> { return this.http.post<void>(`${this.endpoint}/${id}/pay`, r); }
   uploadReceipt(id: number, file: File): Observable<void> {
-    const form = new FormData(); form.append('file', file);
-    return this.http.post<void>(`${this.endpoint}/${id}/receipt`, form);
+    // Resize/re-encode phone photos client-side first — a raw 12MP camera JPEG
+    // is several MB and would 413 on mobile. PDFs pass through untouched.
+    return from(ImageUtils.compressForUpload(file)).pipe(
+      switchMap(prepared => {
+        const form = new FormData();
+        form.append('file', prepared);
+        return this.http.post<void>(`${this.endpoint}/${id}/receipt`, form);
+      }),
+    );
   }
   /**
    * Fetches the receipt as a Blob via HttpClient so the auth interceptor attaches