From 3fc8b044bb295eec3da7fe541ce908f0c69bd801 Mon Sep 17 00:00:00 2001
From: diced <git@diced.sh>
Date: Fri, 5 Dec 2025 19:56:05 -0800
Subject: [PATCH] fix: #926 animated compression removes animation

---
 src/components/pages/upload/uploadFiles.tsx        | 2 ++
 src/components/pages/upload/uploadPartialFiles.tsx | 2 ++
 src/lib/compress.ts                                | 7 +++++--
 src/lib/uploader/parseHeaders.ts                   | 1 +
 4 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/components/pages/upload/uploadFiles.tsx b/src/components/pages/upload/uploadFiles.tsx
index 94c0b506..4e55d1b8 100755
--- a/src/components/pages/upload/uploadFiles.tsx
+++ b/src/components/pages/upload/uploadFiles.tsx
@@ -189,6 +189,8 @@ export function uploadFiles(
   options.format !== 'default' && req.setRequestHeader('x-zipline-format', options.format);
   options.imageCompressionPercent &&
     req.setRequestHeader('x-zipline-image-compression-percent', options.imageCompressionPercent.toString());
+  options.imageCompressionFormat !== 'default' &&
+    req.setRequestHeader('x-zipline-image-compression-type', options.imageCompressionFormat);
   options.maxViews && req.setRequestHeader('x-zipline-max-views', options.maxViews.toString());
   options.addOriginalName && req.setRequestHeader('x-zipline-original-name', 'true');
   options.overrides_returnDomain && req.setRequestHeader('x-zipline-domain', options.overrides_returnDomain);
diff --git a/src/components/pages/upload/uploadPartialFiles.tsx b/src/components/pages/upload/uploadPartialFiles.tsx
index 1599029f..5c6f6131 100755
--- a/src/components/pages/upload/uploadPartialFiles.tsx
+++ b/src/components/pages/upload/uploadPartialFiles.tsx
@@ -250,6 +250,8 @@ export async function uploadPartialFiles(
           'x-zipline-image-compression-percent',
           options.imageCompressionPercent.toString(),
         );
+      options.imageCompressionFormat !== 'default' &&
+        req.setRequestHeader('x-zipline-image-compression-type', options.imageCompressionFormat);
       options.maxViews && req.setRequestHeader('x-zipline-max-views', options.maxViews.toString());
       options.addOriginalName && req.setRequestHeader('x-zipline-original-name', 'true');
       options.overrides_returnDomain &&
diff --git a/src/lib/compress.ts b/src/lib/compress.ts
index 1328d524..b871632a 100755
--- a/src/lib/compress.ts
+++ b/src/lib/compress.ts
@@ -1,3 +1,4 @@
+import { extname } from 'path';
 import sharp from 'sharp';
 
 export const COMPRESS_TYPES = ['jpg', 'jpeg', 'png', 'webp', 'jxl'] as const;
@@ -22,7 +23,9 @@ export function checkOutput(type: CompressType): boolean {
 export async function compressFile(filePath: string, options: CompressOptions): Promise<CompressResult> {
   const { quality, type } = options;
 
-  const image = sharp(filePath).withMetadata();
+  const animated = ['.gif', '.webp', '.avif', '.tiff'].includes(extname(filePath).toLowerCase());
+
+  const image = sharp(filePath, { animated }).withMetadata();
 
   const result: CompressResult = {
     mimetype: '',
@@ -56,7 +59,7 @@ export async function compressFile(filePath: string, options: CompressOptions):
       break;
   }
 
-  await sharp(buffer).toFile(filePath);
+  await sharp(buffer, { animated }).toFile(filePath);
 
   return result;
 }
diff --git a/src/lib/uploader/parseHeaders.ts b/src/lib/uploader/parseHeaders.ts
index 5a08f21f..0bbb52a6 100755
--- a/src/lib/uploader/parseHeaders.ts
+++ b/src/lib/uploader/parseHeaders.ts
@@ -185,6 +185,7 @@ export function parseHeaders(headers: UploadHeaders, fileConfig: Config['files']
 
   const imageCompressionPercent = headers['x-zipline-image-compression-percent'];
   const imageCompressionType = headers['x-zipline-image-compression-type'];
+
   if (imageCompressionType) {
     if (!imageCompressionPercent)
       return headerError(